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
React Native 4 Dummies
Search
Flávio Caetano
July 27, 2017
Programming
0
62
React Native 4 Dummies
An intro to React Native for iOS developers
https://github.com/fjcaetano/talks
Flávio Caetano
July 27, 2017
Tweet
Share
More Decks by Flávio Caetano
See All by Flávio Caetano
Siri Suggestions & Shortcuts
fjcaetano
1
190
Animations: Swift vs React Native
fjcaetano
2
460
Fastlane Sob Medida
fjcaetano
1
150
Tailored Fastlane
fjcaetano
0
54
Bugreport 101
fjcaetano
0
43
Other Decks in Programming
See All in Programming
チームをチームにするEM
hitode909
0
410
AtCoder Conference 2025「LLM時代のAHC」
imjk
2
600
ThorVG Viewer In VS Code
nors
0
310
「コードは上から下へ読むのが一番」と思った時に、思い出してほしい話
panda728
PRO
39
26k
Navigating Dependency Injection with Metro
l2hyunwoo
1
200
DevFest Android in Korea 2025 - 개발자 커뮤니티를 통해 얻는 가치
wisemuji
0
180
実はマルチモーダルだった。ブラウザの組み込みAI🧠でWebの未来を感じてみよう #jsfes #gemini
n0bisuke2
3
1.3k
これならできる!個人開発のすゝめ
tinykitten
PRO
0
140
Grafana:建立系統全知視角的捷徑
blueswen
0
250
AI時代を生き抜く 新卒エンジニアの生きる道
coconala_engineer
1
470
Denoのセキュリティに関する仕組みの紹介 (toranoana.deno #23)
uki00a
0
180
re:Invent 2025 トレンドからみる製品開発への AI Agent 活用
yoskoh
0
530
Featured
See All Featured
Future Trends and Review - Lecture 12 - Web Technologies (1019888BNR)
signer
PRO
0
3.1k
Joys of Absence: A Defence of Solitary Play
codingconduct
1
260
Bootstrapping a Software Product
garrettdimon
PRO
307
120k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
47
7.9k
Done Done
chrislema
186
16k
Technical Leadership for Architectural Decision Making
baasie
0
190
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
162
16k
Mind Mapping
helmedeiros
PRO
0
42
Context Engineering - Making Every Token Count
addyosmani
9
560
Rails Girls Zürich Keynote
gr2m
95
14k
Side Projects
sachag
455
43k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.5k
Transcript
React Native 4 Dummies Flávio Caetano Senior Developer
1. O que 2. Como 3. Demo 4. Por quê
O que é React Native
1. Plataforma para criar React-like apps 2. JavaScript & JSX
3. Objective-C & Swift 4. Java 5. Híbrido (one app to rule them all) 6. Nativo
1. Web app 2. Conversor de código 3. DOM React
Native não é
Como RN Funciona
1. Componentes ⟷ Views Nativas 2. Props → atributos públicos
imutáveis 3. State → atributos mutáveis Conceitos
Contexto JS Contexto Nativo Inicialização Componentes Alocação dinâmica das views
Interação Callback do Componente queue JS Main queue + outras Atualiza UI
1. constructor 2. componentWillMount 3. render 4. componentDidMount 5. componentWillUnmount
Lifecycle do componente
1. componentWillReceiveProps 2. shouldComponentUpdate 3. componentWillUpdate 4. render 5. componentDidUpdate
Update do componente
1. Packager gera um bundle do JS 2. Queue JS
executa o bundle 3. Main queue cuida da UI 4. Views alocadas dinamicamente 5. Bridging apenas quando necessário Recapitulando
Animações
1. Rodam no contexto nativo 2. Declarativas 3. Interpolação (matriz
de transformação)
Contexto JS Contexto Nativo Declaração queue JS Main queue Inicialização
Executa animação Frame 1 Executa animação Frame 2 Executa animação Frame 3
Demo
Por quê usar RN?
1. Tempo de iteração ↓ 2. 1 projeto para 2
plataformas 3. 1 time de desenvolvimento mobile 4. Performance aceitável 5. 99% JS + 1% nativo 6. Cocoapods libs nativas + ∞ libs JS 7. Tchau Xcode/Android Studio
Obrigado github.com/fjcaetano @flavio_caetano