Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up for free
React vs React-Native
Jesse Wolgamott
August 17, 2017
Programming
0
52
React vs React-Native
Newbiew/Beginniner friendly exploration into what is similar and what is different in react-native
Jesse Wolgamott
August 17, 2017
Tweet
Share
More Decks by Jesse Wolgamott
See All by Jesse Wolgamott
What is an API
jwo
0
100
DIY Rails Authentication
jwo
0
160
ActionCable - For Not Another Chat App
jwo
3
1k
SlackBot.rb - Create You a Slack Bot
jwo
1
910
react-rails: an isomorphic match made in heaven
jwo
0
880
Docker - next big thing
jwo
0
550
Ruby 2.1 Overview
jwo
0
570
Rails 4: Appetizers
jwo
1
590
The Long Ball: Upgrading Rails from 1.2 -> 4.0
jwo
2
180
Other Decks in Programming
See All in Programming
Makuakeの認証基盤とRe-Architectureチーム
bmf_san
0
640
Swift Observation
shiz
4
290
WordPress(再)入門 - 基礎知識・環境編
oleindesign
1
140
エンジニア向け会社紹介資料/engineer-recruiting-pitch
xmile
PRO
0
120
TSX First な Zero-Runtime SSG potato4d/dodai とその仕組み / owned static site generator #kyotojs
potato4d
0
450
How to Fight Production Incidents?
asatarin
0
230
xarray-Datatree: Hierarchical Data Structures for Multi-Model Science
tomnicholas
0
230
Next.js 13 Layout / Streaming SSR 仕組み解説
sumiren
0
150
Micro Frontends with Module Federation @MicroFrontend Summit 2023
manfredsteyer
PRO
0
630
[2023년 1월 세미나] 데이터 분석가 되면 어떤 일을 하나요?
datarian
0
650
Prácticas de Seguridad en Kubernetes
pablokbs
0
130
良質な技術記事を量産する秘訣 / #MeetsPro
jnchito
16
4.8k
Featured
See All Featured
How To Stay Up To Date on Web Technology
chriscoyier
779
250k
jQuery: Nuts, Bolts and Bling
dougneiner
57
6.6k
Ruby is Unlike a Banana
tanoku
93
9.6k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
6
850
YesSQL, Process and Tooling at Scale
rocio
159
12k
Build your cross-platform service in a week with App Engine
jlugia
221
17k
Art Directing for the Web. Five minutes with CSS Template Areas
malarkey
197
10k
Building Applications with DynamoDB
mza
85
5k
Keith and Marios Guide to Fast Websites
keithpitt
407
21k
Code Review Best Practice
trishagee
50
11k
Bootstrapping a Software Product
garrettdimon
299
110k
The Web Native Designer (August 2011)
paulrobertlloyd
76
2.2k
Transcript
React vs React-Native by Jesse Wolgamott (@jwo) for Houston React
Meetup - Aug 17, 2017
What is React Native?
Mobile Apps in React iPhone / iPad / AppleTV Android
phones / tablets
React Native was created by Facebook
Both iOS and Android with one codebase* *ish
Is it Native? React Native: both JS and native code
Is it Native? JS runs on virtual machine on the
mobile device and communicates with the native code
Similarities
Rendering React React-Native Editor Atom Atom Language JSX JSX Toolset
WebPack WebPack Metaphor Components Components Testing Jest Jest Linter Prettier Prettier
Differences
Rendering HTML Native <div> <View> text <Text>
Native Code Geolocation Camera in-app-purchases
Deployment HTML Native Public Server App Store
Dev Flow
Easy, Fun 1. create-react-native-app 2. use Echo App to run
on mobile device 3. Eject 4. Build and Deploy
Hard, :( 1. create-react-native-app 2. Eject 3. Integrate with mobile
app 4. Run on mobile device or simular 5. Build and Deploy
Layouts 1. Use Flexbox 2. Get Better At Flexbox 3.
GOTO 2
Navigation 1. React-Router (my perferred) 2. react-native-router- ux
State 1. Redux (my perferred) 2. react-native-router- ux
Resources http://facebook.github.io/react-native/ https://js.coach/react-native https://expo.io/
Demo Code: github.com/jwo/demo-react-native Full App github.com/jwo/example-react-native-redux- router