Ưu đãi trong tuần: Nhập mã UD50 giảm 50k cho đơn từ 300k!
Trang chủ
Menu

The Complete Angular Course: Beginner to Advanced

Khóa học Angular toàn diện: Từ cơ bản đến nâng cao

Khóa học Angular toàn diện: Từ cơ bản đến nâng cao

Khóa học Angular 4 (Angular 2+) đầy đủ nhất. Xây dựng ứng dụng thương mại điện tử thực tế với Angular, Firebase và Bootstrap 4

4.5
(28,067 đánh giá)
119,533 học viên
Giảng viên
Mosh Hamedani
Phụ đề Việt chất lượng cao Phụ đề tiếng Anh Bán chạy Đánh giá cao
50.000đ 2.159.000đ -98%
✓ Xem giỏ hàng và thanh toán
Bao gồm phụ đề tiếng Việt, tiếng Anh
29.5 giờ video
376 bài giảng
1 bài quiz
Truy cập vĩnh viễn
Học trên mọi thiết bị
Cập nhật: 28/04/2026

Bạn sẽ học được gì

Khẳng định vị thế của bạn với tư cách là một lập trình viên chuyên nghiệp lành nghề
Tự mình xây dựng các ứng dụng Angular trong thế giới thực
Xử lý các lỗi Angular thường gặp
Nắm vững các phương pháp thực hành tốt nhất
Viết code sạch sẽ và thanh lịch như một lập trình viên chuyên nghiệp

Yêu cầu

Quen thuộc cơ bản với HTML, CSS và JavaScript
KHÔNG yêu cầu kiến thức về Angular 1 hoặc Angular 2

Đối tượng phù hợp

Dành cho các lập trình viên muốn nâng cấp kỹ năng và có cơ hội việc làm tốt hơn
Lập trình viên Front-end muốn cập nhật công nghệ mới nhất
Lập trình viên Back-end muốn học phát triển Front-end và trở thành lập trình viên Full-stack
Những nhà phát triển nghiệp dư đam mê làm việc với các framework mới

Nội dung khóa học

