Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Building UIs with React

Jake Rios
July 11, 2014
Technology
0
36

Building UIs with React

Presentation discussing React concepts with code examples.

Jake Rios

July 11, 2014
Tweet

Other Decks in Technology

See All in Technology
The AI Revolution Will Not Be Monopolized: Behind the scenes
inesmontani
PRO
1
150
生産性向上チームの紹介
cybozuinsideout
PRO
1
900
Oracle Base Database Service 技術詳細
oracle4engineer
PRO
4
37k
家族アルバム みてねにおけるGrafana活用術 / Grafana Meetup Japan Vol.1 LT
isaoshimizu
1
900
Grafana x PagerDuty Better Together
jacopen
1
240
【NW X Security JAWS#3】L3-4:AWS環境のIPv6移行に向けて知っておきたいこと
shotashiratori
1
600
Babylon.js JAPAN活動紹介 (2024/4)
limes2018
1
100
どうするコスト最適化のトレードオフ
tetsuyaooooo
1
690
よく聞くけど使ったことないソフトウェアNo.1 KafkaとSnowflake
foursue
4
470
Gitlab本から学んだこと - そーだいなるプレイバック / gitlab-book
soudai
7
1.3k
DMM.com アルファ室採用案内資料
hsugita
1
210
Tellus の衛星データを見てみよう #mf_fukuoka
kongmingstrap
0
260

Featured

See All Featured
The World Runs on Bad Software
bkeepers
PRO
61
6.7k
Designing Experiences People Love
moore
136
23k
Designing for humans not robots
tammielis
248
25k
Automating Front-end Workflow
addyosmani
1357
200k
Reflections from 52 weeks, 52 projects
jeffersonlam
345
19k
Building a Modern Day 
E-commerce SEO Strategy
aleyda
21
6.4k
Designing on Purpose - Digital PM Summit 2013
jponch
111
6.5k
What's in a price? How to price your products and services
michaelherold
238
11k
What the flash - Photography Introduction
edds
64
11k
Build your cross-platform service in a week with App Engine
jlugia
226
17k
Statistics for Hackers
jakevdp
790
220k
Into the Great Unknown - MozCon
thekraken
14
1k

Transcript

  1. Building User Interfaces With React

  2. Building consistent user interfaces is hard

  3. React

  4. React aims to be simple React is declarative

  5. Components Not templates

  6. Components can be composed to build complex UIs

  7. Break down the user interface into components

  8. A little about JSX

  9. JSX Gotchas

  10. Component State

  11. Component Lifecycle 1.  Mounting 2.  Updating 3.  Unmounting

  12. Ownership, not parent

  13. Data on the screen

  14. JS is not reactive DOM is inherently stateful

  15. Data Binding is a polyfill for reactive JS and DOM

  16. None

  17. Virtual DOM

  18. None

  19. React to events Autobinding Event delegation

  20. React Add-ons

  21. http://bit.ly/react-docs! http://bit.ly/react-contrib! Documentation Contribute http://bit.ly/react-tools! Tooling http://bit.ly/rethink-practices! Watch

  22. Questions?