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
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Randy Vianda Putra
November 23, 2018
Programming
0
290
react_native_training.pdf
Randy Vianda Putra
November 23, 2018
Tweet
Share
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
250
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
300
Micro_Frontend.pdf
randyviandaputra
2
420
Other Decks in Programming
See All in Programming
20260315 AWSなんもわからん🥲
chiilog
2
170
AI活用のコスパを最大化する方法
ochtum
0
260
安いハードウェアでVulkan
fadis
0
690
それはエンジニアリングの糧である:AI開発のためにAIのOSSを開発する現場より / It serves as fuel for engineering: insights from the field of developing open-source AI for AI development.
nrslib
1
430
PHPで TLSのプロトコルを実装してみる
higaki_program
0
350
Claude Codeセッション現状確認 2026福岡 / fukuoka-aicoding-00-beacon
monochromegane
4
450
モックわからないマン卒業記 ~振る舞いを起点に見直した、フロントエンドテストにおけるモックの使いどころ~
tasukuwatanabe
3
410
Fundamentals of Software Engineering In the Age of AI
therealdanvega
2
280
条件判定に名前、つけてますか? #phperkaigi #c
77web
2
620
社内規程RAGの精度を73.3% → 100%に改善した話
oharu121
13
8.2k
Claude Code Skill入門
mayahoney
0
410
PHPのバージョンアップ時にも役立ったAST(2026年版)
matsuo_atsushi
0
210
Featured
See All Featured
brightonSEO & MeasureFest 2025 - Christian Goodrich - Winning strategies for Black Friday CRO & PPC
cargoodrich
3
130
The Impact of AI in SEO - AI Overviews June 2024 Edition
aleyda
5
770
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
287
14k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
12
1.1k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
47
8k
Navigating the Design Leadership Dip - Product Design Week Design Leaders+ Conference 2024
apolaine
0
240
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
133
19k
We Have a Design System, Now What?
morganepeng
55
8k
[RailsConf 2023 Opening Keynote] The Magic of Rails
eileencodes
31
10k
For a Future-Friendly Web
brad_frost
183
10k
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
508
140k
The untapped power of vector embeddings
frankvandijk
2
1.6k
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