Lập trình Frontend nâng cao qua project thực tế

 [masp]fedu-10[/masp]

[giaban]0đ[/giaban]

[tinhtrang]Còn hàng[/tinhtrang]

[chitiet]

Lập trình Frontend nâng cao qua project thực tế

Giới thiệu khóa học

Học viết hiệu ứng qua việc cover lại, làm lại, code lại các hiệu ứng để hiểu bản chất các hiệu ứng trên web.

Khi nói đến lập trình Frontend bạn hình dung được những công việc mà người lập trình làm như là xây dựng các chức năng giao tiếp, tương tác trực tiếp với người dùng, là người tô mẫu, trang trí cho các giao diện do các lập trình viên backend xây dựng. Frontend là những thành phần bạn thấy như font chữ, màu sắc, menu lựa chọn, hay thanh trượt, slide, hiệu ứng màu, di chuyển, … đó là sản phẩm của các lập trình viên Frontend.

Họ xây dựng giao diện theo đúng yêu cầu thiết kế, tương tác, chuyển động theo đúng ý tưởng sáng tạo đem lại cho giao diện đẹp, trải nghiệm tốt, thể hiện được phong cách của trang website. Để thực hiện tốt các vấn đề trên, đòi hỏi lập trình viên Frontend phải thành thạo các ngôn ngữ chính như: HTML, CSS, JavaSCrip, các thư viện jQuery …., Lập trình viên phải tương tác tốt với các frameword như Bootstrap để đảm bảo nội dung có hiển thị tốt trên các thiết bị di động, trình duyệt ….cải thiện tốc độ trang website.

Hơn 95% doanh nghiệp đã có Website cho riêng mình! Còn bạn thì sao? Bạn muốn tự mình thực hiện giao diện Web hoặc tự tạo trang trình bày sản phẩm. Hay bạn muốn tự thiết kế trang Blog cho cá nhân, tự làm trang Web giới thiệu công ty, cửa hàng?

Bạn đang muốn trở thành Lập trình Frontend, nâng cao kỹ năng lập trình HTML & CSS?Bạn đang muốn nâng cao thu nhập của mình bằng nghề thiết kế web, lập trình frontend? 

Hãy đăng kí ngay khoá học “Học lập trình frontend nâng cao thông qua project thực tế (Bootstrap nâng cao)” được hướng dẫn và thực hiện bởi Chuyên gia Nguyễn Đức Việt.

THAM GIA KHOÁ HỌC, BẠN SẼ ĐƯỢC CUNG CẤP ĐẦY ĐỦ KIẾN THỨC VỀ:

Thuộc tính CSS3 quay, zoom, origin và transition

Viết hiệu ứng slide nhanh

Xử lý hiệu ứng isotope

Thực hiện cắt web và làm giao diện responsive

Xử lý phần CSS cho carousel

Thực hành 2 project hoàn chỉnh: THEFOX, ARTICA

KHOÁ HỌC ĐANG HƯỚNG ĐẾN NHỮNG BẠN: 

Sinh viên muốn đi sâu vào lĩnh vực lập trình frontend.

Những người muốn tự thiết kế website của mình.

Những người đã có kiến thức căn bản về công cụ frontend muốn làm nó một cách hệ thống hơn thông qua bài tập thực tế.

Những người có ý tưởng về làm web nhưng không biết cách tự làm thế nào.

HỌC VIÊN SAU KHI THAM GIA KHOÁ HỌC SẼ HOÀN TOÀN TỰ TIN: 

Tường tận về các khái niệm và cấu trúc của website liên quan tới frontend

Thấu hiểu và có khả năng thực hiện các tính năng từ căn bản đến nâng cao

Sử dụng thư viện jquery, css3, wordpress, photoshot ra HTML

Biết một số quy tắc và các tips để giúp thực hiện frontend chuyên nghiệp

ĐỂ HOÀN THÀNH KHOÁ HỌC MỘT CÁCH TỐT NHẤT, HỌC VIÊN ĐĂNG KÍ THAM GIA CẦN CÓ:

Phần mềm cần có : chrome . Các phần mềm khác được hướng dẫn cài đặt và đính kèm trong khóa.

Kiến thức frontend cơ bản bootstrap 4, HTML5, CSS3.

HÃY CÙNG XEM CẢM NHẬN CỦA HỌC VIÊN KHI HOÀN THÀNH KHOÁ HỌC NÀY NHÉ: 

Bạn Đỗ Ngọc Linh (ĐH Kĩ thuật quân sự Hồ Chí Minh): Sau khi học được khóa học frontend tôi đã có đầy đủ kiến thức cần thiết để bổ trợ cho công việc của tôi. Cách giảng và phương pháp của Fedu khá phù hợp với tôi.

