Sony lazuardi native mobile app with javascript

1. NATIVE MOBILE APP
WITH JAVASCRIPT
PHP Indonesia
March 26st 2015

2. SONNY LAZUARDI
Frontend Engineer @
@sonnylazuardi
sonnylab.com
github.com/sonnylazuardi

3. REACT.ID

5. BACKGROUND

6. NATIVE MOBILE APP
DEVELOPMENT IS
HARD
No Code
Sharing
Low
Iteration
Speed
Hard To
Scale
https://speakerdeck.com/frantic/react-native-tutorial-nyc-15

7. WEB APP
DEVELOPMENT
IS EASY
R

8. HYBRID APP

9. NATIVE APPSWHY
ARE GREAT?
Complex
Gestures &
Smooth
Animations
Fast,
Responsive
Consistent
With the
platform
https://speakerdeck.com/frantic/react-native-tutorial-nyc-15

10. REACT NATIVE

11. JAVASCRIPT IS FAST
THE DOM IS SLOW

12. DOM

13. UIKIT

14. REACT NATIVE
WRITE ONCE
RUN ANYWHERE

15. REACT NATIVE
LEARN ONCE
WRITE ANYWHERE

16. REACT
NATIVE
COMPONENT
<div> <View>
Browser DOM
Native
Component
<img> <Image>
<span> <Text>
<ScrollView>
<MapView>
<TabBar>

17. REACT
NATIVE
STYLING

18. REACT
NATIVE
SETUP
• 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

19. ANDROID
SETUP
• 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

21. Deploy code updates
directly to users
No more waiting
App store approval
FAST ITERATION

22. LIVE DEMO
https://github.com/sonnylazuardi/phpindonesia-react-native
REACT.ID/PHPINDONESIA