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_training.pdf
Search
Randy Vianda Putra
November 23, 2018
Programming
290
0
Share
react_native_training.pdf
Randy Vianda Putra
November 23, 2018
More Decks by Randy Vianda Putra
See All by Randy Vianda Putra
Step by Step Guide to Becoming Frontend Developer
randyviandaputra
0
240
Build_Mobile-Friendly_Web_Apps_with_Reactjs.pptx.pdf
randyviandaputra
0
260
Berkarir Sebagai Frontend Developer
randyviandaputra
1
490
Introduction to Full Stack JS
randyviandaputra
1
220
Intro to React 360
randyviandaputra
0
360
Introduction_To_React.pdf
randyviandaputra
0
310
Micro_Frontend.pdf
randyviandaputra
2
430
Other Decks in Programming
See All in Programming
AIとASP.NET Coreで雑Webアプリを作った話
mayuki
0
280
SPMマルチモジュールで テストカバレッジを取得する技法
yosshi4486
0
140
Moments When Things Go Wrong
aurimas
3
140
キャリア迷子上等 ─ "ない道"は自分で作ればいい
16bitidol
2
310
エージェンティックRAGにAWSで入門しよう!
har1101
7
710
TypeSpec で繋ぐ複数プロダクトの型安全
maroon8021
1
370
PHPで使える日時の表現と、その知り方 #frontend_phpcon_do
o0h
PRO
0
180
Swiftのレキシカルスコープ管理
kntkymt
0
210
決定論的オーケストレーションの設計と実装 / Design and Implementation of Deterministic Orchestration
nrslib
3
980
tsserverとは何だったのか、これからどうなるのか
nowaki28
1
440
IBM Bobを活用したレガシーアプリの最新化
oniak3ibm
PRO
1
170
Claspは野良GASの夢をみるか
takter00
0
160
Featured
See All Featured
Why Our Code Smells
bkeepers
PRO
340
58k
Gemini Prompt Engineering: Practical Techniques for Tangible AI Outcomes
mfonobong
2
420
Odyssey Design
rkendrick25
PRO
2
680
A designer walks into a library…
pauljervisheath
211
24k
職位にかかわらず全員がリーダーシップを発揮するチーム作り / Building a team where everyone can demonstrate leadership regardless of position
madoxten
62
54k
The browser strikes back
jonoalderson
0
1.1k
Impact Scores and Hybrid Strategies: The future of link building
tamaranovitovic
0
300
Designing Powerful Visuals for Engaging Learning
tmiket
1
400
KATA
mclloyd
PRO
35
15k
How to Align SEO within the Product Triangle To Get Buy-In & Support - #RIMC
aleyda
2
1.5k
4 Signs Your Business is Dying
shpigford
187
22k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
254
22k
Transcript
Build First Mobile App With React Native RANDY VIANDA PUTRA
Introduction
1. Understand how to install React Native 2. Understand the
concept of React Native 3. Build first application using React Native 4. Can be implemented Agenda
Prerequisite ?
1. Basic Javascript (ES6) 2. Basic understanding of npm &
how it works 3. Knowledge of how to use command line Prerequisite
1. Node version >= 5 2. JDK (Java Development Kit)
8 3. Xcode (to run on IOS Simulator) 4. Genymotion / Android Studio (to run on Android Simulator) Environment
Let’s Start :-)
1. Build using React 2. Build cross platform apps using
javascript 3. Target not only ios & android, but also Apple TV, VR, AR, Windows & Desktop 4. Release 2015 March 5. Learn once write everywhere 6. Rapidly gaining in popularity & adoption What is React Native ?
Who’s using React Native ?
1. Faster speed of development 2. Lower cost of development
a. Code reuse b. Easier to find developers 3. Ship accross multiple platform 4. Simple code 5. One for all :-D Why React Native ?
How does React Native work ? <Button/> Button UI JS
Create a button Button pressed
Let’s Start Coding :-)
1. React Native CLI 2. Create React Native App CLI
Creating a new React Native Project
Components, Rendering & Lifecyles The main idea behind react
1. Represent a piece of UI 2. Can be created
in one of two ways : 1. Stateless (function) 2. Statefull (class) Components
1. Creating / Mounting 2. Updating 3. Unmounting 3 types
of component lifecycles
Creating / Mounting
Updating
Unmounting
Lifecycles
Data
State
Props
Build Simple Application Using React Native Study Case
Thank You :-) github.com/randyviandaputra