Introdução ao TypeScript + React

Guilherme Oenning@goenning

http://goenning.netNov/2016

TypeScript+ React

O que é o TypeScript?

O que é o TypeScript?TypeScript

TypesDecorators

Async / Await

ES6Classes

Template String, Arrows, Let + Const...

ES5

ES3

• JavaScript that scales...• Superset de JavaScript;• ”Compila” para ES3, ES5 ou ES6• Suporte à recursos ES.Next• Introdução de tipagem ao

JavaScript;

Código JavaScript é TypeScript

+ TypeScript.

TypeScript compila para JavaScript

Em tempo de execução.

Código TypeScript é seguro

Em tempo de compilação

TypeScript é flexível

TypeScript é seu primeiro teste unitário

TypeScript + IDE

JavaScript de hoje: Promises + Callbacks

JavaScript do Futuro...

JavaScript do Futuro... disponível hoje

Mas nem tudo é perfeito• Não achou as definições de tipos

para a biblioteca X?• Escreva você mesmo e compartilhe

com a comunidade (ou não) • https://github.com/

DefinitelyTyped/DefinitelyTyped/

$ npm install react @types/react

https://www.typescriptlang.org/play/

+

Components tipados

TypeScript é React-friendly

<Demonstracao />https://github.com/goenning/code-samples/tree/master/typescript-react