Using Typescript at scale

Typescript

for Asgardians

(of the Galaxy)

VOL.2

Charlie L

Sr Software Engineer at Humu

@charliesbot

Co-host @Los Full Stackers podcast

What's new with Typescript?

The biggest news in 2018

 
  • Typescript 3.4!
    • Incremental flag
  • TSLint is deprecated. ESLint is the way to go
  • TS has a Babel plugin
  • Node creator is working in Deno, which uses TS
  • Vue is moving from Flow to Typescript 🎉
  • Apollo GraphQL just provides TS definitions
OUTDATED

The biggest news in 2020

 
  • Typescript 4.1!
    • Template Literal Types
    • Short-Circuiting Assignment Operators
  • Svelte and Vue 3 with full TS support 🎉
  • Deno reached v1.0 (runtime from the creator of NodeJS)
  • TS is the fourth most used language in Github 🤯

The fight is over. Really.

So... what is TypeScript?

TS is a superset of JS

JS
TS

Why you should TS too!

 
  • Types improve code clarity
  • Refactor becomes a breeze
  • Tons of companies are betting in TS: Asana, Lyft, Atlassian, Microsoft (ofc), Humu, AirBnB, Google, and so on
  • If you hate to see undefined is not a function, you'll love TS

This is not another intro to TS

Our lightning journey

  • Type Literals
  • Control flow
  • Generics
let aString = "I'm a string";
let aNumber = 1;
let aBoolean = true;
// string
// number
// boolean
const aString = "I'm a string";
const aNumber = 1;
const aBoolean = true;
// "I'm a string"
// 1
// true

Type literals

It's a type definition whose type is any value you'd simply type out exactly

Unions

They describe a value that can be one of several types (|)

type Animal = 'cat' | 'dog' | 'fish';

Control flow

Live coding

(Why not?)

Generics

 

They help us to create a component that can work over a variety of types rather than a single one.

// How can we reuse this function for every single type
// that you could imagine? 🤔

function identity(x) {
    return x;
}

Live coding

Agaaaaain

Let's wrap this up

There's more (a lot more)

 

  • Mapped types
  • Type guards
  • Utilities (Pick, Exclude, ReturnType)
  • Libraries already typed!

Advanced TS techniques help you to

  • Enforce guidelines
  • Be confident about your code
  • Document what you do on the way
  • Speed up your PRs!
  • Refactor

Charlie L

Twitter: @charliesbot

Podcast: Los Full Stackers

https://github.com/charliesbot/typescript-for-asgardians

Typescript for Asgardians

By Carlos Lopez

Made with Slides.com

Typescript for Asgardians

  • 1,131

More from Carlos Lopez