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
Introduction to React
Search
Allan Chua
January 29, 2022
Technology
0
100
Introduction to React
A short introduction to react
Allan Chua
January 29, 2022
Tweet
Share
More Decks by Allan Chua
See All by Allan Chua
Defying Serverless API Constraints (API Days 2025)
allanchua101
0
50
Defying Serverless Constraints: Real-life Serverless Workarounds
allanchua101
0
83
Sneak Peek at Kali Linux
allanchua101
0
170
Node JS for Architects Part 1
allanchua101
0
300
Traditional, N-Tier & Microservices
allanchua101
0
110
Things You Need to Know to Become a Serverless API Ninja
allanchua101
1
890
Ocelot Pluggable Gateway
allanchua101
0
1.5k
API Gateway in a Nutshell 2019
allanchua101
0
1.5k
JavaScript API Proxy Pattern
allanchua101
0
610
Other Decks in Technology
See All in Technology
2025年になってもまだMySQLが好き
yoku0825
8
4k
ライブサービスゲームQAのパフォーマンス検証による品質改善の取り組み
gree_tech
PRO
0
540
AWSで始める実践Dagster入門
kitagawaz
0
240
Bye-Bye Query Spaghetti: Write Queries You'll Actually Understand Using Pipelined SQL Syntax
tobiaslampertlotum
0
140
Vault meets Kubernetes
mochizuki875
0
270
[RSJ25] Feasible RAG: Hierarchical Multimodal Retrieval with Feasibility-Aware Embodied Memory for Mobile Manipulation
keio_smilab
PRO
0
100
自作JSエンジンに推しプロポーザルを実装したい!
sajikix
1
150
進捗
ydah
2
230
AI時代に非連続な成長を実現するエンジニアリング戦略
sansantech
PRO
3
1.1k
iPhone Eye Tracking機能から学ぶやさしいアクセシビリティ
fujiyamaorange
0
630
エラーとアクセシビリティ
schktjm
0
980
RSCの時代にReactとフレームワークの境界を探る
uhyo
9
3k
Featured
See All Featured
Art, The Web, and Tiny UX
lynnandtonic
302
21k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
34
3.1k
Typedesign – Prime Four
hannesfritz
42
2.8k
How to train your dragon (web standard)
notwaldorf
96
6.2k
YesSQL, Process and Tooling at Scale
rocio
173
14k
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.4k
jQuery: Nuts, Bolts and Bling
dougneiner
64
7.9k
The Straight Up "How To Draw Better" Workshop
denniskardys
236
140k
Scaling GitHub
holman
463
140k
GraphQLの誤解/rethinking-graphql
sonatard
71
11k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.1k
Transcript
An Introduction to Chua Allan Gabriel Louis Valencia React JS
Table of Contents • What is React • Supported Platforms
• Origin / History • Core Philosophy • Why react • Pre-requisites • Popular Tools • UI Frameworks • How it differentiates with Vue & Angular • How to create a project • Basic Usage • Demo App
Did you know how they flew it?
Did you know how they flew it?
What is React JS? A JavaScript library for building user
interfaces
Supported Platforms Web Mobile Desktop
Origin / History Jordan Walke Software Engineer Worked at Facebook
Created React Scaled to Instagram @ 2012 Open-sourced @ 2013 Most Productionized Framework @ 2022
Core Philosophy Component-Based Declarative Learn-Once; Write Anywhere
Why react? Reusable Components Performance enhancements Can be used for
mobile apps Unidirectional data flow Simple development of dynamic websites Small Learning Curve
Unidirectional vs Bidirectional
Pre-requisites
Popular Tools Developer Tools Reactide Storybook Bundle Analyzer Why Did
You Render Jest Formik and Yup React Hook Form React Sight React Proto
Material UI UI Frameworks Bootstrap UI Ant Design
Vue & Angular Comparison with
Unidirectional Data Flow Bidirectional
Dashboards & Read Only Great for building Forms and Design
Systems
Maintainability & Stability GOOD POOR
Stars in Github
Job Postings
How to create a project
Without react
With React
Thanks to Component Syntax
State is the king
Events are propagated by the root
Demo
Learning Materials - React GITHUB Page (Link) - React Website
(Link) - React Learning Tutorial (Link) - Material UI (Link) - Carbon (Link) - React in 10 hours Free Code Camp (Link) - React for Beginners (Link) - React Full Course (Link) - React TypeScript (Link)