Khóa học Front-End Cốt lõi thiết kế website với HTML, CSS, JavaScript , Jquery, Responsive, Bootstrap, dàn layout từ Photoshop
Khóa học Front-End Cốt lõi thiết kế website với HTML, CSS, JavaScript , Jquery, Responsive, Bootstrap, dàn layout từ Photoshop
admin
Học viên sẽ học được gì sau khi học khóa học của bạn ?
- Nắm bắt tổng quan về thiết kế web, nền tảng công nghệ liên quan đến xây dựng website.
- Các khải niệm đầy đủ về xây dựng một website.
- Các bước để thực hiện một website.
- Cách thiết kế và bố cục website để thu hút độc giả và người dùng.
- Các kinh nghiệm xây dựng website thân thiện với người dùng.
- HTML- các kiến thức căn bản và chuyên sâu về ngôn ngữ trình bày website
- HTML Form – gởi nhận thông tin trong website
- CSS – các kiến thức căn bản và chuyên sau để trình bày giao diện website, style cho website
- Javascript – tương tác với website ở phía người dùng.
- Jquery – một thư viện hỗ trợ xây dựng tương tác website được sử dụng rất rộng rãi trong việc xây dựng website.
- Slideshow cho các banner trong website
- Các khái niệm quan trọng về khái niệm xây dựng website chạy trên đa thiết bị, đa trình duyệt
- Khái niệm về bootstrap website – một khái niệm để xây dựng website hiện đại.
- Luyện tập chia bố cục website
- Luyện tập thông qua 2 layout website thực tế.
Đối tượng nên học khóa này là ai ?
- Tất cả các bạn đam mê lập trình
Giới thiệu về khóa học
Xin chào tất cả các bạn, thông qua khoá học này, tôi hy vọng sẽ mang đến các bạn những kiến thức nền tảng nhất, những bước đi khởi đầu cho nghề lập trình web.
Hiện nay, thiết kế website là rất cần thiết cho doanh nghiệp, website mang đến những thông tin cập nhật nhanh nhất về các dịch vụ của doanh nghiệp. Với sự phát triển của cơ sở hạ tầng, băng thông mạnh hơn hẳn, các phần mềm cũng dẫn chuyển sang nền tảng web. Các nhà phát triển web cũng được tuyển dụng ngày càng nhiều. Khoá học này đặt nền móng vững chắc cho các bạn về thuỷ tổ khởi nguồn của web, lịch sử web, các khái niệm quan trọng như hosting, domain, các bước thiết kế một website là gì.
Một điều tôi cũng nhấn mạnh trong khoá học này cũng chính là khi bắt đầu thiết kế một website, chúng ta cần phải có những định hướng nào? Làm thế nào để website của mình thu hút được nhiều người dùng, làm sao người dùng cảm thấy tiện dụng, họ truy cập và ở lâu trên website của mình, website của mình như thế nào để lôi kéo được nhiều nguòi dùng và chiến thắng các website khác. Các kiến thức này được trình bày qua các khái niệm và một số kinh nghiệm về UI, UX của tôi khi thiết kế các website. Khoá học cũng mang đến cho các bạn những khái niệm cơ bản và quan trọng của các thẻ HTML, CSS, javascript, jquery,…, trong từng bài học, tôi cố gắng trình bày kèm theo nhiều ví dụ trực quan, một số layout dạng thực tế để các bạn dễ tiếp cận và vận dụng. Một trong những khái niệm và kỹ thuật quan trọng như boostrap web, responsive web là gì cũng được tôi trình bày và vận dụng trong khoá học này.
Cuối khoá học, tôi cũng áp dụng tất cả các kiến thức để hướng dẫn các bạn thực hiện một số layout cho website bán hàng thời trang. Tôi hy vọng, với khoá học này, các bạn hiểu rõ, hiểu sâu để có thể áp dụng, vận dụng trong việc thiết kế các website cho mình hoặc cho các khách hàng của mình.
Đề cương khóa học
CHƯƠNG I: GIỚI THIỆU KHOÁ HỌC
Tài liệu + source code Thiết kế web căn bản
Bài 1: Giới thiệu khóa học
CHƯƠNG II: TỔNG QUAN VỀ WEB &, INTERNET / CÁC BƯỚC XÂY DỰNG WEBSITE
Tổng quan về thiết kế web và các bước xây dựng - Phần 1
Tổng quan về thiết kế web và các bước xây dựng – Phần 2
CHƯƠNG III: UI và UX TRONG THIẾT KẾ WEBSITE
Bài 3: UI và UX trong thiết kế website
CHƯƠNG IV: HTML CĂN BẢN VÀ BÀI TẬP
Bài 4: HTML là gì, Cấu trúc HTML - Phần 1
Bài 5: HTML là gì, Cấu trúc HTML – Phần 2
Bài 6: Các tag cơ bản - phần 1
Bài 7: Các tag cơ bản - phần 2
Bài 8: Các tag cơ bản - phần 3
Bài 9: Các tag cơ bản - Phần 4
Bài 10.1: Bài tập tổng hợp các thẻ - phần 1
Bài 10.2 : Bài tập tổng hợp các thẻ - phần 2
Bài 11: HTML Form phần 1
Bài 12: HTML Form - phần 2
Bài 13: HTML Form - phần 3
Bài 14: HTML Form - Phần 4
Bài 15: HTML Form - phần 5
Bài 16.1: Bài tập Form - phần 1
Bài 16.2 - Bài tập Form - phần 2
Bài 16.3 : Phân biệt thuộc tính "value" và "name"
CHƯƠNG V: TỔNG QUAN VỀ CSS VÀ BÀI TẬP
Bài 17: CSS - Giới thiệu
Bài 18: CSS - Cú pháp
Bài 19: CSS Selector
Bài 20: Bài tập CSS - Bài tập 1
Bài 21: Các loại CSS - lý thuyết
Bài 22: Các loại CSS – thực hành
Bài 23: CSS layout - phần 1
Bài 24: CSS layout - phần 2
Bài 25: CSS layout - phần 3
Bài 26: CSS layout - phần 4
Bài 27: CSS layout - phần 5
Bài 28: CSS layout - phần 6
Bài 29: CSS Layout - Phần 7
Bài 30: CSS -Layout phần 8
Bài 31: CSS Layout - Phần 9
Bài 32.2 - Bài tập CSS - Chia bố cục
Bài 32.3: BÀI TẬP CSS – Top Header
Bài 32.4: Bài tập CSS - Logo - Menu
Bài 32.5: Bài tập CSS- Slider-Sản phẩm
Bài 32.6 - Bài tập CSS - Phần cuối
CHƯƠNG VI: JAVASCRIPT &, DOM
Bài 33: Javascript phần 1
Bài 34: Javascript phần 2
Bài 35: Javascript phần 3
Bài 36: Javascript phần 4
Bài 37: Javascript phần 5
Bài 38: Javascript phần 6
Bài 39: Javascript phần 7
Bài 40: Javascript phần 8
Bài 41: Javascript DOM - phần 1
Bài 42: Javascript DOM - phần 2
Bài 43: Javascript DOM - phần 3 - Bài tập nhỏ
Bài 44: Javascript DOM - phần 4 - Bài tập nhỏ (Number)
Bài 45: Javascript DOM - phần 5 - Bài tập tạo table động
Bài 46: Javascript DOM - phần 6 - Bài tập tạo dropbox động
Bài 47: Javascript DOM - phần 7 - Đối tượng Date
Bài 48: Javascript DOM - phần 8 - Đối tượng Chuỗi - phần 1
Bài 49: Javascript DOM - phần 9 - Đối tượng Chuỗi - phần 2
Bài 50: Javascript DOM - phần 10 - Các hộp thoại
Bài 51: Javascript DOM - phần 11 - Thay đổi CSS - ví dụ
Bài 52: Javascript DOM - phần 12 - Form Validation
Bài 53: Javascript DOM - phần 13 - Form Validation 2
Bài 54: Javascript DOM - phần 14 - Form Validation 3
Bài 55: Bài tập Javascript tông hợp - phần 1
Bài 56: Bài tập Javascript tổng hợp - phần 2
Bài 57: Bài tập Javascript tổng hợp - phần 3
Bài 58: Bài tập Javascript tổng hợp - tổng kết
CHƯƠNG VII: JQUERY
Bài 59: jQuery - phần 1
Bài 60: jQuery - phần 2
Bài 61: jQuery - phần 3
Bài 62: jQuery - phần 4
Bài 63: jQuery - phần 5
Bài 64: jQuery - phần 6
Bài 65: jQuery - phần 7
Bài 67: jQuery - DOM
Bài 68: jQuery - DOM - Tiếp theo
Bài 69: jQuery - DOM - CSS
Bài 70: jQuery - DOM - CSS - tiếp theo
Bài 71: jQuery - DOM - Traversing - Descendants - phần 1
Bài 72: jQuery - DOM - Traversing - Descendants - phần 2
Bài 73: jQuery - DOM - Traversing - Descendants - phần cuối
Bài 74: Cách sử dụng từ khoá tìm kiếm google -API, component jquery - bài tập jQuery form validation
Bài 75: jQuery và slideshow cho banner trang web
CHƯƠNG VIII: BOOTSTRAP &, RESPONSIVE
Bài 76: Khái niệm Responsive Web
Bài 77: Bootstrap - các khái niệm
Bài 78: Hệ thống grid trong bootstrap
Bài 79: Glyphicon và Jumbotron trong bootstrap
Bài 80: Sử dụng image trong bootstrap
Bài 81: Sử dụng menu - navigation trong bootstrap - phần 1
Bài 82: Sử dụng menu - navigation trong bootstrap - phần 2
Bài 83: Carousel bootstrap
CHƯƠNG IX: ĐỒ ÁN THỰC HÀNH 1
Bài 84: Giới thiệu Đồ án Xây dựng layout Website Giới thiệu công ty
Bài 85: Lập trình đồ án 1 - phần 1
Bài 86: Lập trình đồ án 1 – kết thúc
Bài 87: Animation - hiệu ứng chuyển động cho website
Mã nguồn - Sourcecode Đồ án 1
CHƯƠNG X: ĐỒ ÁN THỰC HÀNH 2
Sourcecode - Mã nguồn - Đồ án 2
Bài 88: Giới thiệu đồ án 2 - Dàn layout website theo template hỗ trợ bootstrap
Bài 89: Chia sẻ một số kinh nghiệm trong xây dựng website - Trang chủ Đồ án 2 - P1
Bài 90: Trang chủ Đồ án 2 – Phần cuối
Bài 91: Phân tích các trang còn lại - đồ án 2
Bài 92: Tổng kết khoá học
CHƯƠNG BỔ SUNG: Hướng dẫn sử dụng Sublime Text3 và các mẹo làm nhanh cho HTML,CSS
HD và cài đặt công cụ Sublime Text 3 hỗ trợ HTML, CSS - P 1
HD và cài đặt công cụ Sublime Text 3 hỗ trợ HTML, CSS - P 2
HD và cài đặt công cụ Sublime Text 3 hỗ trợ HTML, CSS - P 3
HD và cài đặt công cụ Sublime Text 3 hỗ trợ HTML, CSS - P 4
BHD và cài đặt công cụ Sublime Text 3 hỗ trợ HTML, CSS - Phần cuối
CHƯƠNG BỔ SUNG BÀI MỚI
NEW: Code bài tập javascript: Máy tính cầm tay
NEW: Tạo Bootstrap Tooltip
NEW: Tạo Bootstrap Popover
NEW: Bổ sung chia layout Bootstrap
Chương XI: CẮT FILE PHOTOSHOP VÀ DÀN LAYOUT BOOTSTRAP
Mã nguồn chương trình + File Photoshop PSD - Dàn layout
Giới thiệu dự án Cắt layout PSD và dàn trang bootstrap, tạo trang giới thiệu - CV ấn tượng
Các thao tác cơ bản trong Photoshop khi cắt layout - P1
Các thao tác cơ bản trong Photoshop khi cắt layout - P2
Tìm hiểu media query CSS3
NEW: Bí quyết tạo Project mới khi dàn layout không tốn thời gian với template
NEW: Cắt PSD và dàn layout bootstrap (P1)
NEW: Cắt PSD và dàn layout bootstrap (P2)
NEW: Cắt PSD và dàn layout bootstrap (P3)
NEW: Cắt PSD và dàn layout bootstrap (P4)
NEW: Cắt PSD và dàn layout bootstrap (P5)
NEW: Cắt PSD và dàn layout bootstrap (P6)
Google Driver
Pass giải nén: khosinhvien.com
Hướng dẫn getlink tại kho Sinh Viên : tại đây hoặc xem hình ảnh mịnh họa dưới
Nguồn Kho Sinh Viên - Tất cả dữ liệu chia sẽ hoàn toàn miễn phí
