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

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

Arun Michael Dsouza
July 01, 2018
Programming
1
680

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

Introductory talk on React components, what they are and how to create them.

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
arunmichaeldsouza
0
51
Using the Gamepad API for a better gaming experience on the web
arunmichaeldsouza
0
200
React JS Code Splitting - Why and How?
arunmichaeldsouza
1
170
Building your first web app with React JS, Webpack and Babel
arunmichaeldsouza
0
270
React 16 & NPM, Create your own library - React Delhi NCR 07 Oct 2018 Meetup
arunmichaeldsouza
0
150
Houdini, what lies ahead - Web Weekend Kathmandu 2018
arunmichaeldsouza
0
120
Houdini, what lies ahead - JSConf Iceland 2018
arunmichaeldsouza
0
440
The Era of Module Bundlers - GDG Dev Fest Delhi 2017
arunmichaeldsouza
0
150
Getting started with React 16
arunmichaeldsouza
1
1.1k

Other Decks in Programming

See All in Programming
「今のプロジェクトいろいろ大変なんですよ、app/services とかもあって……」/After Kaigi on Rails 2024 LT Night
junk0612
5
2.1k
とにかくAWS GameDay！AWSは世界の共通言語！ / Anyway, AWS GameDay! AWS is the world's lingua franca!
seike460
PRO
1
860
レガシーシステムにどう立ち向かうか　複雑さと理想と現実/vs-legacy
suzukihoge
14
2.2k
見せてあげますよ、「本物のLaravel批判」ってやつを。
77web
7
7.7k
TypeScriptでライブラリとの依存を限定的にする方法
tutinoko
2
660
Jakarta Concurrencyによる並行処理プログラミングの始め方 (JJUG CCC 2024 Fall)
tnagao7
1
290
ピラミッド、アイスクリームコーン、SMURF: 自動テストの最適バランスを求めて / Pyramid Ice-Cream-Cone and SMURF
twada
PRO
10
1.3k
2024/11/8 関西Kaggler会 2024 #3 / Kaggle Kernel で Gemma 2 × vLLM を動かす。
kohecchi
5
910
Webの技術スタックで マルチプラットフォームアプリ開発を可能にするElixirDesktopの紹介
thehaigo
2
1k
【Kaigi on Rails 2024】YOUTRUST スポンサーLT
krpk1900
1
330
A Journey of Contribution and Collaboration in Open Source
ivargrimstad
0
880
リアーキテクチャxDDD 1年間の取り組みと進化
hsawaji
1
220

Featured

See All Featured
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
28
2k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
38
1.8k
Building a Scalable Design System with Sketch
lauravandoore
459
33k
Java REST API Framework Comparison - PWX 2021
mraible
PRO
28
8.2k
Done Done
chrislema
181
16k
Designing on Purpose - Digital PM Summit 2013
jponch
115
7k
Measuring & Analyzing Core Web Vitals
bluesmoon
4
120
Mobile First: as difficult as doing things right
swwweet
222
8.9k
GitHub's CSS Performance
jonrohan
1030
460k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
8
850
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
93
16k
Writing Fast Ruby
sferik
627
61k

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