Architecture that Works
React Native Code Reuse
Aaron Greenwald
github.com/aarongreenwald
@aaronjgreenwald
aarong@wix.com
Slide 2
Slide 2 text
01 / The Promise
Slide 3
Slide 3 text
“...that approach yielded around 85% reuse of
app code”
- Facebook
Slide 4
Slide 4 text
“...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
Slide 5
Slide 5 text
Is it true?
Slide 6
Slide 6 text
Yes!
Slide 7
Slide 7 text
(Mostly)
Slide 8
Slide 8 text
Android & iOS
Slide 9
Slide 9 text
Web Apps
Android & iOS
Slide 10
Slide 10 text
Web Apps
Other RN Projects
Android & iOS
Slide 11
Slide 11 text
02 / Android & iOS
Slide 12
Slide 12 text
Platform-Specific Code
Platform Module
Conditional
statements in code
Slide 13
Slide 13 text
Platform-Specific Code
Filename Suffixes
Separate files per
platform
Slide 14
Slide 14 text
Composition > Inheritance
Slide 15
Slide 15 text
Platform-Specific Code
Platform Module
Conditional
statements in code
Filename Suffixes
Separate files per
platform
Slide 16
Slide 16 text
Architecture Matters
Slide 17
Slide 17 text
Keep logic out of views
Slide 18
Slide 18 text
Presenters/Dispatchers
Keep logic out of views
Slide 19
Slide 19 text
Presenters/Dispatchers
Logic should be cross-platform
Keep logic out of views
Slide 20
Slide 20 text
Presenters/Dispatchers
Logic should be cross-platform
Keep logic out of views
Small & modular views