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

Mastering Angular + Ang 17 - 18 + Interview + E-commerce App

Thành thạo Angular + Ang 17 - 18 + Phỏng vấn + Ứng dụng Thương mại điện tử

Thành thạo Angular + Ang 17 - 18 + Phỏng vấn + Ứng dụng Thương mại điện tử

Xây dựng, Triển khai & Sẵn sàng Ứng tuyển với Kỹ năng Ứng dụng Thực tế & Câu hỏi Phỏng vấn + Bài tập, Angular 17

4.6
(725 đánh giá)
4,093 học viên
Giảng viên
Nirmal Joshi
Phụ đề Việt chất lượng cao Phụ đề tiếng Anh Bán chạy Đánh giá cao
50.000đ 349.000đ -86%
✓ Xem giỏ hàng và thanh toán
Bao gồm phụ đề tiếng Việt, tiếng Anh
21.0 giờ video
306 bài giảng
Truy cập vĩnh viễn
Học trên mọi thiết bị
Cập nhật: 30/05/2026

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

Nắm vững kiến trúc Angular và ứng dụng thực tế.
Phát triển ứng dụng web phức tạp, có khả năng mở rộng với Angular.
Tạo ứng dụng một trang (SPA) đáp ứng trên mọi thiết bị.
Thành thạo data binding để tạo trải nghiệm người dùng động.
Tạo điều kiện giao tiếp liền mạch giữa các component.
Thực hành triển khai dự án eStore.
Xây dựng nền tảng vững chắc cho vị trí lập trình viên frontend.
Tổ chức và cấu trúc mã Angular hiệu quả.

Yêu cầu

Có kiến thức cơ bản về HTML và CSS, nhưng không bắt buộc!
Thời gian, sự tập trung và tâm huyết để học & thực hành.

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

Dành cho bất kỳ ai muốn học Angular - framework hàng đầu trong phát triển front-end.
Lập trình viên cấp junior & mid muốn nâng cao tối đa kỹ năng Angular!
Lập trình viên chuyên nghiệp muốn nâng cấp kỹ năng phát triển Angular hiện có.

Nội dung khóa học

