Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Types in Real Life
Search
Sibelius Seraphini
July 13, 2018
Technology
3
260
Types in Real Life
Practical approve to types in javascript
Sibelius Seraphini
July 13, 2018
Tweet
Share
More Decks by Sibelius Seraphini
See All by Sibelius Seraphini
⛔ No Cloud: how Woovi moved from the Cloud to its own servers
sibelius
0
550
React Colocation
sibelius
1
240
The Frontend Dichotomy
sibelius
4
680
React Native Bridges Architectures
sibelius
1
1.3k
What's next?
sibelius
2
620
ReactConfBR - Is Relay Modern the Future?
sibelius
2
850
Other Decks in Technology
See All in Technology
第13回 Data-Centric AI勉強会, 画像認識におけるData-centric AI
ksaito_osx
0
360
Datadogとともにオブザーバビリティを布教しよう
mego2221
0
130
5分で紹介する生成AIエージェントとAmazon Bedrock Agents / 5-minutes introduction to generative AI agents and Amazon Bedrock Agents
hideakiaoyagi
0
220
[2025-02-07]生成AIで変える問い合わせの未来 〜チームグローバル化の香りを添えて〜
tosite
1
290
AndroidXR 開発ツールごとの できることできないこと
donabe3
0
110
家電アプリ共通PF "Linova" のAPI利用とPostman活用事例ご紹介
yukiogawa
0
130
飲食店予約台帳を支えるインタラクティブ UI 設計と実装
siropaca
6
1.4k
インフラをつくるとはどういうことなのか、 あるいはPlatform Engineeringについて
nwiizo
5
2.1k
2.5Dモデルのすべて
yu4u
2
610
30分でわかる『アジャイルデータモデリング』
hanon52_
9
2.2k
RSNA2024振り返り
nanachi
0
500
Platform Engineeringは自由のめまい
nwiizo
4
1.9k
Featured
See All Featured
How GitHub (no longer) Works
holman
313
140k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
251
21k
The Cult of Friendly URLs
andyhume
78
6.2k
Side Projects
sachag
452
42k
Embracing the Ebb and Flow
colly
84
4.6k
Code Review Best Practice
trishagee
66
17k
Site-Speed That Sticks
csswizardry
3
370
Bash Introduction
62gerente
610
210k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
8
270
YesSQL, Process and Tooling at Scale
rocio
171
14k
Navigating Team Friction
lara
183
15k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
33
2.8k
Transcript
Types in Real Life How to improve your dev workflow
Sibelius Seraphini
Sibelius Seraphini @sibelius @sseraphini 2
- Motivation - Basics - Sum types - Generics -
REST api study case - React - Redux - Utilities Outline 3
Type System in JS 4
- Less bugs - More maintainability - Type Driven Development
Motivation 5
- Better tools support - Code completion - Refactor -
Documentation - Jump to definition Motivation 6
- 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
Typing a variable 8
Typing a function 9
Typing an object 10
Nominal Typing 11 - C++, Java, Swift
Structural Typing 12 - OCaml, Haskell, Elm
Typing an array 13
Sum/Union Type 14
Intersection Type 15
- How to type a function that can be used
for any type of array (int[], string[], number[])? Generics 16
Generics 17
18 Optional type
- type the input - api body payload - headers
- query string Typing a REST API 19
- 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
Typing a REST api 21
Typing a REST api 22
Typing a React Component 23
Typing a React Component (TS) 24
Typing a React Component 25
Typing a HOC 26
Typing Redux 27
Typing Redux 28
Typing Redux 29
Flow Type Utilities 30
TypeScript Utilities Mapped Types 31
TypeScript Utilities Conditional Typing 32
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
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
Resources 35 - https://transform.now.sh/json-to-flow-typ es/
I didn't mention 36 - More about Type Theory -
Functional Programming - Types + Functional - Fantasy Land specs - Realworld problems and solutions
Sibelius