25 phần • 376 bài giảng
1 Giới thiệu
2 Angular là gì
3 Kiến trúc của Ứng dụng Angular
4 Thiết lập Môi trường Phát triển
5 Ứng dụng Angular đầu tiên của bạn
6 Cấu trúc của Dự án Angular
7 Webpack
8 Lịch sử Phiên bản Angular
9 Cấu trúc Khóa học
10 Lời hứa từ khóa học
11 Đặt câu hỏi
1 Giới thiệu
2 TypeScript là gì?
3 Chương trình TypeScript đầu tiên của bạn
4 Khai báo Biến
5 Các Kiểu dữ liệu
6 Ép kiểu (Type Assertions)
7 Hàm Mũi tên (Arrow Functions)
8 Giao diện (Interfaces)
9 Lớp (Classes)
10 Đối tượng (Objects)
11 Hàm tạo (Constructors)
12 Các Bổ từ Truy cập (Access Modifiers)
13 Bổ từ Truy cập trong Tham số Hàm tạo
14 Thuộc tính (Properties)
15 Mô-đun (Modules)
16 Bài tập
17 Lời giải
18 Một vấn đề với cách triển khai hiện tại
1 Giới thiệu
2 Các khối xây dựng của Ứng dụng Angular
3 Thành phần (Components)
4 Tạo Thành phần bằng Angular CLI
5 Bản mẫu (Templates)
6 Chỉ thị (Directives)
7 Dịch vụ (Services)
8 Tiêm phụ thuộc (Dependency Injection)
9 Tạo Dịch vụ bằng Angular CLI
1 Giới thiệu
2 Ràng buộc Thuộc tính (Property Binding)
3 Ràng buộc Thuộc tính HTML (Attribute Binding)
4 Thêm Bootstrap
5 Ràng buộc Lớp (Class Binding)
6 Ràng buộc Kiểu (Style Binding)
7 Ràng buộc Sự kiện (Event Binding)
8 Lọc Sự kiện (Event Filtering)
9 Biến Bản mẫu (Template Variables)
10 Ràng buộc Hai chiều (Two-way Binding)
11 Bộ lọc (Pipes)
12 Bộ lọc Tùy chỉnh (Custom Pipes)
1 Giới thiệu
2 Giao diện Thành phần (Component API)
3 Thuộc tính Đầu vào (Input Properties)
4 Đặt bí danh cho Thuộc tính Đầu vào
5 Thuộc tính Đầu ra (Output Properties)
6 Truyền Dữ liệu Sự kiện
7 Đặt bí danh cho Thuộc tính Đầu ra
8 Bản mẫu (Templates)
9 Kiểu (Styles)
10 Đóng gói Giao diện (View Encapsulation)
11 ngContent
12 ngContainer
1 Giới thiệu
2 ngIf
3 Thuộc tính Ẩn (Hidden Property)
4 ngSwitchCase
5 ngFor
6 ngFor và Cơ chế Phát hiện Thay đổi
7 ngFor và Trackby
8 Dấu hoa thị Đầu dòng (The Leading Asterisk)
9 ngClass
10 ngStyle
11 Toán tử Truy cập An toàn (Safe Traversal Operator)
12 Tạo Chỉ thị Tùy chỉnh
1 Giới thiệu
2 Xây dựng Biểu mẫu Bootstrap
3 Các Loại Biểu mẫu
4 ngModel
5 Thêm Xác thực (Validation)
6 Các Lỗi Xác thực Cụ thể
7 Tạo Kiểu cho Trường Nhập liệu Không hợp lệ
8 Làm sạch Bản mẫu
9 ngForm
10 ngModelGroup
11 Lớp và Chỉ thị Điều khiển
12 Vô hiệu hóa Nút Gửi
13 Làm việc với Hộp kiểm (Check Boxes)
14 Làm việc với Danh sách Thả xuống (Drop-down Lists)
15 Làm việc với Nút Radio (Radio Buttons)
1 Giới thiệu
2 Xây dựng Biểu mẫu Bootstrap
3 Tạo Điều khiển Theo chương trình
4 Thêm Xác thực
5 Các Lỗi Xác thực Cụ thể
6 Triển khai Xác thực Tùy chỉnh
7 Các Thao tác Bất đồng bộ
8 Trình xác thực Bất đồng bộ
9 Hiển thị Ảnh Biểu tượng Tải
10 Xác thực Đầu vào Biểu mẫu khi Gửi
11 FormGroup Lồng nhau
12 FormArray
13 FormBuilder
14 Tóm tắt Nhanh
1 Giới thiệu
2 JSONPlaceHolder
3 Lấy Dữ liệu
4 Tạo Dữ liệu
5 Cập nhật Dữ liệu
6 Xóa Dữ liệu
7 Giao diện OnInit
8 Tách biệt Mối quan tâm (Separation of Concerns)
9 Trích xuất một Dịch vụ
10 Xử lý Lỗi
11 Xử lý Lỗi Không mong đợi
12 Xử lý Lỗi Mong đợi
13 Đưa ra Lỗi Cụ thể của Ứng dụng
14 Xử lý Lỗi Yêu cầu Không hợp lệ
15 Nhập Toán tử Quan sát và Phương thức Nhà máy
16 Xử lý Lỗi Toàn cục
17 Trích xuất Phương thức Xử lý Lỗi Có thể Tái sử dụng
18 Trích xuất Dịch vụ Dữ liệu Có thể Tái sử dụng
19 Toán tử Bản đồ (Map Operator)
20 Cập nhật Lạc quan so với Bi quan
21 Quan sát (Observables) so với Lời hứa (Promises)
1 Giới thiệu
2 Tổng quan về Định tuyến
3 Cấu hình Tuyến đường (Routes)
4 RouterOutlet
5 RouterLink
6 RouterLinkActive
7 Lấy Tham số Tuyến đường
8 Tại sao Tham số Tuyến đường là Quan sát được (Observables)
9 Tuyến đường với Nhiều Tham số
10 Tham số Truy vấn (Query Parameters)
11 Đăng ký Nhiều Quan sát
12 Toán tử SwitchMap
13 Điều hướng Theo chương trình
1 Giới thiệu
2 Tổng quan Ứng dụng
3 Kiến trúc
4 Mã thông báo Web JSON (JSON Web Tokens)
5 Mã Khởi đầu (Starter Code)
6 Triển khai Đăng nhập
7 Triển khai Đăng xuất
8 Hiển thị hoặc Ẩn Các phần tử
9 Hiển thị hoặc Ẩn Các phần tử dựa trên Vai trò Người dùng
10 Lấy Người dùng Hiện tại
11 Giao diện CanActivate
12 Chuyển hướng Người dùng Sau khi Đăng nhập
13 Bảo vệ Tuyến đường dựa trên Vai trò Người dùng
14 Truy cập Tài nguyên API được Bảo vệ
15 Tóm tắt Nhanh
1 Giới thiệu
2 Chuẩn bị cho Triển khai
3 Biên dịch JIT so với AOT
4 Trình biên dịch Angular hoạt động
5 Xây dựng Ứng dụng với Angular CLI
6 Môi trường (Environments)
7 Thêm Môi trường Tùy chỉnh
8 Kiểm tra Lỗi với Angular CLI (Linting)
9 Kiểm tra Lỗi trong VSCode
10 Các Tùy chọn Triển khai Khác
11 Triển khai lên GitHub Pages
12 Triển khai lên Firebase
13 Heroku
14 Triển khai lên Heroku
15 Động cơ (Engines)
16 Bài tập
1 Giới thiệu
2 Firebase là gì?
3 Dự án Firebase đầu tiên của bạn
4 Làm việc với Cơ sở dữ liệu Firebase
5 Cài đặt Firebase
6 Đọc Danh sách
7 Cơ sở dữ liệu thời gian thực
8 Observables và rò rỉ bộ nhớ
9 Hủy đăng ký Subscriptions
10 Async Pipe
11 Đọc một đối tượng
12 Từ khóa As
13 Thêm một đối tượng
14 Cập nhật đối tượng
15 Xóa đối tượng
16 Tài nguyên bổ sung
1 Giới thiệu
2 Ví dụ về hoạt ảnh
3 Các cách tạo hoạt ảnh khác nhau
4 Hoạt ảnh trong Angular
5 Nhập mô-đun Animations và Polyfills
6 Triển khai hoạt ảnh hiện dần (Fade-in)
7 Triển khai hoạt ảnh biến mất (Fade-out)
8 Trạng thái (States)
9 Chuyển tiếp (Transitions)
10 Thuộc tính có thể tạo hoạt ảnh
11 Tạo trình kích hoạt tái sử dụng
12 Hiệu ứng làm mượt (Easings)
13 Khung hình chính (Keyframes)
14 Tạo hoạt ảnh tái sử dụng với animation()
15 Tham số hóa hoạt ảnh tái sử dụng
16 Hàm gọi lại trong hoạt ảnh
17 Truy vấn phần tử con với query()
18 Tạo hoạt ảnh cho phần tử con với animateChild()
19 Chạy hoạt ảnh song song với group()
20 Hoạt ảnh so le với stagger()
21 Làm việc với trạng thái tùy chỉnh
22 Hoạt ảnh nhiều bước
23 Tách biệt mối quan tâm
1 Giới thiệu
2 Angular Material là gì
3 Cài đặt Angular Material
4 Hộp kiểm (Checkboxes)
5 Nút chọn (Radio Buttons)
6 Hộp chọn (Selects)
7 Trường nhập liệu (Inputs)
8 Vùng văn bản (Text Areas)
9 Bộ chọn ngày (Date Pickers)
10 Biểu tượng (Icons)
11 Nút bấm (Buttons)
12 Thẻ nhãn (Chips)
13 Vòng quay tiến trình (Progress Spinners)
14 Chú giải công cụ (Tooltips)
15 Thẻ (Tabs)
16 Hộp thoại (Dialogs)
17 Truyền dữ liệu vào hộp thoại
18 Các thành phần khác
19 Tạo mô-đun tái sử dụng
20 Chủ đề (Themes)
21 SASS
22 Tạo chủ đề tùy chỉnh
23 Sử dụng kiểu chữ của Angular Material
24 Tùy chỉnh kiểu chữ
25 Lưu ý quan trọng
1 Giới thiệu
2 Redux là gì
3 Các khối xây dựng của Redux
4 Hàm thuần túy (Pure Functions)
5 Cài đặt Redux
6 Làm việc với Actions
7 Decorator Select
8 Tránh đột biến trạng thái
9 Sử dụng Immutable.js
10 Bài tập
11 Redux DevTools
12 Gọi API backend
13 Tái cấu trúc câu lệnh case phức tạp
14 Xử lý miền phức tạp
1 Giới thiệu
2 Kiểm thử tự động là gì?
3 Các loại kiểm thử
4 Nguyên lý kiểm thử đơn vị
5 Làm việc với chuỗi và mảng
6 Thiết lập và dọn dẹp
7 Làm việc với biểu mẫu
8 Làm việc với Event Emitters
9 Làm việc với Spies
10 Kiểm thử tương tác
11 Làm việc với hộp xác nhận
12 Hạn chế của kiểm thử đơn vị
13 Độ bao phủ mã nguồn
14 Bài tập
1 Giới thiệu
2 Thiết lập
3 Tạo mã thiết lập
4 Kiểm tra ràng buộc thuộc tính
5 Kiểm tra ràng buộc sự kiện
6 Cung cấp phụ thuộc
7 Lấy các phụ thuộc
8 Cung cấp Stubs
9 Kiểm tra điều hướng
10 Xử lý tham số tuyến đường
11 Kiểm tra thành phần RouterOutlet
12 Kiểm tra thành phần nông (Shallow)
13 Kiểm tra chỉ thị thuộc tính
14 Xử lý thao tác bất đồng bộ
1 Giới thiệu
2 Thử thách
3 Truy cập mã nguồn
4 Tạo dự án mới
5 Cài đặt Bootstrap 4
6 Tách thành phần NavBar
7 Định nghĩa các tuyến đường
8 Thêm menu thả xuống
9 Dọn dẹp NavBar
10 Sửa một số vấn đề nhỏ
11 Triển khai
1 Giới thiệu
2 Triển khai đăng nhập Google
3 Triển khai đăng xuất
4 Hiển thị người dùng hiện tại
5 Sử dụng Async Pipe
6 Tách một dịch vụ
7 Bảo vệ các tuyến đường
8 Chuyển hướng sau khi đăng nhập
9 Lưu trữ người dùng trong Firebase
10 Định nghĩa quản trị viên
11 Bảo vệ tuyến đường quản trị
12 Hiển thị hoặc ẩn liên kết quản trị
13 Sửa lỗi
1 Giới thiệu
2 Xây dựng biểu mẫu Bootstrap
3 Điền danh sách thả xuống danh mục
4 Lưu sản phẩm vào Firebase
5 Triển khai xác thực
6 Thêm xác thực tùy chỉnh
7 Thêm thẻ Bootstrap
8 Hiển thị danh sách sản phẩm
9 Chỉnh sửa sản phẩm
10 Cập nhật sản phẩm
11 Xóa sản phẩm
12 Tìm kiếm sản phẩm
13 Tách một giao diện
14 Thêm thành phần bảng dữ liệu
15 Cấu hình bảng dữ liệu
16 Cung cấp dữ liệu cho bảng
17 Lọc với bảng dữ liệu
18 Sửa lỗi chuyển hướng người dùng
19 Dọn dẹp biểu mẫu sản phẩm
1 Giới thiệu
2 Hiển thị tất cả sản phẩm
3 Hiển thị danh mục
4 Lọc sản phẩm theo danh mục
5 Xử lý nhiều thao tác bất đồng bộ
6 Tái cấu trúc: Tách ProductFilterComponent
7 Tái cấu trúc: Tách ProductCardComponent
8 Cải thiện thẻ sản phẩm
9 Cố định danh mục
10 Tổng kết
1 Giới thiệu
2 Tạo giỏ hàng
3 Tái cấu trúc: Chuyển trách nhiệm sang dịch vụ
4 Thêm sản phẩm vào giỏ hàng
5 Tái cấu trúc phương thức addToCart
6 Hiển thị số lượng
7 Cải thiện chân thẻ
8 Triển khai nút thay đổi số lượng
9 Hiển thị số lượng mục trong giỏ hàng trên NavBar
10 Tái cấu trúc: Tạo mô hình phong phú
11 Xây dựng trang giỏ hàng
12 Sửa vấn đề thiết kế
13 Hiển thị tổng giá
14 Tái cấu trúc: Tách ProductQuantityComponent
15 Phát hiện vấn đề thiết kế
16 Làm phẳng đối tượng mục giỏ hàng
17 Khởi tạo đối tượng tốt hơn
18 Xóa giỏ hàng
19 Sửa lỗi cập nhật số lượng
20 Cải thiện bố cục
21 Thêm hình thu nhỏ
22 Tái cấu trúc thêm
1 Giới thiệu
2 Thêm nút thanh toán
3 Xây dựng biểu mẫu vận chuyển
4 Lưu đơn hàng vào Firebase
5 Liên kết đơn hàng với người dùng hiện tại
6 Tái cấu trúc: Tách mô hình Order
7 Chuyển hướng người dùng đến trang thành công
8 Xóa giỏ hàng
9 Giao dịch
10 Thêm tiện ích tóm tắt đơn hàng
11 Tái cấu trúc: Tách ShippingFormComponent
12 Hiển thị đơn hàng
13 Sửa lỗi
14 Còn xử lý thanh toán thì sao?
1 Giới thiệu
2 Các Module
3 Các Plugin TypeScript Thiết yếu
4 Di chuyển Tệp và Thư mục
5 Tạo Module Dùng chung
6 Tạo Module Quản trị
7 Tạo Module Mua sắm
8 Tạo Module Lõi
9 Nhập và Xuất các Module
10 Thêm Biểu tượng
11 Căn chỉnh các Mục trên Thanh Điều hướng
12 Định nghĩa Giao diện
13 Phần Thưởng Thêm

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


