Tailwind css: cuốn theo chiều gió!

2 years ago

Với công việc thiết kế và xây dựng website, mỗi lần nhận được design mới câu hỏi đầu tiên trong đầu sẽ là, cái gì đây nên chọn framework css nào cho tiện hay phải viết chay luôn.

Có không ít thư viện hỗ trợ viết các thành phần có sẵn, việc của developer chỉ là lắp ghép lại sao cho ra hình dáng trang web (Bootstrap, Bulma …).

Nhưng đời đâu có dễ dàng như vậy, luôn có những thành phần được thiết kế mới theo yêu cầu của từng app, công việc giờ đây là custom lại sao cho đúng yêu cầu.

Đôi khi việc viết lại từ đầu còn nhanh gọn và đỡ bị xung đột hơn so với là việc đi custom lại. Hôm nay mình đi tìm hiểu về Tailwind css. Một cứu cánh cho các những ng không thích viết css.

Tailwind là gì?

Cơ bản tailwind là một framework hỗ trợ phát triển web, với core-concept của nó là `utility-first` (ưu tiên sự hữu dụng).

Taillwind vừa có điểm giống và điểm khác so với các framwork css tiền bối đi trước.

Tailwind giống bootstrap hay thư viện css khác ở chỗ các thuộc tính css sẽ được gắn với 1 class nhất định, lập trình viên chỉ cần dùng lại chứ không cần phải viết css.

Khác biệt đầu tiên ở chỗ nó cho ta khẳng năng tùy chỉnh dựa vào bộ config, css tailwind không có sẵn mà sẽ được sinh ra khi trong project có dùng đến class đó. tức là những thần phần không dùng đến sẽ không bao giờ được xuất hiện. Thứ hai là mỗi class name của Tailwind thường chỉ được chỉ định với 1 thuộc tính css nhất định, chính sác từng px, từng mã màu. Không có gì conflit ở đây cả