Bạn Trịnh Công Minh: (Học viện Công nghệ Bưu chính Viễn thông): Trước đây tôi nghĩ vấn đề về lập trình web không thể học online nhưng tôi đã thay đổi khi tham gia khoá học này. Thầy Việt không chỉ có phương pháp giảng dạy gần gũi, dễ hiểu mà còn có bài tập thực tế để áp dụng, chính điều này làm tôi tiếp thu bài học nhanh hơn và vận dụng hiệu quả hơn. 

Bạn Ngô Tuấn Khang (ĐH Kinh doanh công nghệ Hà Nội): Sau khi kết thúc khoá học tôi đã hiểu kĩ và sâu hơn về lĩnh vực lập trình Frontend. Điều này phục vụ rất nhiều cho công việc hàng ngày của tôi. Mong rằng Fedu sẽ ra nhiều khoá học về lập trình bổ ích hơn nữa. 

Hãy tham gia ngay khoá học để trở thành thành viên trên con đường chinh phục lập trình và thiết kế web!

Nội dung khóa học

  Giới thiệu khóa học (05:49)

  Giới thiệu khóa học (1) (13:48)

Bài mở đầu : khởi động

  Thông tin về group support trong quá trình học và phần mềm sử dụng trong khóa

   Nhắc lại thuộc tính CSS3 translate (12:49)

  Thuộc tính CSS3 quay và tâm quay (16:20)

  Thuộc tính CSS3 zoom (08:55)

  Áp dụng thuộc tính CSS3 quay, zoom, origin và transition-Phần 1.mp4 (12:05)

  Áp dụng thuộc tính CSS3 quay, zoom, origin và transition-Phần 2.mp4 (12:05)

  Select 05 - Áp dụng thuộc tính rotateY và Backface để làm hiệu ứng.mp4 (18:58)

  Áp dụng thuộc tinh transition delay (15:45)

Project số 2 : Random project từ themeforest

  Giới thiệu project hiệu ứng và các bước xử lý (08:18)

  Giới thiệu project hiệu ứng và các bước xử lý (1)

  Xử lý CSS cho phần mặt trước (13:19)

  Xử lý CSS cho phần mặt trước (1)

  Xử lý CSS hoàn thiện cho phần hiệu ứng đầu tiên (10:02)

  Xử lý HTML cho phần hiệu ứng TAB (05:37)

  Xử lý CSS cho phần hiệu ứng Tab (12:22)

  Xử lý Jquery cho phần nút (06:28)

  Xử lý Jquery cho phần nội dung (10:23)

  Xử lý Jquery cho phần nội dung (1)

  Xử lý Jquery cho phần nội dung (2)

  Tự tạo hiệu ứng cho phần slide (05:33)

  File thiết kế đính kèm

Project số 3 viết hiệu ứng slide nhanh

  Project số 3 Lựa chọn slide và xử lý HTML (13:49)

  Project số 3 Lựa chọn slide và xử lý HTML (1)

  Xử lý CSS ban đầu cho khối giao diện (11:57)

  Xử lý phần CSS cho khối giao diện (07:40)

  Viết hiệu ứng JQUERY - Xử lý bộ đếm (14:03)

  Hoàn thành hiệu ứng slide ảnh cho sản phẩm (05:13)

  Nâng cấp version cho slide ảnh (05:42)

  Xử lý hiệu ứng Quick View phần HTML (03:15)

  Xử lý hiệu ứng Quick View phần CSS (03:57)

  Xử lý hiệu ứng Quick View phần Jquery (05:10)

  Xử lý hiệu ứng Quick View phần Jquery (1)

  Sử dụng hàm jquery cho thao tác trên bàn phím (03:07)

  Nâng cấp Version 3 cho slide ảnh (09:13)

  Tổng kết các hàm quan hệ trong JQuery (05:00)

  Xử lý số lượng thay đổi bằng hàm quan hệ (04:23)

Project số 4 xử lý hiệu ứng isotope

  Giới thiệu giao diện kiểu Masonry (01:50)

  Tạo giao diện cho gallery - phần HTML (09:17)

  Tạo giao diện cho gallery - Phần CSS (04:30)

  Tạo giao diện cho gallery - Phần Jquery (08:09)

  Xử lý việc load ảnh băng thư viện Image Load (07:39)

  Xử lý responsive (02:52)

  Xử lý lọc dữ liệu theo danh mục - phần HTML (07:06)

  Xử lý hiệu ứng chọn cho nút (06:33)

  Xử lý hiệu ứng lọc dữ liệu theo danh mục khi click vào nút (08:19)

