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

Art of building reusable component

Avatar for Anenth Anenth
October 07, 2017
Education
800
0

Art of building reusable component

How to think about structuring your components

Avatar for Anenth

Anenth

October 07, 2017

Other Decks in Education

See All in Education
Portable & Reproducible Research Environments in the Age of AI Agents
Avatar for Mai Nishimura denkiwakame
0
640
Lectura 2 (PIT : Python Basico)
Avatar for Abraham Zamudio robintux
0
420
SFプロトタイピング体験（滝中学校）
Avatar for ISHIGO Yusuke yusk1450
PRO
0
120
[2026前期火５] 論理学（京都大学文学部 前期 第4回）「 ならば（→）の導入と証明ネット」
Avatar for Shunsuke Yatabe yatabe
0
540
Visionary Initiative: Materials-Positive Society — Evolving “Things,” empowering a positive society | Science Tokyo
Avatar for Science Tokyo （東京科学大学） / Science Tokyo (Institute of Science Tokyo) sciencetokyo
PRO
0
200
Course Review - Lecture 13 - Next Generation User Interfaces (4018166FNR)
Avatar for Beat Signer signer
PRO
0
2.4k
Soluciones al examen de Geografía 2026. JULIO (Convocatoria Extraordinaria)
Avatar for Juan Martín Martín juanmartin2026
1
18k
Estimating Group × Time Interaction in Scale-Transformed CEFR-J Self-Assessment Scores: A Case in Study-Abroad Research
Avatar for Ken Urano uranoken
1
190
【セーフィー】テクニカルライティング&コミュニケーション実践講座（26新卒エンジニア向け研修資料）
Avatar for 山崎麻衣子 ymzaki_m4
0
310
Examen de Selectividad. Geografía julio 2026 (Convocatoria Extraordinaria). UCLM
Avatar for Juan Martín Martín juanmartin2026
1
12k
[2026前期火５] 論理学（京都大学文学部 前期 第5回）「 ならばの問題演習・proof net・かつの規則」
Avatar for Shunsuke Yatabe yatabe
0
390
[2026前期火５] 論理学（京都大学文学部 前期 第9回）「正規化の停止性——ヒドラゲームによる証明」
Avatar for Shunsuke Yatabe yatabe
0
230

Featured

See All Featured
Information Architects: The Missing Link in Design Systems
Avatar for Michelle Chin soysaucechin
1
1.1k
Chasing Engaging Ingredients in Design
Avatar for Sebastian Deterding codingconduct
0
280
GraphQLとの向き合い方2022年版
Avatar for Yosuke Kurami quramy
50
15k
Speed Design
Avatar for Sergey Chernyshev sergeychernyshev
33
2k
Optimising Largest Contentful Paint
Avatar for Harry Roberts csswizardry
37
3.9k
The Pragmatic Product Professional
Avatar for Laura Van Doore lauravandoore
37
7.4k
Stop Working from a Prison Cell
Avatar for Chris Michel hatefulcrawdad
274
21k
ReactJS: Keep Simple. Everything can be a component!
Avatar for Pedro Nauck pedronauck
666
130k
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
Avatar for Umar Saidu Auna auna
0
210
技術選定の審美眼（2025年版） / Understanding the Spiral of Technologies 2025 edition
Avatar for Takuto WADA twada
PRO
120
120k
Neural Spatial Audio Processing for Sound Field Analysis and Control
Avatar for NII S. Koyama's Lab skoyamalab
0
410
Context Engineering - Making Every Token Count
Avatar for Addy Osmani addyosmani
9
1.1k

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)