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

Intro to React Components - React Delhi NCR 01 ...

Avatar for Arun Michael Dsouza Arun Michael Dsouza
July 01, 2018
Programming
1
710

Intro to React Components - React Delhi NCR 01 Jul 2018 Meetup

Introductory talk on React components, what they are and how to create them.
Avatar for Arun Michael Dsouza

Arun Michael Dsouza

July 01, 2018
Tweet

More Decks by Arun Michael Dsouza

See All by Arun Michael Dsouza
Using the Gamepad API for a Better Gaming Experience on the Web
Avatar for Arun Michael Dsouza arunmichaeldsouza
0
78
Using the Gamepad API for a better gaming experience on the web
Avatar for Arun Michael Dsouza arunmichaeldsouza
0
230
React JS Code Splitting - Why and How?
Avatar for Arun Michael Dsouza arunmichaeldsouza
1
210
Building your first web app with React JS, Webpack and Babel
Avatar for Arun Michael Dsouza arunmichaeldsouza
0
340
React 16 & NPM, Create your own library - React Delhi NCR 07 Oct 2018 Meetup
Avatar for Arun Michael Dsouza arunmichaeldsouza
0
180
Houdini, what lies ahead - Web Weekend Kathmandu 2018
Avatar for Arun Michael Dsouza arunmichaeldsouza
0
150
Houdini, what lies ahead - JSConf Iceland 2018
Avatar for Arun Michael Dsouza arunmichaeldsouza
0
470
The Era of Module Bundlers - GDG Dev Fest Delhi 2017
Avatar for Arun Michael Dsouza arunmichaeldsouza
0
170
Getting started with React 16
Avatar for Arun Michael Dsouza arunmichaeldsouza
1
1.2k

Other Decks in Programming

See All in Programming
Claude Codeの使い方
Avatar for ttnyt8701 ttnyt8701
1
100
Enterprise Web App. Development (2): Version Control Tool Training Ver. 5.1
Avatar for Koichi NAKAGAWA knakagawa
1
110
SODA - FACT BOOK
Avatar for SODA inc. sodainc
1
880
從零到一：搭建你的第一個 Observability 平台
Avatar for Blueswen blueswen
1
900
統一感のある Go コードを生成 AI の力で手にいれる
Avatar for Kotaro Otaka otakakot
0
3k
実践ArchUnit ～実例による検証パターンの紹介～
Avatar for 荻原利雄 ogiwarat
2
260
ワンバイナリWebサービスのススメ
Avatar for mackee mackee
10
7.7k
[初登壇＠jAZUG]アプリ開発者が気になるGoogleCloud/Azure＋wasm/wasi
Avatar for asaringo asaringo
0
130
CSC307 Lecture 17
Avatar for Javier Gonzalez-Sanchez javiergs
PRO
0
110
DroidKnights 2025 - 다양한 스크롤 뷰에서의 영상 재생
Avatar for 이가은 gaeun5744
3
170
F#で自在につくる静的ブログサイト - 関数型まつり2025
Avatar for pizzacat83 pizzacat83
0
290
Beyond Portability: Live Migration for Evolving WebAssembly Workloads
Avatar for Yuki Nakata chikuwait chikuwait
0
360

Featured

See All Featured
Site-Speed That Sticks
Avatar for Harry Roberts csswizardry
10
640
Code Review Best Practice
Avatar for Trisha Gee trishagee
68
18k
A better future with KSS
Avatar for Kyle Neath kneath
239
17k
Being A Developer After 40
Avatar for Adrian Kosmaczewski akosma
90
590k
Visualization
Avatar for Eitan Lees eitanlees
146
16k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
Avatar for Eileen M. Uchitelle eileencodes
26
2.8k
Docker and Python
Avatar for Tania Allard trallard
44
3.4k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
Avatar for Stéphanie Walter stephaniewalter
281
13k
The Art of Programming - Codeland 2020
Avatar for Erika Heidi erikaheidi
54
13k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
35
2.3k
What's in a price? How to price your products and services
Avatar for Michael Herold michaelherold
245
12k
A Tale of Four Properties
Avatar for Chris Coyier chriscoyier
159
23k

Transcript

  1. Intro to React Components Arun Michael Dsouza
 @amdsouza92 React Delhi/NCR

  2. Header Sidebar Slider News News

  3. Image source: www.hawaii.edu

  4. Props React element

  5. React element DOM element

  6. JSX bit.ly/2ttPzcV

  7. Functional components

  8. Class components

  9. Props are read-only!

  10. Props are read-only!

  11. All React components must act like pure functions with respect

    to their props. bit.ly/2ywNi6n

  12. Use state to update a component.

  13. None

  14. Dumb/stateless components

  15. Smart/statefull components

  16. • Abstracting complexity • Maintainability • Reusability • Ease of

    testing

  17. • https://reactjs.org/docs/components-and-props.html • https://www.youtube.com/watch?v=0BHoz0ptv7k • https://reactjs.org/docs/thinking-in-react.html Quick links

  18. Thank you! React Delhi/NCR Arun Michael Dsouza
 @amdsouza92