Se ha denunciado esta presentación.
Utilizamos tu perfil de LinkedIn y tus datos de actividad para personalizar los anuncios y mostrarte publicidad más relevante. Puedes cambiar tus preferencias de publicidad en cualquier momento.

Scenic City Summit 2018 - TypeScript 101

170 visualizaciones

Publicado el

I presented this at Scenic City Summit in Chattanooga, TN from 9:25 am to 10:15 am on August 17th, 2018.

Publicado en: Tecnología
  • How to improve brain memory power naturally? Boost your brainpower with brain pill now... ▲▲▲ https://tinyurl.com/brainpill101
       Responder 
    ¿Estás seguro?    No
    Tu mensaje aparecerá aquí

Scenic City Summit 2018 - TypeScript 101

  1. 1. A brief class that introduces the benefits TypeScript provides to large scale projects. Prerequisites: JavaScript 202 TypeScript 101
  2. 2. Hi, I’m Frances (your professor)! ! Software Engineer @slackhq @fvcproductions 🐳
  3. 3. @fvcproductions
  4. 4. Hi, I’m Frances (your professor)! ! @fvcproductions
  5. 5. Norfolk, VA @fvcproductions
  6. 6. @fvcproductions fvcproductions fvcproductions.com hello@fvcproductions.com
  7. 7. The Syllabus 📝 @fvcproductions
  8. 8. Prerequisites (1) “JavaScript 202” & lil bitty math (2) Some open-mindedness (3) The TypeScript compiler @fvcproductions
  9. 9. Grading @fvcproductions Pass/Fail
  10. 10. Learning Objectives 1. To identify the key benefits and traits of TypeScript. 🗝 2. To be able to understand the role TypeScript has in the front-end ecosystem. 🌍 3. To be able to form a profession opinion on whether or not TypeScript would be useful for your projects. 🤔 @fvcproductions
  11. 11. TAs (1) Google (2) Stack Overflow (3) GitHub (4) Quora (5) Medium (6) Reddit @fvcproductions
  12. 12. Outline (1) TypeScript vs JavaScript 🎭 (2) The Rise of TypeScript’s Popularity 📈 (3) Homework Assignments 📚 @fvcproductions
  13. 13. I’ve never heard of TypeScript?! 😱 @fvcproductions
  14. 14. @fvcproductions
  15. 15. @fvcproductions
  16. 16. @fvcproductions
  17. 17. @fvcproductions
  18. 18. @fvcproductions
  19. 19. @fvcproductions
  20. 20. @fvcproductions
  21. 21. @fvcproductions
  22. 22. @fvcproductions
  23. 23. @fvcproductions
  24. 24. @fvcproductions
  25. 25. @fvcproductions
  26. 26. 60 million6 million @fvcproductions
  27. 27. • strict syntactical superset of JavaScript • programming language developed & maintained by Microsoft that is completely open-source • eases development of large scale applications written in JS with less boilerplate code & better tooling • extends JS by adding optional typing, static analysis, & interfaces to create code that's easier to maintain 📆 October 2012 @fvcproductions TypeScript is…
  28. 28. • TypeScript is not trying to replace JavaScript • TypeScript is extending JavaScript • TypeScript is not trying to replace JavaScript • TypeScript is extending JavaScript • TypeScript is not trying to replace JavaScript • TypeScript is extending JavaScript TLDR; @fvcproductions
  29. 29. (1) TypeScript vs JavaScript 🎭 .ts .js @fvcproductions
  30. 30. @fvcproductions
  31. 31. @fvcproductions
  32. 32. @fvcproductions@fvcproductions
  33. 33. The Nitty Gritty/Getting Started 💻 npm i -g typescript Installing TypeScript npm i -g tslint Installing TSLint @fvcproductions@fvcproductions
  34. 34. @fvcproductions The Nitty Gritty Continued 💻
  35. 35. Compiling our file to JS tsc multiplication.ts @fvcproductions The Nitty Gritty Continued 💻 @fvcproductions
  36. 36. Configuring options touch tsconfig.json @fvcproductions The Nitty Gritty Continued 💻 @fvcproductions
  37. 37. Abstract Syntax Trees (AST) @fvcproductions
  38. 38. @fvcproductions
  39. 39. @fvcproductions
  40. 40. @fvcproductions
  41. 41. @fvcproductions
  42. 42. JavaScript is TypeScript but TypeScript is not JavaScript. Superset vs Subset 🔘 @fvcproductions
  43. 43. @fvcproductions
  44. 44. @fvcproductions
  45. 45. The Dark Side • Missing types • especially with libraries • Not as flexible or popular as JavaScript • JavaScript is “good enough” • Having to persuade a team • Another layer of complexity @fvcproductions
  46. 46. What Types Provide ✓ modular development ✓ can be learned easily ✓ non-invasive ✓ long-term vision ✓ clean output To Type or Not To Type Pros of JavaScript • EVERYWHERE • awesome libraries • flexible Cons of JavaScript • dynamic typing • lack of modularity • verbose patterns @fvcproductions
  47. 47. To Be is To Type @fvcproductions@fvcproductions
  48. 48. My somewhat morbid dog analogy 🐾 > @fvcproductions
  49. 49. THE TODAY @fvcproductions
  50. 50. (2) The Rise of TypeScript’s Popularity 📈 @fvcproductions
  51. 51. @fvcproductions
  52. 52. @fvcproductions
  53. 53. @fvcproductions
  54. 54. @fvcproductions
  55. 55. @fvcproductions
  56. 56. @fvcproductions
  57. 57. Companies ❤ TypeScript @fvcproductions
  58. 58. Developers ❤ TypeScript @fvcproductions
  59. 59. @fvcproductions
  60. 60. What other metrics can I use? 🤔 @fvcproductions
  61. 61. @fvcproductions
  62. 62. 9 1 @fvcproductions
  63. 63. 11 3 @fvcproductions
  64. 64. "The platform no developer should live without" - me @fvcproductions
  65. 65. @fvcproductions
  66. 66. @fvcproductions
  67. 67. @fvcproductions
  68. 68. 15 Most Popular Languages On GitHub by Opened Pull Requests With Percentage Change from Previous Year @fvcproductions
  69. 69. @fvcproductions
  70. 70. @fvcproductions
  71. 71. @fvcproductions@fvcproductions
  72. 72. @fvcproductions
  73. 73. @fvcproductions
  74. 74. (3) Homework Assignments 📚 @fvcproductions
  75. 75. 📚📚📚 @fvcproductions
  76. 76. Option 1. 🎓 Finish the Google Codelab @fvcproductions
  77. 77. @fvcproductions
  78. 78. @fvcproductions
  79. 79. @fvcproductions
  80. 80. @fvcproductions
  81. 81. Option 2. 🎙 Podcasts 📖 Books @fvcproductions
  82. 82. Option 3. 🎥 Watch the creator of TypeScript talk about TypeScript at the #MSBuild Conference “What’s New In TypeScript 2018” by Anders Hejlsberg @fvcproductions
  83. 83. Bonus Option. 🎮 Screw homework and go play instead! typescriptlang.org/play @fvcproductions
  84. 84. @fvcproductions
  85. 85. @fvcproductions
  86. 86. @fvcproductions
  87. 87. Learning Objectives 1. To identify the key benefits and traits of TypeScript. 🗝 2. To be able to understand the role TypeScript has in the front-end ecosystem. 🌍 3. To be able to form a profession opinion on whether or not TypeScript would be useful for your projects. 🤔 @fvcproductions
  88. 88. So did I pass? 😂 @fvcproductions You pass if you take the time to explore TypeScript out yourself and form your own professional opinion.
  89. 89. Thanks for listening! 🍫🍓 @fvcproductions fvcproductions in/fvcproductions Slides will be uploaded ASAP to slideshare.net/fvcproductions
  90. 90. Readings & References 1. TypeScript Official Website: http://www.typescriptlang.org/ 2. Severus Snape Video: https://www.youtube.com/watch?v=PnOyBLT07R8 3. GitHub Icon: https://www.iconfinder.com/iconsets/ionicons 4. Twitter & LinkedIn Icons: https://www.iconfinder.com/iconsets/free-social- icons 5. Fonts: Segoe UI, SF Pro Text, Input Mono 6. Google Trends: https://g.co/trends/2M11R 7. TypeScript and JavaScript Logos: egghead.io 8. Stack Overflow 2017 Survey: https://insights.stackoverflow.com/survey/ 2017 9. TypeScript GIFs: http://twittervideodownloader.com/ & @typescriptlang 10. EdX Course: https://www.edx.org/course/introduction-typescript-2- microsoft-dev273x-0#! 11. List of Editors: https://www.wikiwand.com/en/TypeScript 12. Olgierd Dziamski: https://www.quora.com/What-are-some-good-reasons- to-switch-from-JavaScript-to-Typescript/answer/Olgierd-Dziamski? share=c21b06e4&srid=nukj 13. Kashif Saeed https://www.quora.com/What-are-some-good-reasons-to- switch-from-JavaScript-to-Typescript/answer/Kashif-Saeed-8? share=88d55481&srid=nukj 14. Maciej Dziardziel,: https://www.quora.com/Does-TypeScript-fix-the- problems-JavaScript-has-Will-it-become-common-to-use-on-top-of- JavaScript/answer/Maciej-Dziardziel?share=54019b5c&srid=nukj 15. Pass/Fail Icon: https://icons8.com/icon/46878/test-zum-teil-absolviert 16. Carbon.sh https://carbon.now.sh 17. TypeScript Deep Dive: https://basarat.gitbooks.io/typescript/content/ docs/getting-started.html 18. SitePen: https://www.sitepen.com/ 19. What’s New in TypeScript: https://www.youtube.com/watch?v=hDACN- BGvI8 20. Quokka: https://quokkajs.com/ @fvcproductions

×