Khóa Học Front-end Web Cơ Bản Và Nâng Cao Với React.js

Làm web front end từ căn bản và chuẩn bị các kiến thức cần thiết trong nghề làm web.

THÔNG TIN CƠ BẢN

HỌC PHÍ
9,000,000₫
~~11,000,000₫~~
SĨ SỐ
6
/ lớp
THỜI LƯỢNG
3
tháng
ĐĂNG KÝ

Khóa học này dành cho ai?

Người mới, chưa từng biết lập trình trước đó.
Đã từng lập trình nhưng muốn đảm bảo kiến thức được hệ thống hoàn chỉnh.
Muốn học lập trình front end 1 cách bài bản.
Muốn được đào tạo các kiến thức dành cho công việc thực tế.
Nhân sự ngoài ngành lập trình muốn thay đổi công việc mới.
Bạn muốn có 1 việc làm liên quan đến web hoặc ngành công nghệ thông tin.
Bạn không tin tưởng các kiến thức rải rác và chắp vá trên mạng.
Muốn được sự hỗ trợ kỹ thuật, kinh nghiệm từ giảng viên kể cả sau khóa học.

Bạn sẽ đạt được những gì?

Tạo các trang web front-end đầy đủ, thực tế bằng công nghệ tiên tiến từ đầu.
Tạo các trang web tĩnh với thuần HTML và CSS.
Sử dụng NodeJS để học JavaScript từ cơ bản.
Kỹ thuật lập trình với JavaScript.
Hiểu được input/output của HTTP Request.
JSON, XML và RESTful.
Tạo trang đích đẹp, tương thích nhiều kích thước màn hình (Responsive).
Triển khai xác thực người dùng.
Hiểu đầy đủ kiến trúc đằng sau ứng dụng React.js và cách ứng dụng.
Phát triển giao diện người dùng với React.js.
Tạo các ứng dụng single-page với React.js (1 trong các frameworks front-end) hiện đại nhất.
Phát triển ứng dụng web hiện đại, phức tạp, đáp ứng và có thể mở rộng với React.js.
Cách thức triển khai dự án front-end React.js, đưa vào ứng dụng.
Tập trung học các kiến thức được sử dụng trong công việc, đáp ứng nhu cầu các công ty.

Chương trình học - gồm 2 phần

Front-end Web Cơ Bản Và Nâng Cao

1
HTML - I - Căn bản
Cài đặt các phần mềm cần thiết: Visual Studio Code & Notepad++.

Mô hình web truyền thống và mô hình front-end, back-end và full-stack developers.

Căn bản về HTML.
- Cấu trúc của 1 file HTML và phần tử trong HTML.
- Các phiên bản HTML và <!DOCTYPE html>.
- Thẻ trong HTML: title, h1... h6, p, span, br.
- Các loại list và table.
- Hiển thị với Unicode trong HTML.
- Thuộc tính của thẻ.
- Thẻ img và a.
  
  Đường dẫn tương đối và đường dẫn tuyệt đối.
- Block và inline.
So sánh các phiên bản trước HTML5 và sau HTML5.

Thực hành dựng trang HTML với HTML4 và HTML5.
3 giờ
2
HTML - II - Nâng cao và HTML5/6
Các tính năng nâng cao.
- HTML Entities: thuận lợi và nhược điểm.
- Sử dụng mã thay thế và một số ký tự đặc biệt thường dùng.
Form và input.
- Form và các phương thức.
- Các loại input cơ bản.
- Submit button.
Các tính năng của HTML5/6.
- Các loại input mới trong HTML5/6.
- Audio và video.
Giới thiệu về frame.
- Giới thiệu và cách sử dụng frame hiệu quả.
- Nhúng youtube clip vào web và ứng dụng quảng cáo.
Thực hành.
3 giờ
3
CSS - I - Căn bản
Giới thiệu CSS?
- CSS là gì?
- Vai trò của CSS trong việc thiết kế website.
- Các mở rộng khác của CSS ngoài website.
- Các phiên bản CSS.
Sử dụng CSS
- External CSS, Internal CSS và Inline CSS
- Selector CSS: id, class, tag name, ...
Sắp xếp các block: left, right.
- Nhắc lại block và inline.
Các thuộc tính cơ bản
- Thuộc tính kích thước.
- Thuộc tính màu sắc.
  
  Mã màu theo hệ thập lục phân và hệ thập phân.
