Pro Yearly is on sale from $80 to $50! »

It's time to migrate | JS () => TS

It's time to migrate | JS () => TS

TypeScript adoption it's been a reality in the last years. This presentation is going to be an explanation on how we can take advantage of TypeScript compiler to have a smooth migration from JavaScript to TypeScript.


Marco Talento

February 02, 2019


  1. It's time to migrate! Marco Talento @Talento90

  2. TypeScript (JavaScript that scales)

  3. TypeScript • TypeScript is a typed superset of JavaScript that

    compiles to plain JavaScript. • Includes all features of ES6 and much more: types, interfaces, generics, etc... TypeScript ES6 ES5
  4. How to "TypeScript" 1. Install TypeScript and declarations (If necessary):

    ◦ npm install --save-dev typescript ◦ npm install --save-dev @types/node 2. Create file index.ts 3. Compile using the command line: node_modules/.bin/tsc index.ts --target es6 4. Run the result: node index.js
  5. TypeScript (index.ts)

  6. JavaScript (index.js)

  7. Declaration Files

  8. Declaration Files • Declaration files describe a library written in

    JavaScript (methods, properties) • Provides intellisense and module typification • Extra confidence when updating libraries • Declaration files are suffixed by “.d.ts” • Install external declaration files using npm: ◦ npm install @types/koa --save-dev
  9. None
  10. Developer Experience

  11. Types Prevent Bugs

  12. None
  13. None
  14. Refactor Code

  15. None
  16. IntelliSense

  17. None
  18. Migration Journey

  19. Migration Goal

  20. Migration Plan 1. Install TypeScript (npm i --save-dev) 2. Install

    declarations (npm i --save-dev @types/node @types/hapi) 3. Setup tsconfig.json (node_modules/.bin/tsc --init) ◦ allowJs - Allow javascript files to be compiled ◦ checkJs - Report errors in .js files (optional) 4. Start rename *.js file to *.ts 5. Fix errors and back to step 4
  21. Migration Time (DEMO)

  22. Recap

  23. Convert JS files to TS and enable AllowJS

  24. Enable CheckJS to report JavaScript Errors

  25. Enable Strict Type Checking Options

  26. Thank you! @Talento90