Bootstrap là gì?

NỘI DUNG BÀI VIẾT

Khi bắt đầu tập tành thiết kế Web, chắc hẳn bạn đã nghe thấy cái tên Bootstrap rồi đúng không? Bài viết này sẽ giúp bạn trả lời cho câu hỏi Bootstrap là gì, cùng mình tìm hiểu nhé!

Một Website được gọi là “Responsive” (Có tính đáp ứng), nếu nó tương thích với các thiết bị có độ lớn màn hình khác nhau như máy tính, máy tính bảng (Tablet), điện thoại di động (Mobile).

Trước năm 2013, một website muốn tương thích với máy tính và điện thoại di động, các lập trình viên phải viết 2 project khác nhau. Project thứ nhất là một ứng dụng web phục vụ cho những người dùng sử dụng máy tính hoặc máy tính bảng.

Và project thứ 2 là ứng dụng web dành cho những người dùng sử dụng các thiết bị với màn hình bé như điện thoại di động. Điều này thực sự gây ra sự khó khăn trong bảo trì và nâng cấp website, vì bạn phải làm điều đó cho cả 2 project. Ngoài ra 2 chúng phải được triển khai trên 2 tên miền (domain) khác nhau, chẳng hạn:

http://hocjavascript.net
http://mobile.hocjavascript.net

Năm 2013 được coi là năm của các thiết kế “Responsive”, bởi vì người dùng ngày càng ưu chuộng các thiết bị cầm tay nhỏ như máy tính bảng và điện thoại thông minh. Hành vi của đa số người dùng đã thay đổi, họ chuyển dần sang đọc các tin tức của họ thông qua các thiết bị di động.

Bootstrap

Bootstrap là một nền tảng (framework) miễn phí, mã nguồn mở, dựa trên HTML, CSS & JavaScript, nó được tạo ra để xây dựng các giao diện Website tương thích với tất cả các thiết bị có kích thước màn hình khác nhau.

Bootstrap bao gồm những cái cơ bản có sẵn như: typography, forms, buttons, tables, navigation, modals, image carousels và nhiều thứ khác. Nó cũng có nhiều Component, Javascript hỗ trợ cho việc thiết kế Reponsive của bạn dễ dàng, thuận tiện và nhanh chóng hơn.

Hiện nay Bootstrap là một trong những framework được sử dụng nhiều nhất trên thế giới để tạo ra các Responsive Website. Bootstrap đã tạo ra một tiêu chuẩn riêng, và rất được các lập trình viên ưu chuộng. Về cơ bản Bootstrap có 3 ưu điểm:

Dễ sử dụng: Vì Bootstrap được xây dựng trên HTML, CSS & JavaScript.
Responsive: Bootstrap đã xây dựng sẵn các “Responsive Css” tương thích với các thiết bị khác nhau, vì vậy bạn chỉ cần học cách sử dụng chúng. Tính năng này giúp tiết kiệm rất nhiều thời gian cho các người dùng khi tạo ra các Website thân thiện.
Tương thích với các trình duyệt: Nó tương thích với tất cả các trình duyệt (Chrome, Firefox, Internet Explorer, Safari, Opera). Tuy nhiên, với IE, Bootstrap 4 chỉ hỗ trợ từ IE10 trở lên.

Lịch sử của Bootstrap

Bootstrap, ban đầu có tên là Twitter Blueprint, được phát triển bởi Mark Otto và Jacob Thornton tại Twitter như một khuôn khổ để khuyến khích sự nhất quán trên các công cụ nội bộ.

Trước khi Bootstrap, các thư viện khác nhau được sử dụng để phát triển giao diện, dẫn đến sự thiếu nhất quán và gánh nặng bảo trì cao.Sau một vài tháng phát triển bởi một nhóm nhỏ, nhiều nhà phát triển tại Twitter đã bắt đầu đóng góp cho dự án như một phần của Tuần lễ Hack, một tuần theo phong cách hackathon dành cho nhóm phát triển Twitter.

Nó được đổi tên từ Twitter Blueprint thành Bootstrap, và được phát hành như một dự án nguồn mở vào ngày 19 tháng 8 năm 2011. Nó tiếp tục được duy trì bởi Mark Otto, Jacob Thornton và một nhóm nhỏ các nhà phát triển cốt lõi, cũng như một cộng đồng lớn người dùng.

Các phiên bản của Bootstrap

Phiên bản	Ngày phát hành	Nội dung chính
1.0	19/08/2011	Phiên bản đầu tiên của Bootstrap, chưa hô trợ Mobile.
2.0	31/01/2012	Bổ xung hệ thống Grid-Layout 12 cột. Thêm một số thành phần (component) mới. Và thay đổi một vài thành phần sẵn có. Vẫn chưa hỗ trợ Mobile.
3.0	19/08/2013	Các thành phần được thiết kế lại theo phong cách thiết kế phẳng (flat design). Và lần đầu tiên hỗ trợ các thiết bị Mobile.
4.0	19/01/2018	Bootstrap 4 gần như viết lại hoàn toàn từ Bootstrap 3, và được đánh giá là dễ sử dụng hơn rất nhiều so với phiên bản trước.

Kết luận

Qua đây là một số chia sẻ về Bootstrap, mời bạn tiếp tục theo dõi các bài viết sau để hiểu rõ hơn về Bootstrap.

Các bạn có thể tham khảo các bài viết hay về Bootstrap tại đây.

Hãy tham gia nhóm Học lập trình để thảo luận thêm về các vấn đề cùng quan tâm.

Bootstrap là gì?