- Thuộc tính font chữ.
- Thuộc tính viền và bo tròn.
  
  Các kỹ thuật tính toán viền và bo tròn.
Thực hành.
3 giờ
4
CSS - II - Nâng cao
CSS nâng cao
- Đơn vị trong CSS.
- Margin và padding (trong và ngoài).
Vị trí các phần tử.
- Tọa độ các phần tử.
- Hệ qui chiếu tương đối và hệ qui chiếu tuyệt đối.
- CSS transformation.
- Tạo hiệu ứng hoạt hình với CSS.
Đa giác với CSS3.

Nâng cao về selector.
- Các mối quan hệ trên dưới và ngang hàng.
3 giờ
5
Trang chi tiết sản phẩm - I - Dựng trang
Giới thiệu các tính năng nâng cao của CSS3.

Thực hành dựng trang sản phẩm:
- Tham khảo trang demo: https://electronics.stdio.vn.
- Giảng viên hỗ trợ học viên phân tích thành phần của trang.
- Tên sản phẩm: STDIO Starter Kit v2
- Đường dẫn: https://electronics.stdio.vn/products/stdio-starter-kit-v2-5
3 giờ
6
Trang chi tiết sản phẩm - II - Xử lý đa màn hình
Giới thiệu về responsive và xử lý hiển thị trang web trên nhiều kích thước màn hình khác nhau.
- Vì sao phải responsive?
- Các phương pháp hỗ trợ xử lý Responsive.
- Lợi ích và nhược điểm khi sử dụng Responsive.
Xử lý responsive.
- @media và override css.
- Thực hành thiết kế responsive cho trang chi tiết sản phẩm.
3 giờ
7
JavaScript - I - Tiếp cận JavaScript
Giới thiệu ngôn ngữ lập trình JavaScript và vai trò JavaScript trong lập trình web.

Nguyên tắc của các ngôn ngữ lập trình hiện đại.

Thuận lợi và nhược điểm của các ngôn ngữ kịch bản như JavaScript.

Giới thiệu NodeJS.
- Giới thiệu NodeJS.
- Cài đặt NodeJS.
- Mối quan hệ giữa JavaScript, trình duyệt web, NodeJS.
- Các ứng dụng khác của NodeJS.
- Chương trình đầu tiên "Hello JavaScript".
- Căn bản 1 dòng code trong JavaScript.
- Thực hành.
Biến trong JavaScript.
- Biến vô hướng: thuận lợi và các bất lợi.
- Thực hành.
Các loại dữ liệu mở rộng.
3 giờ
8
JavaScript - II - Điều kiện và vòng lặp
Cấu trúc điều điều kiện.
- Cấu trúc rẽ nhánh if/else.
- Cấu trúc switch/case.
- Thực hành.
Vòng lặp có điều kiện.
- Vòng lặp while.
- Vòng lặp for.
- Thực hành.
6 giờ
9
JavaScript - III - Hàm và hàm nặc danh
Hàm trong JavaScript.
- Hàm trong ngôn ngữ JavaScript.
- Sử dụng hàm dựng sẵn và hàm đã xây dựng.
- Thực hành.
Truyền hàm vào 1 hàm khác (Higher order functions).
- Cách thức hiện thực và tính ứng dụng.
  
  Giới thiệu về lập trình hàm (Functional programming).
- Thực hành.
Hàm nặc danh, cách khởi tạo và tính ứng dụng.
- Thực hành.
3 giờ
10
JavaScript - IV - Ứng dụng vào lập trình web
Ứng dụng JavaScript vào lập trình web.
- Mối quan hệ giữa HTML và JavaScript.
- Khai báo hàm JavaScript.
  
  Internal JavaScript và External JavaScript.
- 1 số hàm tiện ích trong JavaScript với trình duyệt web.
Mô hình DOM.
- Giới thiệu về mô hình DOM.
- Truy cập các phần tử của HTML thông qua JavaScript thông qua tag, id và class.
- Nhận và gán giá trị từ 1 phần tử.
  
  Thuộc tính và nội dung.
  
  Xử lý logic.
Thực hành.
3 giờ
11
Xử lý sự kiện với JavaScript
Mô hình sự kiện và các sự kiện.

