Hands OnReact NativeRobert Vogt#NCamp16
View Slide
Robert VogtSoftware Engineerfrom & in Sankt Gallen@_deniaz
React Native
Efficient Re-renderingthroughVirtual DOM
Rendering ComponentswithJSX
class HelloMessage extends React.Component {render() {return Hello {this.props.name}}}
const HelloMessage = (props) => (Hello {props.name});
How JavaScriptcan beNative
Store ViewActionAction Dispatcher
ES6 / ES2015babeljs.io/docs/learn-es2015
An exemplaryProject Structure
.babelrcandroidindex.android.jsindex.ios.jsiosnode_modulespackage.jsonsrc├── app.js├── infrastructure│ ├── router.js│ ├── store.js└── ui├── components│ └── scenes│ └── home.js└── reducers├── update.js├── actions
git.io/v6bSKgit.io/v6bSK
11The Talks❏ Geolocation❏ HTTP13:50 - 14:10
22The Looks❏ Layouting❏ Styling14:10 - 14:20
33The Brain❏ Persistent Storage14:20 - 14:40
44The Personality❏ Navigation❏ Routing❏ Storage14:40 - 15:00
55The Package❏ Deployment15:00 - 15:20
That’s it!