Lập trình giao diện Website sử dụng kỹ thuật Responsive Web Design. Response Mobile Website dựa trên kích thước người dùng.
Thông Tin Tổng Quan Và Kiến Thức
Nội dung chi tiết, từ khóa liên quan đến kiến thức lập trình cụ thể và các thông tin về ngôn ngữ lập trình đã nhắc đến trong buổi học này gồm có:
- Học về Responsive Web Design.
- Học về Bootstrap Layout break-point.
- Học về CSS Media Query.
- Responsive class trong CSS Framework Bootstrap 4.
- Thực hành giao diện Website: Sign In, Checkout.
- Giới thiệu về CSS Framework Bootstrap 4 – Card Component.
- Thực hiện bài tập đổi responsive đổi màu cờ.
Nguồn Tham Khảo Chính Trong Buổi Học
Tài liệu cần phải tham khảo để nắm được các thông tin đã học, dựa trên nguồn tài liệu cơ bản này để có thể tìm kiếm, tự nâng cao kiến thức lập trình.
Nguồn tài liệu, link tải phần mềm,… tương đối chính xác và hữu ích dựa trên sự tổng hợp của mình:
- Thông tin buổi học trước: Ngôn ngữ tiền xử lý SCSS và cú pháp BEM trong lập trình Website – HTML 5 – https://namcoi.com/ngon-ngu-tien-xu-ly-scss-va-cu-phap-bem-trong-lap-trinh-website-html-5/
- Responsive Web Design: https://www.w3schools.com/css/css_rwd_intro.asp
- CSS Framework Bootstrap 4 Layout break-point: https://getbootstrap.com/docs/4.3/layout/overview/
- CSS Media Query: https://www.w3schools.com/css/css3_mediaqueries.asp
- CSS Media Query – 2 : https://www.w3schools.com/css/css_rwd_mediaqueries.asp
- CSS Framework Bootstrap 4 Responsive Class: https://getbootstrap.com/docs/4.3/layout/grid/#responsive-classes
- Mã nguồn bài tập đổi màu cờ: https://github.com/namnh06/html-demo/tree/master/responsive-flag
- Mã nguồn bài tập Sign In: https://github.com/namnh06/html-demo/tree/master/sign-in
- Bootstrap 4 Sign In: https://getbootstrap.com/docs/4.3/examples/sign-in/
- Bootstrap 4 Checkout: https://getbootstrap.com/docs/4.3/examples/checkout/
- Bootstrap 4 – Card Component: https://getbootstrap.com/docs/4.3/components/card/
Yêu Cầu Cần Thực Hiện Sau Buổi Học
Những yêu cầu, bài tập phải thực hiện và tìm hiểu thêm để đảm bảo chất lượng trong quá trình học lập trình website bao gồm:
- Thực hiện bài tập Album: https://getbootstrap.com/docs/4.3/examples/album/
- Thực hiện bài tập Pricing: https://getbootstrap.com/docs/4.3/examples/pricing/
- Đọc trước thông tin buổi học tiếp theo: Mô hình Waterfall, thiết kế Mockup trong Lập Trình Website – HTML 7 – https://namcoi.com/mo-hinh-waterfall-thiet-ke-mockup-trong-lap-trinh-website-html-7/
Kiến Thức Bổ Trợ Phải Tham Khảo Cho Lập Trình Viên Website
Phần này bao gồm các bài báo, bài viết, thông tin chia sẻ, kiến thức kèm theo, kiến thức bổ trợ cho quá trình học lập trình.
Các bài viết được chia sẻ bám sát với quá trình học và từ các nguồn thông tin có uy tín, đã được kiểm duyệt:
- Giới thiệu về Media CSS trong Responsive https://viblo.asia/p/gioi-thieu-ve-media-css-trong-responsive-4dbZNDEL5YM
- Sử dụng @Media CSS tạo Responsive cho Website https://freetuts.net/su-dung-media-css-tao-responsive-cho-website-660.html
- Giới thiệu về Bootstrap Card Component https://viblo.asia/p/gioi-thieu-ve-bootstrap-card-component-WAyK8VxolxX
Lập trình Website cần thời gian, óc sáng tạo và kỹ năng tìm kiếm.
Lập Trình Viên cần có sự cố gắng, kiên trì và không ngừng nỗ lực.
Chúc các bạn may mắn và thành công trong môn học Lập Trình Ứng Dụng Website với PHP & MySQL tại Softech Aptech Đà Nẵng.