Tailwind CSS: Thực hành Tốt nhất

Tailwind CSS là một framework CSS utility-first cho phép bạn xây dựng thiết kế hiện đại nhanh chóng. Dưới đây là một số thực hành tốt nhất để giữ code Tailwind của bạn dễ bảo trì và hiệu quả.

Trích xuất Component

Đừng lặp lại các chuỗi class dài. Trích xuất chúng thành components:

React

// ❌ Không tốt
<button className="px-4 py-2 bg-blue-500 text-white rounded-lg hover:bg-blue-600 transition-colors">
  Nhấn tôi
</button>
 
// ✅ Tốt