NATIVE MOBILE APPWITH JAVASCRIPT

PHP IndonesiaMarch 26st 2015

SONNY LAZUARDIFrontend Engineer @

@sonnylazuardisonnylab.com

github.com/sonnylazuardi

REACT.ID

BACKGROUND

NATIVE MOBILE APP DEVELOPMENT IS HARD

No Code Sharing

Low Iteration

Speed

Hard To Scale

https://speakerdeck.com/frantic/react-native-tutorial-nyc-15

WEB APP DEVELOPMENT IS EASY

R

HYBRID APP

NATIVE APPSWHYARE GREAT?

ComplexGestures &

SmoothAnimations

Fast,Responsive

ConsistentWith the platform

https://speakerdeck.com/frantic/react-native-tutorial-nyc-15

REACT NATIVE

JAVASCRIPT IS FASTTHE DOM IS SLOW

DOM

UIKIT

REACT NATIVE

WRITE ONCERUN ANYWHERE

REACT NATIVE

LEARN ONCEWRITE ANYWHERE

REACT NATIVECOMPONENT

<div> <View>

Browser DOM

Native Component

<img>

<Image><span

><Text><ScrollView><MapView><TabBar>

REACT NATIVESTYLING

REACT NATIVESETUP

• Requirements• OSX• Node 4.0 or newer• Watchman

• Installing React Native CLI

npm install –g react-native-cli

• Starting React Native Project

react-native init ProjectName

ANDROIDSETUP

• Install JDK• Install Android SDK

brew install android-sdk

• Add Android SDK path to your ~/.bashrc, ~/.zshrc

export ANDROID_HOME=/usr/local/opt/android-sdk

Deploy code updates directly to users

No more waitingApp store approval

FAST ITERATION

LIVE DEMOhttps://github.com/sonnylazuardi/phpindonesia-react-native

REACT.ID/PHPINDONESIA