Upgrade to Pro — share decks privately, control downloads, hide ads and more …

TypeScript - JavaScript you are gonna to love

TypeScript - JavaScript you are gonna to love

TypeScript, as the superset of JS uses compile-time type checkings with latest specification standard and proposals. The community chose it for thousands of projects, and it is not limited to the Angular ecosystem. It brings such powerful features like interfaces, generics, abstract classes into JS. With all-powerful tooling, it will make your JavaScript, React, Vue cleaner and less error-prone. It could involve back-end developers with Java or C# background into the client-side code. I want to show that with TypeScript you will be more productive no matter what front end technology you use.

Vitalii Bobrov

May 09, 2018
Tweet

More Decks by Vitalii Bobrov

Other Decks in Programming

Transcript

  1. TypeScript: JavaScript you are
    gonna to love

    View full-size slide

  2. Who am I?
    ๏5 years of front-end experience
    ๏big enterprise projects
    ๏mentor
    ๏OSS contributor
    @bobrov1989
    https://vitaliy-bobrov.github.io/

    View full-size slide

  3. Agenda
    ๏WTF TypeScript!?
    ๏Type system
    ๏How to Start?
    ๏Tooling
    ๏Integrations

    View full-size slide

  4. WTF TypeScript!?

    View full-size slide

  5. Trivial Problem

    View full-size slide

  6. JS Expression Trivia

    View full-size slide

  7. JS Expression Trivia

    View full-size slide

  8. JS Expression Trivia

    View full-size slide

  9. JS Expression Trivia

    View full-size slide

  10. There are NO DEFECTS
    if there is NO DOCs

    View full-size slide

  11. Trivial Solution

    View full-size slide

  12. jsDoc
    ๏Too verbose
    ๏Remember to update
    ๏No warnings of wrong usage

    View full-size slide

  13. TypeScript
    JavaScript ESNext Types

    View full-size slide

  14. Any JavaScript
    is VALID TypeScript

    View full-size slide

  15. WHY?
    ๏Complex projects
    ๏Static analysis
    ๏Reduce errors rate
    ๏Easy to refactor and maintain

    View full-size slide

  16. let variable: TYPE;

    View full-size slide

  17. Array & Tuple

    View full-size slide

  18. Abstract Class

    View full-size slide

  19. http://www.typescriptlang.org/docs/

    View full-size slide

  20. How to Start?

    View full-size slide

  21. REPL
    http://www.typescriptlang.org/play/index.html

    View full-size slide

  22. IDE & Text Editors

    View full-size slide

  23. Just change extension
    from .js to .ts
    %

    View full-size slide

  24. JavaScript checks

    View full-size slide

  25. TypeScript compiler

    View full-size slide

  26. tsconfig.json

    View full-size slide

  27. Parcel
    https://parceljs.org/

    View full-size slide

  28. TypeWiz
    https://github.com/urish/typewiz

    View full-size slide

  29. 3rd party libraries
    http://definitelytyped.org/

    View full-size slide

  30. https://medium.com/@martin_hotell

    View full-size slide

  31. Integrations

    View full-size slide

  32. Strictly typed REST API calls

    View full-size slide

  33. Just use TypeScript
    to write NodeJS project
    %

    View full-size slide

  34. Java / C#
    Swagger

    View full-size slide

  35. Thank YOU!

    @bobrov1989
    https://vitaliy-bobrov.github.io/

    View full-size slide