Angular is one of the most popular frameworks for building client apps with HTML, CSS and TypeScript. If you want to establish yourself as a front-end or a full-stack developer, you need to learn Angular.


If you've been confused or frustrated jumping from one Angular 4 tutorial to another, you've come to the right place. In this course, Mosh, author of several best-selling courses on Udemy, takes you on a fun and pragmatic journey to master Angular 4. 


By the end of watching this course, you'll be able to: 

  • Build real client apps with Angular on your own 
  • Troubleshoot common compile-time and run-time errors
  • Write clean and maintainable code like a professional
  • Apply best practices when building Angular apps 



Right from the beginning, you'll jump in and build your first Angular app within minutes. Say goodbye to boring tutorials and courses with rambling instructors and useless theories! 


Angular 2+ has been written in TypeScript. So, in section 2, you'll learn the fundamentals of TypeScript and object-oriented programming to better understand and appreciate this powerful framework. 


Over the next 8 hours, you'll learn the essentials of building client apps with Angular: 

  • Displaying data and handling events
  • Building re-usable components
  • Manipulating the DOM using directives 
  • Formatting data using pipes
  • Building template-driven and reactive forms 
  • Consuming HTTP services 
  • Handling HTTP errors properly 
  • Using Reactive Extensions and observables 
  • Adding routing and navigation
  • Implementing authentication and authorization using JSON Web Tokens (JWT) 
  • Deploying your applications to GitHub Pages, Firebase and Heroku


