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
280
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
670
React Colocation
sibelius
1
270
The Frontend Dichotomy
sibelius
4
710
React Native Bridges Architectures
sibelius
1
1.3k
What's next?
sibelius
2
630
ReactConfBR - Is Relay Modern the Future?
sibelius
2
880
Other Decks in Technology
See All in Technology
メモ整理が苦手な者による頑張らないObsidian活用術
optim
0
140
ML Pipelineの開発と運用を OpenTelemetryで繋ぐ @ OpenTelemetry Meetup 2025-07
getty708
0
300
Snowflake のアーキテクチャは本当に筋がよかったのか / Data Engineering Study #30
indigo13love
0
270
生成AIによる情報システムへのインパクト
taka_aki
1
190
AIコードアシスタントとiOS開発
jollyjoester
1
240
Webの技術とガジェットで那須の子ども達にワクワクを! / IoTLT_20250720
you
PRO
0
130
今日からあなたもGeminiを好きになる
subaruhello
1
640
TypeScript 上達の道
ysknsid25
22
4.7k
Semantic Machine Intelligence for Vision, Language, and Actions
keio_smilab
PRO
2
410
Kiro Hookを Terraformで検証
ao_inoue
0
130
自分がLinc’wellで提供しているプロダクトを理解するためにやったこと
murabayashi
1
160
Jitera Company Deck / JP
jitera
0
210
Featured
See All Featured
Embracing the Ebb and Flow
colly
86
4.8k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
48
2.9k
Become a Pro
speakerdeck
PRO
29
5.4k
Agile that works and the tools we love
rasmusluckow
329
21k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
The Cost Of JavaScript in 2023
addyosmani
51
8.6k
Building Applications with DynamoDB
mza
95
6.5k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
656
60k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.8k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.8k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
44
2.4k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
50
5.5k
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