Slide 1

Slide 1 text

TypeScript And let it divide the interface from the code JavaScriptures II Eloy and Sarah

Slide 2

Slide 2 text

What even is TypeScript?

Slide 3

Slide 3 text

Why did we start using TypeScript?

Slide 4

Slide 4 text

Exercises

Slide 5

Slide 5 text

Benefits (compared to js)

Slide 6

Slide 6 text

● It can make stepping into new repos less daunting Easier to get acclimated to new repos

Slide 7

Slide 7 text

● Intellisense in VSCode is slick ● [see example] Tooling

Slide 8

Slide 8 text

● When developing in TS (as opposed to normal JS), it’s clear what exactly one expects to happen Keeps code clear

Slide 9

Slide 9 text

● It’s nice to be able to easily see the schema of an application as opposed to maintaining it in your head as you go along Speeds up some parts of the dev process

Slide 10

Slide 10 text

● When you change something about your schema, you can immediately see where breaking changes exist because the type checker will throw errors Allows you to catch errors sooner

Slide 11

Slide 11 text

Drawbacks

Slide 12

Slide 12 text

● Currently involves (at least in our case) a complex dance between Babel, Webpack, Node, Jest, and possibly more. However, as we move more projects to Babel 7, we can drastically simplify this by utilising its ability to parse TypeScript code. ● To debug this sort of thing, one has to look at the docs and github issues of several different projects; there is no singular resource for TS tooling (although our Artsy Engineering blog post on the topic comes close) Setting up tooling can be tedious

Slide 13

Slide 13 text

● Most JS projects won’t. ● Over 4000 community maintained type declarations at github.com/DefinitelyTyped/DefinitelyTyped. E.g. @types/react on NPM. ● Details on how to write type declarations can be found here: www.typescriptlang.org/docs/handbook/declaration-files/introduction.html Libraries may not come with TS types

Slide 14

Slide 14 text

● https://www.typescriptlang.org/docs/handbook/basic-types.html ● https://github.com/basarat/typescript-book ● https://github.com/mike-works/typescript-fundamentals ● https://egghead.io/playlists/typescript-with-react-d922273e Helpful Links