So, if you're a busy developer with limited time and want to quickly learn how to build and deploy client apps with Angular, you can stop here. 


If you're more adventurous and want to learn more, there is far more content for you! Over the following sections, you'll learn about more advanced topics: 

  • Building real-time, server-less apps with Firebase 
  • Animating DOM elements using Angular animations
  • Building beautiful UIs using Angular Material
  • Implementing the Redux architecture 
  • Writing unit and integration tests 


All that covers just over 21 hours of high-quality content. This is equivalent to a book with more than a thousand pages! But the kind of book that every line is worth reading, not a book that you want to skim! If you have taken any of Mosh's courses before, you know he is very clear and concise in his teaching and doesn't waste a single minute of your precious time!


Finally, at the end of the course, you'll build and deploy a real-time e-commerce application with Angular 4, Firebase 4 and Bootstrap 4. This application exhibits patterns that you see in a lot of real-world applications:

  • Master/detail
  • CRUD operations
  • Forms with custom validation
  • Searching, sorting and pagination
  • Authentication and authorization 
  • And a lot more! 


You'll see how Mosh creates a brand new Angular project with Angular CLI and builds this application from A to Z, step-by-step. No copy/pasting! These 8.5 hours are packed with tips that you can only learn from a seasoned developer. 


You'll learn how to apply best practices, refactor your code and produce high quality code like a professional developer. You'll learn about Mosh's design decisions along the way and why he chooses a certain approach. What he shares with you comes from his 17 years of experience as a professional software developer. 