PROJECT 5 THEFOX - Full frontend thực hiện cắt web và làm giao diện responsive

  Xử lý Html cho phần top bằng bootstrap (05:41)

  Xử lý CSS cho phần Top (19:17)

  Xử lý CSS cho màn hình di động (10:21)

  Xử lý HTML cho trang contact (04:30)

  Xử lý CSS cho phần menu (06:36)

  Xử lý CSS cho phần menu hiển thị trên di động (06:09)

  Xử lý HTML cho phần bản đồ (05:57)

  Xử lý CSS cho khối thong tin liên hệ (09:20)

  Xử lý phần hiệu ứng (05:51)

  Xử lý CSS cho phần thông tin liên hệ trên di động (03:14)

  Xử lý phần form liên hệ (09:06)

  Xử lý phần CSS cho Form (09:50)

  Xử lý HTML cho phần footer (04:34)

  Xử lý CSS cho phần footer (06:40)

  Xử lý HTML cho phần lastest news -Phần 1 (06:02)

  Xử lý HTML cho phần lastest news - Phần 2 (16:36)

  Phương pháp sử dụng after và before trong css (09:01)

  Xử lý phần HTML cho khối tag widget (04:00)

  Xử lý phần CSS cho khối TAG WIDGET (06:19)

  Xử lý phần CSS cho khối BLOG CATEGORY (06:10)

  Xử lý phần CSS cho khối BLOG CATEGORY (1) (10:19)

  Xử lý phần HTML cho phần NEWSLETTER (06:37)

  Xử lý phần CSS cho phần NEWSLETTER (10:16)

  Xử lý phần HTML_CSS cho khối BOTTOM FOOTER (08:00)

  Xử lý hiệu ứng load cho trang CONTACT (11:51)

  Xử lý giao diện trang contact cho di động (09:09)

  Xử lý import giao diện cho trang chủ (02:16)

  Xử lý HTML cho khối giới thiệu trang chủ (05:26)

  Xử lý CSS cho khối giới thiệu (10:13)

  Xử lý HTML cho khối slide (10:08)

  Xử lý CSS cho phần news (07:36)

  Xử lý HTML trang tin tức (04:51)

  Xử lý bố cục tin bằng card column (04:50)

  Xử lý CSS cho các cột thông tin (06:40)

  Xử lý CSS và hiệu ứng cho trang tin tức (05:56)

  Xử lý CSS và hiệu ứng cho trang tin tức (1)

  Xử lý CSS và hiệu ứng cho trang tin tức (2)

  Xử lý CSS và hiệu ứng cho trang tin tức (3)

  Xử lý CSS và hiệu ứng cho trang tin tức (4)

  Xử lý CSS và hiệu ứng cho trang tin tức (5)

  Xử lý CSS và hiệu ứng cho trang tin tức (6)

  Xử lý CSS và hiệu ứng cho trang tin tức (7)

  Xử lý CSS và hiệu ứng cho trang tin tức (8)

  Xử lý CSS và hiệu ứng cho trang tin tức (9)

  Xử lý CSS và hiệu ứng cho trang tin tức (10)

  Xử lý CSS và hiệu ứng cho trang tin tức (11)

  Xử lý CSS và hiệu ứng cho trang tin tức (12)

  Xử lý CSS và hiệu ứng cho trang tin tức (13)

  Xử lý CSS và hiệu ứng cho trang tin tức (14)

  Xử lý CSS và hiệu ứng cho trang tin tức (15)

  Xử lý CSS và hiệu ứng cho trang tin tức (16)

  Xử lý CSS và hiệu ứng cho trang tin tức (17)

  Xử lý CSS và hiệu ứng cho trang tin tức (18)

  Xử lý CSS và hiệu ứng cho trang tin tức (19)

  Xử lý CSS và hiệu ứng cho trang tin tức (20)

  Xử lý CSS và hiệu ứng cho trang tin tức (21)

  Xử lý CSS và hiệu ứng cho trang tin tức (22)

  File đính kèm project

  Bài giảng mới

