John Doe
CFO
Slide 1
Slide 1 text
REACT NATIVE
Or how to make mobile development bearable again
Slide 2
Slide 2 text
"a framework that will wholly replace
mobile development as we know it
today."
Slide 3
Slide 3 text
No content
Slide 4
Slide 4 text
"A javascript framework for cross-
platform mobile development"
Slide 5
Slide 5 text
BEST FEATURES
1. Multiplatform, 80-90% code share!
2. Faster iteration and development speed than native
3. Can be dropped in existant native apps
4. Write once, run anywhere, in JavaScript!
Slide 6
Slide 6 text
No content
Slide 7
Slide 7 text
No content
Slide 8
Slide 8 text
No content
Slide 9
Slide 9 text
EVALUATION CRITERIA
1. How is your code written/represented?
2. How is your code ran, and by what?
3. Who renders the user interface, and how?
Slide 10
Slide 10 text
PHONEGAP (CORDOVA)
1. You write code in javascript, and you communicate
with native modules through a bridge
2. Your JS code is interpreted by the device's JS Virtual
Machine
3. Your views are written in HTML and rendered by the
device's webview
Slide 11
Slide 11 text
BUT HOW ABOUT REACT
NATIVE?
Slide 12
Slide 12 text
REACT NATIVE
1. You write code in javascript, communicating with
native modules through a bridge
2. Your JS code is interpreted by a vendored
JavascriptCore
3. Your views are written in React and rendered
natively
Slide 13
Slide 13 text
REACT?
Slide 14
Slide 14 text
A Javascript library for building user
interfaces
Slide 15
Slide 15 text
React is an unopinionated, declarative
way to describe UI.
Slide 16
Slide 16 text
John Doe
CFO
Slide 17
Slide 17 text
...
Slide 18
Slide 18 text
But react isn't just about extracting elements into
modules.
{
profiles.map( profile => (
))
}
Slide 19
Slide 19 text
REACT COMPONENT
reusable, modular, scoped
Slide 20
Slide 20 text
REACT COMPONENT
Large open-source scene, thousands of reusable
components
Slide 21
Slide 21 text
But enough of that, what about the native?
Slide 22
Slide 22 text
BEST FEATURES
1. Multiplatform, 80-90% code share!
2. Faster iteration and development speed than native
3. Can be dropped in existant native apps
4. JavaScript
Slide 23
Slide 23 text
BEST FEATURES
1. Multiplatform, 80-90% code share!
Metro-bundler is even con gured to load .ios.js and
.android.js les!
Slide 24
Slide 24 text
BEST FEATURES
1. Faster iteration and development speed than native
Since your app is just a js bundle, you can beam that to
your clients bypassing the stores!
Slide 25
Slide 25 text
BEST FEATURES
1. Can be dropped in existant native apps
You can integrate your existant native modules with
the bridge.
Slide 26
Slide 26 text
BEST FEATURES
1. JavaScript
From ow to webpack, npm to Typescript, extensive
tooling to make JS better exists.
Slide 27
Slide 27 text
However, a rose without thorns doesn't exist.
Slide 28
Slide 28 text
WORST FEATURES
1. Javascript
Tool complexity can create problems in and out of itself.
Slide 29
Slide 29 text
WORST FEATURES
1. Driven by Facebook needs
Sometimes other companies and communities rise to
the challenge. No router?
* https://github.com/airbnb/native-navigation
* https://github.com/wix/react-native-navigation
* https://github.com/react-community/react-navigation
Slide 30
Slide 30 text
WORST FEATURES
1. Upgrading and native package management is
complicated
'react-native link' doesn't always work
Slide 31
Slide 31 text
WORST FEATURES
1. Slight performance overhead
Crossing the bridge takes time.
Slide 32
Slide 32 text
WORST FEATURES
1. Iffy licensing
Patents involved. Legal departments might be
concerned.
Slide 33
Slide 33 text
WORST FEATURES
1. Long dependency chain
That's a lot to break compared to native toolkits.
Slide 34
Slide 34 text
LIVE CODING!
Slide 35
Slide 35 text
CONTINUED FUTURE?
Dogfooded and integrated into products at founding
company
Most code is open sourced, even if Facebook
abandons
Thousands of apps by different companies depend
on them
Microsoft maintains a Modern UI-frontend!
Slide 36
Slide 36 text
END NOTES
Slide 37
Slide 37 text
SHOULD YOU USE REACT?
It depends.