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

Art of building reusable component

Anenth
October 07, 2017
Education
0
750

Art of building reusable component

How to think about structuring your components

Anenth

October 07, 2017
Tweet

Other Decks in Education

See All in Education
自己紹介 / who-am-i
yasulab
PRO
2
4.3k
Comezando coas redes
irocho
0
400
AWS Well-Architected Labを活用してつよつよAWSエンジニアになろう！！！ #jawsug_tokyo
masakiokuda
0
220
Kindleストアで本を探すことの善悪 #Izumo Developers' Guild 第1回 LT大会
totodo713
0
150
Requirements Analysis and Prototyping - Lecture 3 - Human-Computer Interaction (1023841ANR)
signer
PRO
0
850
Use Cases and Course Review - Lecture 8 - Human-Computer Interaction (1023841ANR)
signer
PRO
0
790
開発終了後こそ成長のチャンス！プロダクト運用を見送った先のアクションプラン
ohmori_yusuke
2
190
2024年度秋学期　統計学　第2回　統計資料の収集と読み方（授業前配付用） (2024. 10. 2)
akiraasano
PRO
0
100
Utiliser Linkedin pour améliorer son personal branding
martine
0
100
ルクソールとツタンカーメン
masakamayama
1
1.1k
Web Search and SEO - Lecture 10 - Web Technologies (1019888BNR)
signer
PRO
2
2.5k
【COPILOT無料セミナー】エンゲージメントと自律性の高いプロジェクト型人材育成に向けて～プロジェクト・ベースド・ラーニング（PBL）という選択肢～
copilot
PRO
0
190

Featured

See All Featured
ピンチをチャンスに：未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
111
49k
Being A Developer After 40
akosma
87
590k
Building Better People: How to give real-time feedback that sticks.
wjessup
365
19k
4 Signs Your Business is Dying
shpigford
181
21k
Thoughts on Productivity
jonyablonski
67
4.4k
Designing for Performance
lara
604
68k
Building a Scalable Design System with Sketch
lauravandoore
460
33k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
Practical Orchestrator
shlominoach
186
10k
Writing Fast Ruby
sferik
628
61k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
38
1.9k
Fashionably flexible responsive web design (full day workshop)
malarkey
405
66k

Transcript

  1. A R T O F B U I L D

    I N G R E U S A B L E C O M P O N E N T S

  2. Anenth (@anenthv) Senior front end engineer recruiterbox

  3. T H E M A G I C Functional components

    + CSS

  4. Text Input Button Card Page

  5. Page Card

  6. Text Input Button

  7. Modifiers

  8. None
  9. None
  10. None
  11. None

  12. Modifiers

  13. None

  14. Card Card Header

  15. Text Grid

  16. None

  17. • Decouple 3rd party libs • Documentation - React story

    book • Pluggable nature of CSS • Faster feature delivery • Happy developers • Too many props means you are in trouble! • We + Designers

  18. Demo time http://bit.ly/art-rcom

  19. T H A N K Y O U Anenth (@anenthv)