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 for Poets
Search
Nathan Hunzaker
April 09, 2015
Programming
0
110
React for Poets
A very high level look at React
Nathan Hunzaker
April 09, 2015
Tweet
Share
More Decks by Nathan Hunzaker
See All by Nathan Hunzaker
Introduction to React - Triangle.rb May 2015
nhunzaker
0
150
What is React?
nhunzaker
7
740
Other Decks in Programming
See All in Programming
【Go言語】golangci-lintの使い方
tomo1227
0
270
コード生成を伴うLLMエージェント - 2024.07.18 Tokyo AI
smiyawaki0820
11
4.1k
MIERUNE BBQにおけるユーザー中心設計()
mierune
PRO
1
110
Advanced App Shrinking Techniques
cbeyls
2
150
CSC307 Lecture 08
javiergs
PRO
0
330
CSC307 Lecture 13
javiergs
PRO
0
150
最古の関数型言語「Lisp」ことはじめ / lisp_in_kamiyama
uhooi
1
190
OpenAI/Gemini APIを使って EPUBを翻訳するCLIツールをつくってみた
tomiyan
0
790
I/O Extended Android in Korea 2024 ~ Whats new in Android development tools
pluu
0
250
APIのない大学ログインWebサービスをWKWebViewとJavaScriptでアプリ化した話
akidon0000
1
330
The rollercoaster of releasing an Android, iOS, and macOS app with Kotlin Multiplatform | droidcon Berlin
prof18
0
110
CSC307 Lecture 11
javiergs
PRO
0
240
Featured
See All Featured
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
26
1.8k
Designing for humans not robots
tammielis
247
25k
Speed Design
sergeychernyshev
9
270
Fashionably flexible responsive web design (full day workshop)
malarkey
399
65k
How GitHub Uses GitHub to Build GitHub
holman
471
290k
10 Git Anti Patterns You Should be Aware of
lemiorhan
652
58k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
78
15k
Building an army of robots
kneath
301
42k
For a Future-Friendly Web
brad_frost
173
9.2k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
662
120k
Infographics Made Easy
chrislema
238
18k
Build The Right Thing And Hit Your Dates
maggiecrowley
28
2.2k
Transcript
React for Poets
• What React it is • Why we like it
• What React isn't
What is React?
React is a JavaScript library for building user interfaces.
"How should the user interface be built, and how should
it update?"
It forces a developer to break up their user interface
into small components.
<Blogs/> <Navigation/> <Posts/> <Post/> <Post/> <Post/> <Post/>
Compo(sition,nents) "React is all about building reusable components. In fact,
with React the only thing you do is build components." - facebook.github.io/react
None
Component Tree
Build a component tree Compare to old data Determine fastest
update method Update page Data
State changed! So what...
Define Interface Change Data • Each change updates the user
interface • Data only goes in one direction (down)
Why I like React
Trouble in Paradise
• Web applications • Pages with frequent UI updates •
Things the browser can't do on its own JS apps are great for:
• Page load times • Handling critical errors • Mobile
performance Challenges with JS Apps:
None
Why I like React
Server side rendering
None
• Responsive page loads • More strategies for handling failure
(not just blank screens) With server side rendering:
None
None
Page Load Boot App Server
Mobile performance
• Designed for low memory devices • Hyper efficient page
updates • Stress tested on millions of devices on sites such as facebook.com, airbnb.com, and bbc.com
It's not the right tool for everything
• Sites with only few interactions • Simple content oriented
sites • Handoff projects where the maintainer is not familiar with JavaScript development • Server-side rendering requires NodeJS expertise React is not ideal for:
React is exciting
Break down UI into components
Addresses a lot of JS issues
None
Thanks! Nate Hunzaker @natehunzaker