Newbiew/Beginniner friendly exploration into what is similar and what is different in react-native
React vsReact-Nativeby Jesse Wolgamott (@jwo) for Houston ReactMeetup - Aug 17, 2017
View Slide
What is React Native?
Mobile Apps in ReactiPhone / iPad / AppleTVAndroid phones / tablets
React Native was created byFacebook
Both iOS and Android with onecodebase**ish
Is it Native?React Native: both JS and native code
Is it Native?JS runs on virtual machine on the mobile deviceand communicates with the native code
Similarities
RenderingReact React-NativeEditor Atom AtomLanguage JSX JSXToolset WebPack WebPackMetaphor Components ComponentsTesting Jest JestLinter Prettier Prettier
Differences
RenderingHTML Native text
Native CodeGeolocationCamerain-app-purchases
DeploymentHTML NativePublic Server App Store
Dev Flow
Easy, Fun1. create-react-native-app2. use Echo App to run on mobile device3. Eject4. Build and Deploy
Hard, :(1. create-react-native-app2. Eject3. Integrate with mobile app4. Run on mobile device or simular5. Build and Deploy
Layouts1. Use Flexbox2. Get Better At Flexbox3. GOTO 2
Navigation1. React-Router (my perferred)2. react-native-router- ux
State1. Redux (my perferred)2. react-native-router- ux
Resourceshttp://facebook.github.io/react-native/https://js.coach/react-nativehttps://expo.io/
Demo Code:github.com/jwo/demo-react-nativeFull Appgithub.com/jwo/example-react-native-redux-router