Tailwind CSS: utility-first và maintainability

Utility-first là gì?

Tailwind cung cấp class utility (flex, pt-4, text-center) thay vì viết CSS riêng. Style nằm trong markup, dễ nhìn thấy và không bị conflict. Design token (màu, spacing) nhất quán. Build time purge class không dùng nên bundle CSS nhỏ.

Component và extract

Tránh lặp class dài: dùng @apply trong CSS (ít) hoặc component React/Vue bọc div với class. Plugin Tailwind định nghĩa utility mới. Có thể dùng cva (class-variance-authority) cho variant (size, state) mà vẫn giữ utility.