Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Empowering your React application with Flow typ...

Avatar for Olena Sovyn Olena Sovyn
December 06, 2019
Technology
0
42

Empowering your React application with Flow type system

Avatar for Olena Sovyn

Olena Sovyn

December 06, 2019
Tweet

More Decks by Olena Sovyn

See All by Olena Sovyn
Hidden Gems in Code Reviews
Avatar for Olena Sovyn kiwka
0
44
Testing, tEstIng, TeStInG or how to test React apps with generated input data
Avatar for Olena Sovyn kiwka
1
640
Building Webflow Ecommerce in 3 stories
Avatar for Olena Sovyn kiwka
0
78
Building a Chrome Extension with React
Avatar for Olena Sovyn kiwka
0
680
Understanding Recompose through examples
Avatar for Olena Sovyn kiwka
0
380
On the way to making React components more reusable
Avatar for Olena Sovyn kiwka
2
280
Using Facade pattern with JSX
Avatar for Olena Sovyn kiwka
4
380

Other Decks in Technology

See All in Technology
Flutterアプリを⾃然⾔語で操作する
Avatar for Yuki Sakai yukisakai1225
0
210
技術職じゃない私がVibe Codingで感じた、AGIが身近になる未来
Avatar for ayane blueb
0
110
メルカリにおけるデータアナリティクス AI エージェント「Socrates」と ADK 活用事例
Avatar for na0 na0
16
8.5k
Digitization部 紹介資料
Avatar for Sansan, Inc. sansan33
PRO
1
4.1k
Generational ZGCのメモリ運用改善 - その物理メモリ使用量、本当に正しい？
Avatar for Daishi Tabata tabatad
1
300
Introduction to Bill One Development Engineer
Avatar for Sansan, Inc. sansan33
PRO
0
250
現場で役立つAPIデザイン
Avatar for 草薙昭彦 nagix
1
220
dbt Cloudの新機能を紹介！データエンジニアリングの民主化：GUIで操作、SQLで管理する新時代のdbt Cloud
Avatar for Sagara sagara
0
170
Devin(Deep) Wiki/Searchの活用で変わる開発の世界観/devin-wiki-search-impact
Avatar for tomoki10 tomoki10
0
160
Roo CodeとClaude Code比較してみた
Avatar for PharmaX（旧YOJO Technologies）開発チーム pharma_x_tech
1
240
Kafka vs. Pulsar: Performance Evaluation by Petabyte-Scale Streaming Platform Providers
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
1
350
バクラクのモノレポにおける AI Coding のための環境整備と {Roo,Claude} Code活用事例 / AI Coding in Bakuraku's Monorepo: Environment Setup & Case Studies with {Roo, Claude} Code
Avatar for upamune / Yu SERIZAWA upamune
8
5.2k

Featured

See All Featured
The Art of Programming - Codeland 2020
Avatar for Erika Heidi erikaheidi
54
13k
Into the Great Unknown - MozCon
Avatar for Noah Learner thekraken
39
1.8k
Optimizing for Happiness
Avatar for Tom Preston-Werner mojombo
379
70k
Visualization
Avatar for Eitan Lees eitanlees
146
16k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
Avatar for Vitaly Friedman smashingmag
252
21k
How to Ace a Technical Interview
Avatar for Jacob Kaplan-Moss jacobian
276
23k
Rebuilding a faster, lazier Slack
Avatar for samanthasiow samanthasiow
81
9k
The Art of Delivering Value - GDevCon NA Keynote
Avatar for David Neal reverentgeek
14
1.5k
Measuring & Analyzing Core Web Vitals
Avatar for Philip Tellis bluesmoon
7
470
10 Git Anti Patterns You Should be Aware of
Avatar for Lemi Orhan Ergin lemiorhan
PRO
657
60k
Helping Users Find Their Own Way: Creating Modern Search Experiences
Avatar for Dan Newman danielanewman
29
2.6k
The Cult of Friendly URLs
Avatar for Andy Hume andyhume
79
6.4k

Transcript

  1. Empowering your React application with Flow type system Olena Sovyn

    @frontendgirl

  2. @frontendgirl

  3. None

  4. Why?

  5. Benefits 1. No unused properties 2. Improved refactoring experience 3.

    Documentation in place @frontendgirl

  6. How?

  7. None
  8. None

  9. What are the rules?

  10. 1. Be as exact as possible @frontendgirl

  11. 1. Be as exact as possible No error Error @frontendgirl

  12. 2. Spot “black holes” Black holes are functions return values

    of which have type any, even though their types can be more specific based on the function internal logic

  13. 2. Spot “black holes” . flowconfig No error eslint-plugin-flowtype @frontendgirl

  14. 3. Use meaningful type names @frontendgirl

  15. Let’s do our codebases automagically better! 1. Be as exact

    as possible 2. Spot “black holes” 3. Meaningful type names Check also: What? How? Why? 1. No unused properties 2. Improved refactoring 3. Documentation in place find and follow simple rules @frontendgirl http://frontendgirl.com/flow-best-practices/