Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

TypeScript 101 - Women Who Code - CONNECT 2018

382 views

Published on

Presented April 28th, 2018

I presented a 10-minute lightning talk version of my "TypeScript 101" talk that serves as a short introduction to TypeScript and the benefits it provides to large-scale projects.

Published in: Technology
  • Be the first to comment

TypeScript 101 - Women Who Code - CONNECT 2018

  1. 1. A brief class that introduces the benefits TypeScript provides to large scale projects. Prerequisites: JavaScript 202 TypeScript 101
  2. 2. ๐ŸŽ“ Professor Frances Coronel @fvcproductions fvcproductions in/fvcproductions
  3. 3. Syllabus (1) TypeScript vs JavaScript ๐ŸŽญ (2) The Rise of TypeScriptโ€™s Popularity ๐Ÿ“ˆ (3) Homework Assignments ๐Ÿ“š @fvcproductions
  4. 4. W8, what is TypeScript? ๐Ÿค” @fvcproductions
  5. 5. 60 million6 million
  6. 6. โ€ข 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
  7. 7. (1) TypeScript vs JavaScript ๐ŸŽญ .ts .js @fvcproductions
  8. 8. @fvcproductions
  9. 9. The Nitty Gritty ๐Ÿ’ป npm i -g typescript Installing TypeScript Compiling our file to JS tsc multiplication.ts Configuring options touch tsconfig.json npm i -g tslint Optional Installing TSLint @fvcproductions
  10. 10. @fvcproductions
  11. 11. JavaScript is TypeScript but TypeScript is not JavaScript. Superset vs Subset ๐Ÿ”˜ @fvcproductions
  12. 12. Pros of TypeScript โœ” scalability โœ” less runtime errors โœ” zero overhead Cons of TypeScript โœ— small learning curve โœ— extra tooling needed โœ— extra step - compilation To Type or Not To Type Pros of JavaScript โœ” EVERYWHERE โœ” awesome libraries โœ” flexible Cons of JavaScript โœ— dynamic typing โœ— lack of modularity โœ— verbose patterns @fvcproductions
  13. 13. To Be is To Type @fvcproductions
  14. 14. (2) The Rise of TypeScriptโ€™s Popularity ๐Ÿ“ˆ @fvcproductions
  15. 15. @fvcproductions
  16. 16. Companies โค TypeScript @fvcproductions
  17. 17. Developers โค TypeScript @fvcproductions
  18. 18. @fvcproductions
  19. 19. 9 1 @fvcproductions
  20. 20. @fvcproductions 11 3
  21. 21. "The platform no developer should live without" - me @fvcproductions
  22. 22. @fvcproductions
  23. 23. 15 Most Popular Languages On GitHub by Opened Pull Requests With Percentage Change from Previous Year @fvcproductions
  24. 24. @fvcproductions
  25. 25. @fvcproductions
  26. 26. @fvcproductions
  27. 27. @fvcproductions
  28. 28. *+, @fvcproductions (3) Homework Assignments ๐Ÿ“š
  29. 29. Option 1. ๐ŸŽ“ Finish the Google Codelab @fvcproductions
  30. 30. @fvcproductions
  31. 31. @fvcproductions
  32. 32. Option 2. ๐ŸŽ™ Podcasts! @fvcproductions
  33. 33. Option 3. ๐ŸŽฅ Watch the creator of TypeScript talk about TypeScript at the #MSBuild Conference โ€œWhatโ€™s New In TypeScriptโ€ by Anders Hejlsberg @fvcproductions
  34. 34. Bonus Option. ๐ŸŽฎ Screw homework and go play instead! typescriptlang.org/play @fvcproductions
  35. 35. Thanks for listening! ๐Ÿซ๐Ÿ“ @fvcproductions fvcproductions in/fvcproductions Slides will be uploaded ASAP to slideshare.net/fvcproductions
  36. 36. Credits 1. Mathematical Finn Photo: https://glarbinator.deviantart.com/art/Mathematical-Finn-417768395 2. TypeScript Official Website: http://www.typescriptlang.org/ 3. Severus Snape Video: https://www.youtube.com/watch?v=PnOyBLT07R8 4. GitHub Icon: https://www.iconfinder.com/iconsets/ionicons 5. Twitter & LinkedIn Icons: https://www.iconfinder.com/iconsets/free-social-icons 6. Fonts: Segoe UI, SF Pro Text, Input Mono 7. Google Trends: https://g.co/trends/2M11R 8. TypeScript and JavaScript Logos: egghead.io 9. Stack Overflow 2017 Survey: https://insights.stackoverflow.com/survey/2017 10. TypeScript GIFs: http://twittervideodownloader.com/ & @typescriptlang 11. EdX Course: https://www.edx.org/course/introduction-typescript-2-microsoft-dev273x-0#! 12. List of Editors: https://www.wikiwand.com/en/TypeScript @fvcproductions

ร—