Komponensben gondolkodj, ne oldalban

Day 16 of 30 · The Playbook 2026 – Mesterkurzus Designereknek

Oldalak helyett komponens-API-ban gondolkodsz: állapotok, felelősségi határ, használati korlát.


Tanulási cél

  • Komponens API: props, állapot, események.
  • Felelősségi határ: mit tud és mit nem.
  • Használati szabály: hol tilos használni.
  • Dokumentálsz jó/rossz példát.

Miért fontos

  • Oldal-fókuszú munka duplikációhoz vezet.
  • Komponens = újrahasznosítás + konzisztencia.
  • Világos API nélkül instabil lesz a rendszer.

Magyarázat

  • API: kötelező/opcionális propok, események, állapotok.
  • Felelősség: mit nem csinál (pl. a kártya nem fetch-el adatot).
  • Dokumentáció: használati példák + tiltások.

Példák

Rossz: Minden oldal egyedi kártyát épít.

Jó: Kártya komponens API-val, állapotokkal, dokumentált korlátokkal.


Gyakorlat (vezetett)

  1. Válassz egy UI-t (kártya, input-csoport), írd le az API-t.
  2. Listázd az állapotokat (hover, focus, error, loading).
  3. Írd le a tiltásokat (hol nem használható).

Gyakorlat (önálló)

Dokumentáld a komponens API-t a Playbookban, linkkel Figma/Storybookra.


Önellenőrzés

  • API leírva.
  • Állapotok feltérképezve.
  • Tiltási lista megvan.

Opcionális mélyítés