23 phần • 306 bài giảng
1 Giới thiệu
2 Angular CLI
3 Hiểu Cấu trúc Dự án
4 NG17-Giới thiệu về Angular 17
5 Bắt đầu với Angular 17
6 Di chuyển lên Angular 17
1 Component Đầu tiên với Kiến trúc
2 Hiển thị Thông điệp Động
3 Bài tập (Hiển thị tổng hai giá trị)
4 Hiểu về @NgModule
5 NG17-Bootstrapping & Sử dụng Standalone
6 Property Binding
7 Bài tập (Property binding với thẻ image)
8 Event Binding với Sự kiện Click
9 Binding Các Sự kiện Liên quan đến Chuột khác
10 Binding Sự kiện Bàn phím
11 Đối tượng $event
12 Bài tập (Kiểm tra trạng thái phím Shift)
13 Two Way Binding (ngModel)
14 Bài tập (Two-way Binding) - Lấy giá trị trường input khi nhấn nút
15 Bài tập (Tạo ví dụ bộ đếm)
16 Danh sách Câu hỏi & Bài tập
1 Angular CLI
2 Hiểu Cấu trúc Dự án
3 Component Đầu tiên với Kiến trúc
4 RQ-Component Đầu tiên với Kiến trúc
5 Hiển thị thông điệp động (Interpolation)
6 RQ-Hiển thị thông điệp động (Interpolation)
7 Bài tập - Hiển thị tổng hai giá trị
8 Property binding
9 RQ-Property binding
10 Bài tập - Property binding với thẻ image
11 Event binding với sự kiện click
12 RQ-Event binding với sự kiện click
13 Bài tập - Tạo Ví dụ Bộ đếm
14 Binding các sự kiện liên quan đến chuột khác
15 Binding sự kiện bàn phím
16 Đối tượng $event
17 RQ - Đối tượng $event
18 Bài tập - Kiểm tra trạng thái phím Shift
19 Bài tập - Dùng Keydown để tăng/giảm bộ đếm
20 Two way binding (ngModel)
21 RQ - Two way binding (ngModel)
22 Bài tập (Two-way Binding) - Lấy giá trị trường input khi nhấn nút
23 Bài tập - Tính toán Giỏ hàng Đơn giản - Two way binding
1 Giới thiệu về Directives
2 Structural Directives (*ngIf)
3 Bài tập - Triển khai chức năng hiển thị & ẩn với *ngIf
4 NG17-Câu lệnh Control Flow (@if & @else)
5 Structural Directives (*ngFor)
6 Bài tập - Hiển thị danh sách khi nhấn nút bằng *ngIf và *ngFor
7 NG17-Câu lệnh Control Flow @for loop
8 Structural Directives (*ngSwitch)
9 Bài tập - Triển khai chức năng xác thực tuổi bằng *ngSwitch
10 Attribute Directives [ngClass]
11 NG17-Câu lệnh Control Flow (@switch)
12 Bài tập - ngClass
13 Attribute Directives - [ngStyle]
14 Bài tập - Thay đổi màu trường input bằng [ngStyle]
15 Nhóm các phần tử với ng-container
16 HTML templates với ng-template
17 So sánh
18 Bài tập - Hiển thị thông báo nếu trường input để trống
19 Render templates với ngTemplateOutlet - Phần 1
20 Render templates với ngTemplateOutlet - Phần 2
21 Bài tập - Xây dựng Portfolio (Giai đoạn 1) - HTML
22 Bài tập - Xây dựng Portfolio (Giai đoạn 2) - CSS
23 Bài tập - Xây dựng Portfolio (Giai đoạn 3) - Binding
24 Danh sách Câu hỏi & Bài tập
1 Giới thiệu
2 Component Creation Hook - ngOnChanges()
3 Hiểu về Đối tượng SimpleChanges
4 Component Creation Hook - ngOnInIt()
5 Phát hiện Thay đổi Tùy chỉnh với hook ngDoCheck()
6 Hiểu về hook ngAfterContentInit()
7 Kiểm tra Nội dung với hook ngAfterContentChecked()
8 Tải Nội dung với hook ngAfterViewInit()
9 Kiểm tra Component View với hook ngAfterViewChecked()
10 Hủy Component với hook ngDestroy()
11 Danh sách Câu hỏi & Bài tập
1 Giới thiệu về Decorators
2 Class Decorators - @NgModule
3 Class Decorators - @Component
4 Property Decorators - @Input
5 Bài tập @Input Decorator
6 Property Decorators - @Output
7 Bài tập - Triển khai chia sẻ dữ liệu parent-child bằng @Input & @Output
8 Property Decorators - Truy cập Child Components với @ViewChild
9 Property Decorators - Truy cập Nội dung Được Chiếu với @ContentChild
10 Property Decorators - Binding Properties với @HostBinding
11 Method Decorators - Binding events với @HostListener
12 Bài tập - Triển khai bộ chọn màu
13 Parameter Decorators
14 Danh sách Câu hỏi & Bài tập
1 Pipes - Giới thiệu
2 Bài tập - Triển khai các built-in pipes
3 Hiểu về Slice Pipe
4 Bài tập - Điều hướng trang bằng slice pipe (Phần 1)
5 Bài tập - Điều hướng trang bằng slice pipe (Phần 2)
6 Hiểu về Number pipe
7 Bài tập - Chuyển đổi Pound(lbs) sang Kg bằng Number Pipe
8 Hiểu về JSON Pipe
9 Bài tập - Hiển thị Dữ liệu Bảng thành chuỗi JSON
10 Danh sách Câu hỏi & Bài tập
1 Tạo Custom Pipes
2 Bài tập - Custom Pipe để Sắp xếp Số
3 Bài tập - Tạo Custom Pipe Đếm Chữ cái
4 Pure Vs. Impure Pipe
5 Sử dụng Impure Pipes
6 Danh sách Câu hỏi & Bài tập
1 Routing - Giới thiệu
2 Hiểu Cấu trúc Router Module
3 - Tạo một route đơn giản
4 Tạo liên kết điều hướng với Directive "routerLink"
5 Bài tập - Tạo Navbar bằng routes
6 Truyền Tham số Route (Dynamic Routing)
7 Wildcard Routes - Hiển thị trang 404
8 Hiểu về Nested Routes
9 Bài tập - Tạo menu đa cấp
10 Redirecting Routes
11 Hiểu về forRoot và forChild trong routing
12 Hiểu về ActivatedRoute
13 Query Parameters trong Routing
14 Bài tập - Hiển thị Chi tiết Khóa học và Lấy Query Parameters
15 Danh sách Câu hỏi & Bài tập
1 Giới thiệu về Services
2 Dependency Injection
3 Providing Services
4 Danh sách Câu hỏi & Bài tập
1 Injecting Tokens
2 Injecting String Tokens
3 Injection Token Object
4 Cung cấp Giá trị với “useValue”
5 Bài tập - Cung cấp Giá trị Hằng số làm Dependency
6 Alias Provider - thuộc tính useExisting
7 Factory Provider - thuộc tính useFactory
8 "Cung cấp Dependencies Sử dụng thuộc tính “deps” với useFactory"
9 useFactory Vs. useValue
10 Danh sách Câu hỏi & Bài tập
1 Giới thiệu về Angular Forms
2 Hiểu về directive ngForm
3 Bài tập - Tạo Form Gửi và Đặt lại Đơn giản
4 Template-driven form
1 Hiểu về FormControl
2 Hiểu về FormGroup
3 Dynamic Forms với FormArray
4 Hiểu về FormBuilder
5 Validating Form Controls
6 Tạo Multi Step Reactive Form với Bootstrap (Phần 1)
7 Tạo Multi Step Reactive Form với Bootstrap (Phần 2)
8 Tạo Multi Step Reactive Form với Bootstrap (Phần 3)
9 Theo dõi Trạng thái Form Control (Thuộc tính Dirty và Pristine)
10 Nhiều Xác thực trên Trường Mật khẩu
1 Tạo Custom Validators
2 Custom URL Validator
1 Bảo mật Routes với Route Guards
2 CanDeactivate Route Guard
3 CanActivateChild Route Guard
4 Bài tập - Xác thực Đăng nhập
5 Tải Modules với CanLoad Route Guard
6 CanMatch Guard
1 Giới thiệu về Lazy Loading
2 Lazy Loading Of Modules
3 Preloading Of Modules
4 Câu hỏi Liên quan - Preloading Vs. Lazy Loading
5 NG17-Deferred Loading
6 NG17-@defer với @placeholder
7 NG17-@defer với @loading
8 NG17-@defer với @error
9 NG17 - Làm việc với Triggers (khi không hoạt động)
10 NG17 - Làm việc với Triggers (khi trong viewport)
11 NG17 - Làm việc với Triggers (khi tương tác)
12 NG17 - Làm việc với Triggers (khi di chuột qua)
13 NG17 - Làm việc với Triggers (ngay lập tức)
14 NG17 - Làm việc với Triggers (theo bộ đếm thời gian)
15 NG17 - Tải trước các khối @defer
16 NG17 - Định nghĩa Triggers tùy chỉnh
1 Hiểu về Observables & RxJS
2 Quản lý Observables & Subscribers
3 Hủy đăng ký một Observable
4 Hiểu về Async Pipe
5 Bài tập - Lấy dữ liệu JSON với Async Pipe
1 Toán tử RxJS {of}
2 Toán tử RxJS {from}
3 Toán tử RxJS {interval}
4 Toán tử RxJS {timer}
5 Bài tập - Triển khai spinner tải với toán tử timer
6 Toán tử RxJS {empty}
7 Các toán tử Pipeable trong RxJS
8 Toán tử RxJS {filter}
9 Toán tử RxJS {map}
10 Toán tử RxJS {mergeMap}
11 Bài tập - mergeMap() - Hiển thị các khóa học liên kết với người dùng
12 Toán tử RxJS { concatMap }
13 Toán tử RxJS { switchMap }
1 Thực hiện HTTP Calls với HttpClient
2 Thực hiện HTTP Calls với Observable
3 Triển khai HTTP POST Request
4 Sửa đổi dữ liệu với PUT Request
5 Xóa dữ liệu với DELETE Request
6 Ứng dụng CRUD #1 - Hiển thị sản phẩm với GET Request
7 Ứng dụng CRUD #2 - Thêm sản phẩm với POST Request
8 Ứng dụng CRUD #3 - Lấy dữ liệu sản phẩm trước khi cập nhật
9 Ứng dụng CRUD #4 - Cập nhật sản phẩm với PUT Request
10 Ứng dụng CRUD #5 - Xóa sản phẩm với DELETE Request
1 Giới thiệu về Signals
2 Tạo Signal
3 Cập nhật giá trị Signal
4 Thay đổi giá trị Signal
5 Bài tập danh sách việc cần làm
6 Computed Signals
7 Hiểu về hàm effect()
8 Untracking Signals
9 Bài tập - Cập nhật giỏ hàng sử dụng Signals
1 Giới thiệu Angular 17
2 Bắt đầu với Angular 17
3 Bootstrapping & Sử dụng Standalone
4 Câu lệnh Control Flow @for loop
5 Câu lệnh Control Flow (@if & @else)
6 Câu lệnh Control Flow (@switch)
7 Tải chậm (Deferred Loading)
8 @defer với @placeholder
9 @defer với @loading
10 @defer với @error
11 Làm việc với Triggers (khi không hoạt động)
12 Làm việc với Triggers (khi trong viewport)
13 Làm việc với Triggers (khi tương tác)
14 Làm việc với Triggers (khi di chuột qua)
15 Làm việc với Triggers (ngay lập tức)
16 Làm việc với Triggers (theo bộ đếm thời gian)
17 Tải trước các khối @defer
18 Định nghĩa Triggers tùy chỉnh
1 Giới thiệu
2 Tạo dự án eStore
3 Cài đặt Bootstrap
4 Bắt đầu với component header
5 Thêm thanh tìm kiếm
6 Dropdown danh mục trong thanh tìm kiếm
7 Link đăng nhập, icon danh sách yêu thích và giỏ hàng
8 Thanh điều hướng danh mục
9 Tạo component trang chủ
10 Tổ chức lại cấu trúc component header và thanh điều hướng danh mục
11 Tạo trang lỗi 404
12 Component điều hướng bên (Side navigation)
13 Lấy dữ liệu vào component điều hướng bên
14 Component sản phẩm
15 Tạo kiểu cho thẻ sản phẩm
16 Lấy dữ liệu vào component sản phẩm
17 Tạo component đánh giá
18 Cài đặt MySQL
19 Tạo Database
20 Tạo Node Server
21 Cấu hình API Route
22 Cấu hình Nodemon
23 Kết nối tới MySQL
24 Lấy dữ liệu với câu truy vấn SQL
25 Loại bỏ lệnh gọi getConnection()
26 Tạo routes với Express
27 Cấu hình Routes với “express.Router()”
28 Tạo workspace
29 Lấy danh mục từ server
30 Lấy danh mục trong thanh điều hướng danh mục
31 Giới thiệu quản lý trạng thái
32 Điền danh mục tìm kiếm vào header
33 Định nghĩa routes để lấy sản phẩm
34 Lấy sản phẩm trong component sản phẩm
35 Tham số truy vấn để lọc sản phẩm theo danh mục
36 Thêm store sản phẩm
37 Lọc sản phẩm từ thanh điều hướng bên
38 Lọc sản phẩm từ thanh điều hướng danh mục
39 Thêm từ khóa vào database
40 Tìm sản phẩm sử dụng hộp tìm kiếm
41 Tải chậm module trang chủ và component gallery sản phẩm
42 Tạo component chi tiết sản phẩm
43 Triển khai giỏ hàng mua sắm - Phần 1
44 Triển khai giỏ hàng mua sắm - Phần 2
45 Tạo component giỏ hàng - Phần 1
46 Tạo component giỏ hàng - Phần 2
47 Tóm tắt giỏ hàng và lưu trữ phiên (session storage)
48 API đăng ký người dùng
49 Bắt đầu với form đăng ký người dùng
50 Thêm xác thực vào form đăng ký người dùng
51 Kết nối form đăng ký với API
52 API đăng nhập người dùng + Giới thiệu về jwt
53 Form đăng nhập người dùng
54 Kết nối form đăng nhập người dùng với API
55 Tạo menu dropdown người dùng
56 Thêm chức năng đăng xuất
57 Hiển thị địa chỉ giao hàng trong màn hình thanh toán
58 Tạo API để lưu đơn hàng
59 Tạo order service
60 Lưu đơn hàng từ giỏ hàng
61 59. API để lấy danh sách đơn hàng
62 Tạo component đơn hàng trước đây
63 Hiển thị đơn hàng trước đây và route guard
1 Giới thiệu - Tại sao cần kiểm thử? Thủ công vs Tự động
2 Unit vs. Integrated vs. End to End
3 Jasmine & Karma - Bài kiểm thử đầu tiên
4 Các phương thức before() và after() trong Jasmine
5 Kiểm thử unit cho component đánh giá
6 Spies và mocks
7 Kiểm thử unit cho forms
8 Kiểm thử unit cho routes
9 Kiểm thử unit cho http services
10 Kiểm thử tích hợp (Integration test)
11 Độ bao phủ mã (Code coverage)

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