You're not going to get this information in other Angular courses out there! 



And on top of all these, you'll get: 

  • Closed-captions generated by a human, not a computer! Currently only the first few sections have closed-captions but new captions are being added every week. 
  • Offline access: if you are traveling or have a slow connection, you can download the videos and watch them offline.
  • Downloadable source code



PREREQUISITES

You don't need familiarity with TypeScript or any previous versions of Angular. You're going to learn both TypeScript and Angular from scratch in this course.



WHAT OTHER STUDENTS WHO HAVE TAKEN THIS COURSE SAY:

"Absolutely amazing Angular course. Mosh not only introduces key concepts behind Angular, but also pays attention to coding style and good practices. Additionally, course is contstantly enhanced and updated. Also, student questions are answered by Tim - Mosh's teaching assistant. Awesome!" -Calvis


"I am amazed of how dedicated you are in providing updates and more contents to this course. This kind of value is what define a great course and made me feel that the money is well spent. Keep it up! Furthermore, lessons are arranged and planned really carefully. This made the learning experience more seamless and exciting. Thanks Mosh!" -Rashid Razak


"This is another excellent course from the wonderful author Mosh. Thank you Mosh for your awesome course on Angular. Inspite of being a Pluralsight subscriber for the last 3 years, I have subscribed 10 out of 16 courses so far Mosh has produced in Udemy. Also I have viewed 3 of his courses in Pluralsight. That is how I got introduced to this brilliant author. This speaks about the quality of his content. Once again Thank you Mosh for all your efforts. Hope to see a Design Patterns course from you soon." -Dhanasekar Murugesan