Xử lý sự kiện trên các phần tử.
- Sự kiện tự gọi.
- Sự kiện từ người dùng.
Sự kiện chuột.
- Xử lý các sự kiện từ chuột.
Sự kiện từ bàn phím.
- Mã ASCII và bàn phím.
- Sự kiện và mã phím.
3 giờ
12
Định dạng trao đổi dữ liệu - XML và JSON
Giới thiệu về định dạng trao đổi dữ liệu.

Nhắc lại kiểu dữ liệu Object (trong JavaScript) và Class (OOP).

Làm quen với cấu trúc JSON.
- Định nghĩa JSON
- Hướng dẫn sử dụng JSON trong JavaScript.
Thực hành.
3 giờ
13
Mô hình Front-end vs Back-end
Mô hình Front-end vs Back-end.
1. Mô hình Front-end vs Back-end.
2. HTTP Request và tham số.
3. Webservice.
  
  Request và Response.
  
  REST API.
JSON và chuẩn giao tiếp.
1. Kiến trúc của JSON.
2. Ứng dụng vào giao tiếp Front-end vs Back-end.
Demo và ứng dụng.
3 giờ

Xây Dựng Front-end Nâng Cao Với Nền Tảng React.js

14
Node Package Module - npm
Làm việc với Node Package Module - npm
- Giới thiệu package.
- Node module.
- Các lệnh npm quan trọng.
- File package.json.
Sử dụng các module thông dụng.
3 giờ
15
Giới thiệu và cài đặt React Native
Giới thiệu về front end.
- Front end là gì?
- Front end với web, iOS, Android.
Giới thiệu ứng dụng đa nền tảng.
- Android với Java/Kotlin - iOS với Objective-C/Swift.
- React Native và các nền tảng khác.
Hello React Native.
- Cài đặt React Native và Android Studio.
- Tạo dự án React Native và triển khai trên thiết bị điện thoại.
Cấu trúc dự án React Native.
- Tư duy Component - Component là gì?
- Thực hành tạo và sử dụng Component.
Life cycle của ứng dụng React Native.

Giới thiệu project mẫu trong khóa học.
3 giờ
16
Thiết kế giao diện người dùng - Component
Thiết kế giao diện người dùng
- Nhắc lại Component (và HTML).
- Sử dụng các Component căn bản.
- Debug trong React Native.
- Tạo custom Component và sử dụng.
Thực hành hiện thực các Component cần thiết cho project mẫu.
6 giờ
17
Thiết kế giao diện người dùng - Style
Thiết kế giao diện người dùng
- Nhắc lại CSS (web HTML).
- Giới thiệu Style trong React Native.
- Ứng dụng Style vào React Native.
Thực hành sử dụng Style vào project mẫu.
6 giờ
18
Quyền ứng dụng
Cấp quyền cho ứng dụng từ phía người dùng.
- Ý nghĩa và tổng quan.
- 1 số quyền thường dùng.
Thực hành tích hợp thêm tính năng đòi hỏi cấp quyền từ người dùng.
3 giờ
20

Hiện thực web front-end - I

Hiện thực các tính năng front-end theo hướng dẫn.

3 giờ
21

Hiện thực web front-end - II

Gắn các thành phần giao tiếp back-end và front-end.

3 giờ

Lịch khai giảng

Không tìm được giờ học phù hợp?
Gọi 028.36205514 hoặc Inbox.

Xem thêm các chính sách
ƯU ĐÃI VÀ KHUYẾN MÃI HỌC PHÍ

Bạn đang có nhu cầu vui lòng gọi

0942.111.912
028.36205514

MESSENGER

Lập Trình Web Front-end Là Gì?

Nghề lập trình Web Front-end chưa bao giờ mất "hot", vẫn phát triển mạnh và là nhu cầu của nhiều doanh nghiệp. Vậy lập trình web front end là gì? Cần học những gì để có thể phát triển ngành nghề này?

Xem thêm

10 Thứ Bạn Có Thể Làm Với JavaScript

Định luật Atwood khẳng định rằng "Bất cứ app nào có thể viết bằng JavaScript thì đều sẽ viết bằng JavaScript" và câu thần chú này đã luôn tồn tại và không hề thay đổi qua năm tháng.

Xem thêm