This course is meticulously crafted to enable you with the skills and knowledge necessary to outshine in the dynamic world of frontend programming and is designed for aspiring learners and professionals seeking to dive deep into Angular development.

In this immersive unique learning experience, you will embark on a hands-on exploration of Angular, a cutting-edge JavaScript/TypeScript framework renowned for building complex, responsive, and scalable web applications.

Whether you're a novice or have prior programming experience, this course will equip you with a profound understanding of Angular's architecture, along with the practical skills to harness its capabilities effectively.

Here are the key features of this course:

Comprehensive Angular Mastery → From architecture to deployment, become an Angular expert.
Hands-On Learning → Gain practical skills through real-world projects and exercises.
Responsive SPA Development → Learn to build adaptive single-page applications for diverse devices.
Job-Ready Skills → Acquire the knowledge to excel as a frontend developer in the competitive market.

Technologies used in this course:

  • Angular (latest version 16+17)

  • HTML5

  • CSS3

  • Bootstrap

  • TypeScript

  • Node.js (for development server)

  • MySQL

  • Git (version control)

  • Angular CLI (Command Line Interface)

  • Visual Studio Code (Code Editor)

Key concepts covered:

  • Introduction to Angular Architecture

  • Directives and Components

  • Databinding Techniques

  • Routing and Navigation

  • Angular Forms

  • Angular Tokens

  • Enhancing Data Display with Pipes

  • Dependency Injection & Services

  • Mastering Angular Modules

  • Observables & RxJS

  • RxJS Operators

  • Handling HTTP Calls

  • Major eStore Project

  • Practical assignments and more ...

Embark on this transformational learning experience and emerge as a proficient Angular developer, equipped with the skills to create, deploy, and excel in crafting exceptional web applications.

Join us today and take a definitive step towards shaping a successful career in the world of web development.

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 Web Development
Zalo
Tôi có thể tư vấn khoá học cho bạn 😊