------
Phần 44.
Học Bootstrap bằng tiếng Anh
Bỏ ra một tiếng nghe bài giảng Bootstrap bằng tiếng Anh (Bootstrap
Beginner Crash Course).
Học ngoại ngữ quan trọng ở sự rèn luyện thường xuyên.
Nghe bài giảng này được mấy cái lợi: rèn luyện tiếng Anh,
xem cộng đồng thế giới họ dạy những gì, mình còn thiếu cái gì để học thêm. Chưa
có tiền đi du học, cứ tưởng tượng mình đang ngồi trong lớp ở bên Tây, nghe
giảng dạy bằng tiếng Anh.
Phần sau đây ghi lại một số ý,
Bootstrap là một front-end framework giúp làm giao diện web
theo hướng responsive.
Bootstrap 3 phát triển dựa trên ý tưởng mobile first (mobile
first approach).
Bootstrap 3 sử dụng single grid system, không hỗ trợ IE7, FF
3.6; hỗ trợ từ IE8 trở lên.
Một số ưu điểm khi dùng framework:
- Framework đã làm sẵn nhiều công đoạn, nhiều xử lý
- Người lập trình vẫn có thể tùy biến được
Bất lợi khi dùng framework:
- Mã của dự án nhiều hơn, phức tạp (bloat)
- Phải học cách sử dụng framework
Bootstrap được xây dựng và chạy dựa trên jQuery, do vậy,
trong một trang web, cần tải thư viện jQuery trước thư viện Bootstrap. Nên tải
các thư viện này ở cuối phần body.
Đọc thêm về respond.js
Đọc thêm về .visible và .hidden
Nên sử dụng img-responsive cho các hình ảnh trong website.
Trong lập trình theo hướng responsive, nên sử dụng đơn vị đo
là “em”, ví dụ: padding: 2em 0;
Dùng thumbnail để hiển thị hình ảnh và nội dung.
Đọc thêm về Breadcrumbs: các đường link phân cấp.
Để thêm chữ MENU khi navbar bị thu nhỏ, dùng navbar-header.
Bootstrap sử dụng pull-left và pull-right tương đương với
float trong CSS.
Các class liên quan đến hiển thị văn bản (typography):
- Màu chữ: text-primary, text-success, text-info, text-warning,
text-danger, text-muted
- Màu nền: bg-primary, bg-success, bg-info, bg-warning, bg-danger,
bg-muted
Ba cách tạo nút (button):
- <button class="btn
btn-default">Button</button>
- <a href="" class="btn btn-default"
role="button">Link</a>
- <input type="submit" class="btn
btn-default" value="Submit">
Sức người có hạn, “rộng thì không sâu”, ý là học dàn trải
quá thì sẽ không chuyên sâu vào một thứ gì đó được. Vậy từ đầu đến giờ, học
nhiều thứ quá rồi, có sợ lan man quá không? Nếu xem lại Phần 1 – các công cụ để
làm web, sẽ thấy còn nhiều thứ nữa cần phải học, dù gì thì vẫn đang học kiến
thức để làm web thôi mà, mới chỉ ở mức cơ bản, có gì mà nhiều.
Khi biết nhiều sẽ có nhiều lựa chọn, ví dụ như tạo hiệu ứng
cho một nút, có thể sử dụng JavaScript thuần, có thể sử dụng jQuery, có thể sử
dụng Bootstrap, mỗi cách làm có những điểm mạnh và điểm yếu riêng, tùy từng
trường hợp mà sử dụng.
Quay trở lại ứng dụng openemr, tới thời điểm này, mới chỉ
biết dùng Sublime text để xem mã nguồn, mới biết dùng website demo có sẵn của
nó trên Internet, mới biết làm một vài xử lý rất đơn giản, vẫn chưa biết cách
để chạy được nó.
Các kiến thức đã học được cho tới thời điểm này gồm: quá
trình hiển thị trang web tại trình duyệt, hiểu về thiết kế web theo hướng
responsive (tùy chỉnh giao diện theo kích thước màn hình), gõ mã nhanh với
Sublime text, cơ bản biết cách dùng HTML, CSS, JavaScript, jQuery, jQuery UI,
JSON, Bootstrap, LESS.
Tới đây sẽ tạm thời kết thúc phần học về lập trình phía
client (client side). Còn rất nhiều các chủ đề liên quan đến lập trình phía
client, cứ tạm xem đó là những kiến thức nâng cao, và sẽ quay lại, sau khi học
xong các phần kiến thức cơ bản khác.
-----------
Cập nhật [18/10/2017][26/10/2016]
-----------