Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Hands On: React Native
Search
Robert Vogt
September 23, 2016
Technology
0
370
Hands On: React Native
Robert Vogt
September 23, 2016
Tweet
Share
More Decks by Robert Vogt
See All by Robert Vogt
React Native — Webnesday #9
deniaz
1
420
JavaScript - From DHTML to a Multi-Paradigm Language
deniaz
0
410
ADR Lightning Talk
deniaz
0
410
Other Decks in Technology
See All in Technology
研究開発部メンバーの働き⽅ / Sansan R&D Profile
sansan33
PRO
3
20k
CoRL 2025 Survey
harukiabe
1
220
「れきちず」のこれまでとこれから - 誰にでもわかりやすい歴史地図を目指して / FOSS4G 2025 Japan
hjmkth
1
320
エンタメとAIのための3Dパラレルワールド構築(GPU UNITE 2025 特別講演)
pfn
PRO
0
540
プレーリーカードを活用しよう❗❗デジタル名刺交換からはじまるイベント会場交流のススメ
tsukaman
0
180
物体検出モデルでシイタケの収穫時期を自動判定してみた。 #devio2025
lamaglama39
0
240
名刺メーカーDevグループ 紹介資料
sansan33
PRO
0
930
AIとともに歩んでいくデザイナーの役割の変化
lycorptech_jp
PRO
0
510
GoでもGUIアプリを作りたい!
kworkdev
PRO
0
150
「最速」で Gemini CLI を使いこなそう! 〜Cloud Shell/Cloud Run の活用〜 / The Fastest Way to Master the Gemini CLI — with Cloud Shell and Cloud Run
aoto
PRO
0
110
React19.2のuseEffectEventを追う
maguroalternative
2
500
やる気のない自分との向き合い方/How to Deal with Your Unmotivated Self
sanogemaru
1
520
Featured
See All Featured
Six Lessons from altMBA
skipperchong
29
4k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
Visualization
eitanlees
149
16k
Art, The Web, and Tiny UX
lynnandtonic
303
21k
The Illustrated Children's Guide to Kubernetes
chrisshort
49
51k
Code Review Best Practice
trishagee
72
19k
The Straight Up "How To Draw Better" Workshop
denniskardys
238
140k
We Have a Design System, Now What?
morganepeng
53
7.8k
Gamification - CAS2011
davidbonilla
81
5.5k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.2k
The Language of Interfaces
destraynor
162
25k
Embracing the Ebb and Flow
colly
88
4.9k
Transcript
Hands On React Native Robert Vogt #NCamp16
Robert Vogt Software Engineer from & in Sankt Gallen @_deniaz
React Native
Efficient Re-rendering through Virtual DOM
Rendering Components with JSX
class HelloMessage extends React.Component { render() { return <div>Hello {this.props.name}</div>
} }
const HelloMessage = (props) => ( <div>Hello {props.name}</div> );
const HelloMessage = (props) => ( <View> <Text> Hello {props.name}
</Text> </View> );
<HelloMessage name=”Robert” />
How JavaScript can be Native
Store View Action Action Dispatcher
ES6 / ES2015 babeljs.io/docs/learn-es2015
None
None
An exemplary Project Structure
.babelrc android index.android.js index.ios.js ios node_modules package.json src ├── app.js
├── infrastructure │ ├── router.js │ ├── store.js └── ui ├── components │ └── scenes │ └── home.js └── reducers ├── update.js ├── actions
git.io/v6bSK git.io/v6bSK
1 1 The Talks ❏ Geolocation ❏ HTTP 13:50 -
14:10
2 2 The Looks ❏ Layouting ❏ Styling 14:10 -
14:20
3 3 The Brain ❏ Persistent Storage 14:20 - 14:40
4 4 The Personality ❏ Navigation ❏ Routing ❏ Storage
14:40 - 15:00
5 5 The Package ❏ Deployment 15:00 - 15:20
That’s it!