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
60
0

Empowering your React application with Flow type system

Avatar for Olena Sovyn

Olena Sovyn

December 06, 2019

More Decks by Olena Sovyn

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

Other Decks in Technology

See All in Technology
1000⼈規模のClaude Enterprise運⽤を「Oktaのグループ」と「Slack」に集約する
Avatar for SansanTech sansantech
PRO
1
550
LLMアプリ、 雰囲気で運用してませんか？ 〜LLMOpsの現在地〜
Avatar for Takaaki Yayoi taka_aki
1
630
AI時代の「OAuth認証」にどう物申すか？（OAuth/OIDC Numa (Immersion) Workshop 2026）
Avatar for OpenID Foundation Japan oidfj
PRO
0
410
書籍『生成AIの安全性入門』の入門
Avatar for Koki Wataoka wataoka
0
150
みてねにおけるAI-DLC導入活動とAIドリブン開発の現在地/JAWS-UG AI-DLC #2
Avatar for Isao Shimizu isaoshimizu
2
320
OAuth SPIFFE Client Authentication（OAuth/OIDC Numa (Immersion) Workshop 2026）
Avatar for OpenID Foundation Japan oidfj
PRO
0
410
1.5時間を無駄にして学んだwsl2におけるaptとsnapの選択と仕組み
Avatar for y-osaka0123 yosaka0123
0
480
Guerilla InnerSource in enterprises, during the AI hype
Avatar for Oleg Nenashev onenashev
PRO
0
130
Nav2、Nav3 ... はたまた自作？〜 作って理解する Nav3 の設計意図 〜 / Nav2, Nav3 ... or Build Your Own? — Understanding Nav3's design intent by building it from scratch
Avatar for Yuki Anzai yanzm
0
110
Oracle AI Databaseデータベース・サービス: BaseDB/ExaDB-Dの可用性
Avatar for oracle4engineer oracle4engineer
PRO
1
1k
AWSとAzureのマルチクラウド活用における強い味方___AWS_Kiroを使った二刀流スキル作成.pdf
Avatar for k-kun duelist2020jp
1
160
tamachi.goを支える技術
Avatar for ryoji miyamoto rymiyamoto
0
120

Featured

See All Featured
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
12
1.3k
Un-Boring Meetings
Avatar for Sebastian Deterding codingconduct
0
400
How to Ace a Technical Interview
Avatar for Jacob Kaplan-Moss jacobian
281
24k
First, design no harm
Avatar for Per Axbom axbom
PRO
2
1.3k
Performance Is Good for Brains [We Love Speed 2024]
Avatar for Tammy Everts tammyeverts
12
1.8k
Done Done
Avatar for chrislema chrislema
186
16k
Accessibility Awareness
Avatar for Sarah Abderemane sabderemane
1
190
Building a Modern Day 
E-commerce SEO Strategy
Avatar for Aleyda Solis aleyda
45
9.2k
The Anti-SEO Checklist Checklist. Pubcon Cyber Week
Avatar for Ryan Jones ryanjones
0
220
The agentic SEO stack - context over prompts
Avatar for schlessera schlessera
0
880
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
Avatar for Kevin Liebholz kevinliebholz
37
6.6k
SEO for Brand Visibility & Recognition
Avatar for Aleyda Solis aleyda
0
4.7k

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/