shadcn/ui
Gyakori hibák
Tipikus csapdák shadcn/ui használatnál: ui/ túl-módosítás, cn hiánya, duplikáció, use client, import utak.
Gyakori hibák
Túl sok direkt módosítás az ui/ mappában
Ha alkalmazás-specifikus logikát raksz az ui/ komponensekbe, nehezebben karbantartható lesz. Inkább wrapper komponens.
Nem következetes styling
Kerüld a vegyes inline style + Tailwind + CSS module kavalkádot; legyen egy domináns stratégia.
Tailwind osztályok ütközése cn nélkül
cn + tailwind-merge feloldja az ütközéseket.
Komponensek duplikálása
Ha ugyanaz a dialog/menü logika több helyen ismétlődik, emeld ki újrafelhasználható komponensbe.
Hiányzó "use client"
Interaktív komponenseknél (Dialog, Dropdown, Switch) Next.js App Routerban szükséges a "use client".
Rossz import útvonal
Az import tipikusan:
import { Button } from "@/components/ui/button"Rövid összefoglaló
- Rétegezz (ui vs wrapper).
- Mindig
cn-nel merge-elj. - Client-only komponenseknél figyelj a
"use client"-re.