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

React Native Code Reuse: Architecture that Works

Avatar for Aaron Greenwald Aaron Greenwald
September 13, 2016
Programming
1
850

React Native Code Reuse: Architecture that Works

Talk from React Native Tel Aviv (RN_TLV) meetup on the Wix roof, 2016/09/13

Avatar for Aaron Greenwald

Aaron Greenwald

September 13, 2016
Tweet

More Decks by Aaron Greenwald

See All by Aaron Greenwald
Learn Once, Write Anywhere: Intro to React Native (3)
Avatar for Aaron Greenwald aarongreenwald
0
440
Learn Once, Write Anywhere - Intro to React Native (2)
Avatar for Aaron Greenwald aarongreenwald
0
130
Learn Once, Write Anywhere: Intro to React Native
Avatar for Aaron Greenwald aarongreenwald
4
970

Other Decks in Programming

See All in Programming
コントリビューターによるDenoのすゝめ / Deno Recommendations by a Contributor
Avatar for petamoriken / 森建 petamoriken
0
200
副作用をどこに置くか問題：オブジェクト指向で整理する設計判断ツリー
Avatar for Koya Masuda koxya
1
610
それ、本当に安全？ ファイルアップロードで見落としがちなセキュリティリスクと対策
Avatar for ikechi penpeen
7
3.9k
OSSとなったswift-buildで Xcodeのビルドを差し替えられるため 自分でXcodeを直せる時代になっている ダイアモンド問題編
Avatar for yimajo yimajo
3
610
CSC307 Lecture 09
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
1
830
SourceGeneratorのススメ
Avatar for tkym htkym
0
190
「ブロックテーマでは再現できない」は本当か？
Avatar for Takashi Kitajima inc2734
0
970
16年目のピクシブ百科事典を支える最新の技術基盤 / The Modern Tech Stack Powering Pixiv Encyclopedia in its 16th Year
Avatar for ahu ahuglajbclajep
5
1k
今こそ知るべき耐量子計算機暗号(PQC)入門 / PQC: What You Need to Know Now
Avatar for mackey0225 mackey0225
3
370
Honoを使ったリモートMCPサーバでAIツールとの連携を加速させる！
Avatar for とすり tosuri13
1
180
QAフローを最適化し、品質水準を満たしながらリリースまでの期間を最短化する #RSGT2026
Avatar for shibayu36 shibayu36
2
4.4k
疑似コードによるプロンプト記述、どのくらい正確に実行される？
Avatar for kokuyouwind kokuyouwind
0
380

Featured

See All Featured
How To Speak Unicorn (iThemes Webinar)
Avatar for Michelle Schulp Hunt marktimemedia
1
380
The Cult of Friendly URLs
Avatar for Andy Hume andyhume
79
6.8k
Mobile First: as difficult as doing things right
Avatar for Swwweet swwweet
225
10k
The Art of Delivering Value - GDevCon NA Keynote
Avatar for David Neal reverentgeek
16
1.8k
Efficient Content Optimization with Google Search Console & Apps Script
Avatar for Katarina Dahlin katarinadahlin
PRO
0
320
The Director’s Chair: Orchestrating AI for Truly Effective Learning
Avatar for Mike Taylor tmiket
1
96
Technical Leadership for Architectural Decision Making
Avatar for Kenny Baas-Schwegler baasie
1
240
Building a Modern Day 
E-commerce SEO Strategy
Avatar for Aleyda Solis aleyda
45
8.6k
How GitHub (no longer) Works
Avatar for Zach Holman holman
316
140k
Building Applications with DynamoDB
Avatar for Matt Wood mza
96
6.9k
The Anti-SEO Checklist Checklist. Pubcon Cyber Week
Avatar for Ryan Jones ryanjones
0
56
Applied NLP in the Age of Generative AI
Avatar for Ines Montani inesmontani
PRO
4
2k

Transcript

  1. Architecture that Works React Native Code Reuse Aaron Greenwald github.com/aarongreenwald

    @aaronjgreenwald [email protected]

  2. 01 / The Promise

  3. “...that approach yielded around 85% reuse of app code” -

    Facebook

  4. “...that approach yielded around 85% reuse of app code” -

    Facebook “Don’t repeat yourself. It’s not only repetitive, it’s redundant, and people have heard it before.” - Lemony Snicket

  5. Is it true?

  6. Yes!

  7. (Mostly)

  8. Android & iOS

  9. Web Apps Android & iOS

  10. Web Apps Other RN Projects Android & iOS

  11. 02 / Android & iOS

  12. Platform-Specific Code Platform Module Conditional statements in code

  13. Platform-Specific Code Filename Suffixes Separate files per platform

  14. Composition > Inheritance

  15. Platform-Specific Code Platform Module Conditional statements in code Filename Suffixes

    Separate files per platform

  16. Architecture Matters

  17. Keep logic out of views

  18. Presenters/Dispatchers Keep logic out of views

  19. Presenters/Dispatchers Logic should be cross-platform Keep logic out of views

  20. Presenters/Dispatchers Logic should be cross-platform Keep logic out of views

    Small & modular views

  21. 03 / Web Apps

  22. Architecture Matters

  23. Reusable application logic

  24. Compilation gets complicated Reusable application logic

  25. Create a separate module Compilation gets complicated Reusable application logic

  26. Create a separate module Compilation gets complicated Reusable application logic

    npm link...

  27. 04 / Multiple Projects

  28. Architecture Matters

  29. Binaries

  30. Dependency Hell Binaries

  31. Is it worthwhile? Dependency Hell Binaries

  32. Architecture Matters

  33. #architecture_matters github.com/aarongreenwald @aaronjgreenwald [email protected]