fbpx

Tailwind vs Bootstrap lập trình viên Frontend nên chọn framework nào?

Tailwind vs Bootstrap

TailwindBootstrap là hai framework CSS phổ biến nhất hiện nay.

Nếu là một lập trình viên, bạn sẽ chọn framework nào để sử dụng?

Ngay hôm qua, 2 bạn học viên của mình đã tranh cãi với nhau.

Một bạn thì cho rằng Bootstrap tốt hơn.

Nhưng bạn còn lại thì cho rằng Tailwind tốt hơn.

Vậy đâu mới là framework tốt nhất?

Thật ra, tùy từng tình huống cụ thể mà mỗi framework sẽ đem lại lợi ích nhất định cho dự án.

Vì vậy, bạn cần phải hiểu tính chất kỹ thuật của mỗi framework trước rồi mới có thể đưa ra lựa chọn phù hợp.

Nếu bạn muốn biết rõ hơn thì xem hết bài viết nhé!

1. Bootstrap là gì?

Bootstrap là một framework cung cấp các thành phần giao diện có sẵn.

Ví dụ như là Buttons, Button Group, Navbar,…

Bootstrap cung cấp các thành phần giao diện có sẵn

Nếu bạn không biết nhiều kiến thức CSS, bạn cũng có thể dễ dàng sử dụng Bootstrap để tạo ra một giao diện trang web với đầy đủ chức năng.

Nếu bạn muốn tùy chỉnh lại các thành phần giao diện có sẵn hoặc tạo ra các thành phần giao diện đặc thù theo ý muốn thì Bootstrap vẫn có thể hỗ trợ. Tuy nhiên việc hỗ trợ này vô cùng hạn chế.

Như vậy, Bootstrap chỉ phù hợp với những dự án không đầu tư quá nhiều vào giao diện hoặc nhân sự chỉ bao gồm các lập trình viên backend.

2. Tailwind là gì?

Tailwind là một framework không cung cấp các thành phần giao diện có sẵn như Bootstrap mà thay vào đó là cung cấp các giá trị class tiện ích.

Tailwind cung cấp các giá trị class có sẵn

Tại ví dụ trên, nếu mình muốn thẻ <p> hiển thị kích thước lớn hơn thì mình chỉ cần sử dụng giá trị class text-xl cho thẻ <p>.

Nếu muốn in nghiêng thì sử dụng giá trị class italic.

Còn nếu muốn hiển thị màu xanh đậm thì sử dụng giá trị class text-blue-700.

Đây là các giá trị class tiện ích có sẵn mà Tailwind cung cấp.

Ngoài ra còn có rất nhiều giá trị class khác, bạn có thể tham khảo tại trang web của Tailwind.

Trang web của Tailwind

Như vậy, khi sử dụng Tailwind, bạn có thể dễ dàng tạo ra các thành phần giao diện theo ý muốn với độ tùy chỉnh cao mà không cần viết bất kỳ đoạn code CSS nào cả.

Mặc dù không viết code CSS, nhưng bạn phải nắm vững kiến thức nền tảng CSS thì mới có thể sử dụng được Tailwind.

Do đó, Tailwind sẽ phù hợp với những dự án có bản thiết kế giao diện riêng và yêu cầu người lập trình viên phải có kiến thức CSS.

3. Kết luận

Sau khi đã hiểu sự khác nhau cơ bản giữa Tailwind và Bootstrap, mình tin rằng bạn sẽ biết cách chọn ra framework CSS phù hợp nhất cho dự án.

Và Tailwind cũng là một môn học trong khóa học lập trình web của LetDiv.

Nếu quan tâm, bạn có thể tham khảo chi tiết tại đây nhé.

Tùng ViO

Tùng ViO

Mình là Tùng ViO, hiện tại đang là Founder và cũng là giảng viên tại LetDiv. Rất hân hạnh được làm quen với bạn!