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
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
230
Build_Mobile-Friendly_Web_Apps_with_Reactjs.pptx.pdf
randyviandaputra
0
250
Berkarir Sebagai Frontend Developer
randyviandaputra
1
480
Introduction to Full Stack JS
randyviandaputra
1
210
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
FlutterKaigi 2025 システム裏側
yumnumm
0
1.2k
Duke on CRaC with Jakarta EE
ivargrimstad
0
200
Java_プロセスのメモリ監視の落とし穴_NMT_で見抜けない_glibc_キャッシュ問題_.pdf
ntt_dsol_java
0
230
例外処理を理解して、設計段階からエラーを見つけやすく、起こりにくく #phpconfuk
kajitack
12
6.4k
[堅牢.py #1] テストを書かない研究者に送る、最初にテストを書く実験コード入門 / Let's start your ML project by writing tests
shunk031
11
5.7k
CloudflareのSandbox SDKを試してみた
syumai
0
180
オフライン対応!Flutterアプリに全文検索エンジンを実装する @FlutterKaigi2025
itsmedreamwalker
2
270
Vueで学ぶデータ構造入門 リンクリストとキューでリアクティビティを捉える / Vue Data Structures: Linked Lists and Queues for Reactivity
konkarin
1
340
Herb to ReActionView: A New Foundation for the View Layer @ San Francisco Ruby Conference 2025
marcoroth
0
190
なぜ強調表示できず ** が表示されるのか — Perlで始まったMarkdownの歴史と日本語文書における課題
kwahiro
12
7.2k
TypeScriptで設計する 堅牢さとUXを両立した非同期ワークフローの実現
moeka__c
5
2.2k
Querying Design System デザインシステムの意思決定を支える構造検索
ikumatadokoro
1
1.2k
Featured
See All Featured
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
3.2k
Learning to Love Humans: Emotional Interface Design
aarron
274
41k
Speed Design
sergeychernyshev
33
1.2k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
2.6k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4.1k
Why You Should Never Use an ORM
jnunemaker
PRO
60
9.6k
Raft: Consensus for Rubyists
vanstee
140
7.2k
How To Stay Up To Date on Web Technology
chriscoyier
791
250k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
9
980
Java REST API Framework Comparison - PWX 2021
mraible
34
9k
Mobile First: as difficult as doing things right
swwweet
225
10k
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