PROJECT ARTICA

  Xử lý HTML cho phần Top Header (08:00)

  Xử lý CSS cho phần Top Header (13:37)

  Xử lý CSS cho Top Header trên màn hình di động (10:17)

  Xử lý HTML cho phần Menu và Logo (05:17)

  Xử lý CSS cho phần Menu và Logo (07:08)

  Xử lý CSS cho phần Menu và Logo trên màn hình đi động (07:19)

  Xử lý phần HTML cho phần slide (06:54)

  Xử lý phần CSS cho phần slide (09:26)

  Xử lý CSS cho phần hiệu ứng slide hiển thị trên di động (07:27)

  Xử lý phần HTML cho khối dịch vụ (05:13)

  Xử lý Css cho khối 3 dịch vụ (09:27)

  Xử lý css cho khối 3 dịch vụ trên màn hình di động (07:57)

  Xử lý html cho khối tiêu đề thực đơn (05:54)

  Xử lý css cho khối tiêu đề menu (12:37)

  Xử lý css cho tiêu đề thực đơn trên di động (03:03)

  Tự viết hiệu ứng lọc cho phần thực đơn (09:20)

  Xử lý phần HTML cho khối thực đơn chi tiết (10:32)

  Xử lý phần CSS cho khối thực đơn chi tiết (17:20)

   Xử lý phần responsive cho khối thực đơn (03:04)

  Xử lý phần hiệu ứng sắp xếp khi thay đổi cỡ màn hình (03:51)

  Xử lý phần hiệu ứng load ảnh và truyền dữ liệu qua thuộc tính data của HTML5 (05:23)

  Xử lý phần hiệu ứng lọc dữ liệu cho thực đơn bằng javascript (05:52)

  Xử lý phần phần tiêu đề chi tiết của khối thực đơn (04:34)

  Xử lý phần HTML cho hiệu ứng slide trượt (07:43)

  Xử lý phần CSS cho carousel - Phần 1 (08:17)

  Xử lý phần CSS cho carousel - Phần 2 (10:48)

  Xử lý responsive cho phần hiệu ứng slide (18:37)

  Xử lý HTML cho phần giới thiệu đầu bếp (06:12)

  Xử lý CSS cho phần giới thiệu đầu bếp (10:30)

  Xử lý css Responsive cho phần giới thiệu đầu bếp (04:23)

  Xử lý khối slogan (06:55)

  Xử lý HTML cho khối đặt bàn - Phần 1 (06:05)

  Xử lý CSS cho khối đặt bàn - Phần 2 (07:22)

  Xử lý hiệu ứng fake loader (12:40)

  Xử lý form cho khối đặt bàn (11:59)

  Xử lý phần HTML cho khối phản hồi người dùng (07:47)

  Xử lý CSS cho phần phản hồi người dùng (05:37)

  Xử lý HTML cho phần Tin tức cập nhật (08:27)

  Xử lý CSS cho phần Tin tức cập nhật (09:23)

  Check giao diện trên màn di động (02:07)

  Xử lý HTML cho phần footer cột 1 (06:35)

  Xử lý css cho phần footer cột 1 (08:40)

  Xử lý HTML cho cột 2 footer (02:28)

  Xử lý CSS cho cột 2 footer (07:34)

  Xử lý css cho phần cột 4 footer (06:28)

  Xử lý footer và check giao diện trên di động (05:56)

  Tạo trang about bằng cách sử dụng lại code (03:38)

  Tạo HTML bằng cách sử dụng lại code (06:07)

  Tạo CSS cho khối thông tin đầu tiên trang about (05:31)

  Tạo khối thông tin thứ 2 bằng cách sử dụng lại code (02:04)

  Tạo khối thông tin thứ 3 trang about (07:39)

  Hoàn chỉnh trang about bằng cách xử dụng lại code (05:12)

   Tạo trang thực đơn trong 5 phút (05:39)

  Hoàn thiện trang thực đơn trong 10 phút (11:45)

  Tạo trang tin tức (03:32)

  Tạo cột trái cho trang tin tức (06:40)

  Xử lý phần tim kiếm cột phải (05:09)

  Xử lý khối danh mục (07:39)

  Hoàn thiện giao diện trang tin tức (12:17)

  Hoàn thiện giao diện trang tin chi tiết (12:17)

  Tạo trang contact phần form (09:29)

  Hoàn thiện trang contact (06:47)

  Tổng kết và đóng gói front end (05:30)

  Xử lý phần css cho khối contact form (06:47)

  File đính kèm

  File đính kèm project

Giảng Viên: Thầy Nguyễn Đức Việt

Giảng viên với 12 năm trong nghề thiết kế, lập trình web. Anh đã và đang giảng dạy, đào tạo cho khoảng hơn 10.000+ học viên thiết kế, lập trình web tại Việt Nam. Tốt nghiệp khoa CNTT, Đại học bách khoa Hà Nội. Từng làm việc trong nhiều dự án lớn thuộc tập đoàn lớn, anh đã và đang tham gia rât nhiều dự án Freelancer về thiết kế đồ họa nên kinh nghiệm thực tế dồi dào, mong muốn đem những kinh nghiệm này chia sẻ cho tất cả mọi người, giúp các bạn có được những hành trang quý báu trên con đường sự nghiệp.

Từng du học nghành thiết kế đồ họa đa phương tiện – tại tập đoàn Aptech Limited – Bangalore Ấn Độ theo chương trình giảng viên tài năng.

Tốt nghiệp khoa CNTT, Đại học bách khoa Hà Nội.

[/chitiet]

Lập trình Frontend nâng cao qua project thực tế