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

Building UIs with React

Avatar for Jake Rios Jake Rios
July 11, 2014
Technology
0
39

Building UIs with React

Presentation discussing React concepts with code examples.
Avatar for Jake Rios

Jake Rios

July 11, 2014
Tweet

Other Decks in Technology

See All in Technology
AI時代の開発生産性を加速させるアーキテクチャ設計
Avatar for PLAID Tech plaidtech
PRO
3
160
United airlines®️ USA Contact Numbers: Complete 2025 Support Guide
Avatar for heron31238 unitedflyhelp
0
320
ビズリーチにおけるリアーキテクティング実践事例 / JJUG CCC 2025 Spring
Avatar for Visional Engineering ＆ Design visional_engineering_and_design
1
130
Delta airlines®️ USA Contact Numbers: Complete 2025 Support Guide
Avatar for ape1422 airtravelguide
0
340
SEQUENCE object comparison - db tech showcase 2025 LT2
Avatar for Noriyoshi Shinoda nori_shinoda
0
150
Delta airlines Customer®️ USA Contact Numbers: Complete 2025 Support Guide
Avatar for michal deltahelp
0
800
SRE不在の開発チームが障害対応と 向き合った100日間 / 100 days dealing with issues without SREs
Avatar for katsukamaru shin1988
0
170
マネジメントって難しい、けどおもしろい / Management is tough, but fun! #em_findy
Avatar for ar_tama ar_tama
7
1.1k
OpenTelemetryセマンティック規約の恩恵とMackerel APMにおける活用例 / SRE NEXT 2025
Avatar for mackerelio mackerelio
1
240
United™️ Airlines®️ Customer®️ USA Contact Numbers: Complete 2025 Support Guide
Avatar for dobek566 flyunitedguide
0
210
データグループにおけるフロントエンド開発
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
1
110
データ基盤からデータベースまで？広がるユースケースのDatabricksについて教えるよ！
Avatar for Akihiro Kuwano akuwano
3
120

Featured

See All Featured
Product Roadmaps are Hard
Avatar for C. Todd Lombardo iamctodd
PRO
54
11k
Fight the Zombie Pattern Library - RWD Summit 2016
Avatar for Marcelo Somers marcelosomers
233
17k
Balancing Empowerment & Direction
Avatar for Lara Hogan lara
1
430
The MySQL Ecosystem @ GitHub 2015
Avatar for Sam Lambert samlambert
251
13k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
Avatar for Tammy Everts tammyeverts
6
310
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
667
120k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
Avatar for Joe Casabona jcasabona
32
2.4k
Faster Mobile Websites
Avatar for Dean Hume deanohume
307
31k
jQuery: Nuts, Bolts and Bling
Avatar for Doug Neiner dougneiner
63
7.8k
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
45
7.5k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
Avatar for Irina Nazarova irinanazarova
8
820
Fantastic passwords and where to find them - at NoRuKo
Avatar for Phil Nash philnash
51
3.3k

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?