"Fantastic course, well laid out, good speed, and explains the why behind everything he does, shedding light on what's under the hood. Also, Mosh has a very practical and elegant coding style worth emulating." -Mack O'Meara


"This is the second course I've taken with Mosh as the instructor and I've signed up for another. The quality of the audio, video, and content shows Mosh invests his time and money to create great and valuable videos. The material is relevant, up-to-date, and provides the student with the ability to succeed in the subject matter (in this case Angular). My expectations were exceeded again. I'll be taking more courses with Mosh!" -John




30-DAY FULL MONEY-BACK GUARANTEE

This course comes with a 30-day full money-back guarantee. Take the course, watch every lecture, and do the exercises, and if you are not happy for any reasons, contact Udemy for a full refund within the first 30 days of your enrolment. All your money back, no questions asked.



ABOUT YOUR INSTRUCTOR

Mosh (Moshfegh) Hamedani is a software engineer with 17 years of professional experience. He is the author of several best selling Udemy courses with more than 120,000 students in 192 countries. He has a Master of Science in Network Systems and Bachelor of Science in Software Engineering. His students describe him as passionate, pragmatic and motivational in his teaching.



So, what are you waiting for? Don't waste your time jumping from one tutorial to another. Enroll in the course and you'll build your first Angular app in less than 10 minutes!



Khóa học liên quan

Khám phá thêm các khoá học cùng chủ đề

Hiển thị tất cả khoá học Angular
Hiển thị tất cả khoá học Frontend Development
Hiển thị tất cả khoá học Typescript
Hiển thị tất cả khoá học Web Development
Zalo
Tôi có thể tư vấn khoá học cho bạn 😊