Types in Real Life

Transcript

1. Types in Real Life How to improve your dev workflow

   Sibelius Seraphini

2. Sibelius Seraphini @sibelius @sseraphini 2

3. - Motivation - Basics - Sum types - Generics -

   REST api study case - React - Redux - Utilities Outline 3

4. Type System in JS 4

5. - Less bugs - More maintainability - Type Driven Development

   Motivation 5

6. - Better tools support - Code completion - Refactor -

   Documentation - Jump to definition Motivation 6

7. - Types are set of values - string - 'a'

   | 'b' | 'c' | ... - number - 1 | 2 | 3 | ... - boolean - true | false - function - string -> boolean | ... - object - { a: string, b: number } | ... What are Types? 7

8. Typing a variable 8

9. Typing a function 9

10. Typing an object 10

11. Nominal Typing 11 - C++, Java, Swift

12. Structural Typing 12 - OCaml, Haskell, Elm

13. Typing an array 13

14. Sum/Union Type 14

15. Intersection Type 15

16. - How to type a function that can be used

    for any type of array (int[], string[], number[])? Generics 16

17. Generics 17

18. 18 Optional type

19. - type the input - api body payload - headers

    - query string Typing a REST API 19

20. - type the output (response) - Get a json output

    of a REST api - Transform json to types - https://transform.now.sh/json-to-flo w-types/ Typing a REST API 20

21. Typing a REST api 21

22. Typing a REST api 22

23. Typing a React Component 23

24. Typing a React Component (TS) 24

25. Typing a React Component 25

26. Typing a HOC 26

27. Typing Redux 27

28. Typing Redux 28

29. Typing Redux 29

30. Flow Type Utilities 30

31. TypeScript Utilities Mapped Types 31

32. TypeScript Utilities Conditional Typing 32

33. Resources 33 - https://github.com/entria/guidelines/tree/ master/flow - https://flow.org/en/docs/lang/ - https://www.typescriptlang.org/docs/ho me.html

    - https://github.com/fantasyland/fantasy-l and - https://github.com/gcanti/flow-static-land

34. Resources 34 - https://medium.com/javascript-scene/m aster-the-javascript-interview-what-is-fu nctional-programming-7f218c68b3a0 - https://medium.com/@matthiasak/state- of-the-union-js-d664bdbffd14 -

    https://mitpress.mit.edu/books/types-an d-programming-languages - https://github.com/niieani/typescript-vs-fl owtype

35. Resources 35 - https://transform.now.sh/json-to-flow-typ es/

36. I didn't mention 36 - More about Type Theory -

    Functional Programming - Types + Functional - Fantasy Land specs - Realworld problems and solutions

37. Sibelius