Upload
sam-lee
View
157
Download
3
Embed Size (px)
Citation preview
React Native for Web
Sam Lee
Sam Lee : FED : /
Agenda
• Why React Native for Web ?
• !
• Demo
Why React Native for Web ?
, React Native
:iOS x 1
Android x 1 FED x 1
- App
iOS iOS App
Android Android App
FrontEnd
- App
iOS Android
FrontEnd
React Native App(iOS, Android)
Bug : 250% up
: 280% up
But… !!
- Omni-Channel App ( )
Why web app? 1. : 2. : App
, 3.
React JS!
React JS
VDOM WEBVIEW
React Native
VDOM
IOSVIEW
ANDROIDVIEW
React Native
VDOM WEBVIEW
React Native for Web
Setup React Native for Web
Setup• react-native
• install react-native-web
• webpack :(ex: react-hot-boilerplate)
index.html , index.web.js webpack config
Setup
index.web.js
Setup
webpack.config.js :
?
“yo react-native-web”
https://github.com/leeabc/generator-react-native-web
React Native Web ?
React-Native-Web Support...
+ IV(iOS, Android, Web)
!
• Demo “ ” React-Native-Web Demo ,
, , !
• , ,
Backend
• Backend:
• Express 4.x
• Pokemon-GO-node-api
• GPS :
•
• API :
• Fetch API:
•
• Data
IV
TextInput ( / )
ButtonTouchableXXXX
ListView
View
Demo
/
!
• iOS , Android, Web High!
• Web Electron 5 !!! (iOS, Android, Web, Windows , Mac)
• React-Native , Native App !
• React Native
•
Q & A
References• React Native Web :
https://github.com/necolas/react-native-web
• Generator React Native Web: https://github.com/leeabc/generator-react-native-web
• React Native Web - React Native Sydney : https://www.youtube.com/watch?v=eV4pZ6vv1VE
Thank you !