Autoplay
Autocomplete
Previous Lesson
Complete and Continue
Complete Angular Developer in 2025: Zero to Mastery
Section 1: Introduction
Complete Angular Developer: Zero to Mastery (2:22)
What Are We Building? (4:17)
Exercise: Meet Your Classmates and Instructor
Complete Course Resources + Code
ZTM Plugin + Understanding Your Video Player
Set Your Learning Streak Goal
Section 2: Bootstrapping Angular
Understanding Frameworks (4:41)
The Angular CLI (4:17)
Upgrading Angular (2:15)
Creating a New Application (3:33)
Starting the Server (5:07)
Reviewing the Configuration Files (8:10)
Main Entry File (1:27)
AOT Compilation (5:04)
Bootstrapping Angular (5:27)
Understanding Components (2:03)
Creating Components (5:47)
External Templates and Styles (6:09)
Everything Else (1:54)
Section 3: TypeScript (OPTIONAL)
Introduction to TypeScript (5:12)
Installing TypeScript (3:47)
Type Annotations (4:52)
Variables (4:41)
Union Types (3:17)
Arrays (3:02)
Objects (3:31)
Interfaces (3:47)
Classes (3:34)
Generics (7:46)
Why Decorators (4:43)
TypeScript Configuration (2:50)
Writing Decorators (8:09)
Section 4: Component Fundamentals
Signals (10:11)
Property Binding (4:13)
Event Binding (7:03)
Type Assertions (5:38)
Creating a Component (4:45)
Custom Properties (8:04)
Required Inputs (2:30)
Emitting Events (8:46)
Content Projection (3:20)
Discovering Lifecycle Hooks (7:07)
Exploring More Lifecycle Hooks (10:43)
Scoped CSS (4:25)
Section 5: Transforming Content
Understanding Pipes (2:11)
Pipe Basics (4:59)
Angular Dev Tools (2:28)
Pipe Parameters (7:02)
Dealing with Numbers (8:06)
Debugging with Pipes (2:27)
Understanding Directives (1:31)
The ngClass Directive (6:44)
The ngStyle Directive (4:13)
If Block (2:17)
For Block (6:06)
Section 6: Master Project - Component Design
Introduction to the Master Project! (4:35)
What is Tailwind? (5:37)
Installing Tailwind (7:30)
Configuring Tailwind (2:33)
Practicing with Tailwind (6:31)
Loading Static Assets (6:16)
What’s Next? (3:34)
Navigation and Modal Components (6:36)
Designing a Modal (2:25)
Creating a Shared Component (2:31)
Creating a Reusable Modal (2:54)
Multi-slot Content Projection (3:15)
Understanding Services (3:37)
Creating a Service (1:26)
Understanding Dependency Injection (9:03)
Injecting Services (3:21)
Signal Queries (7:53)
Opening the Modal (6:40)
Closing the Modal (3:53)
Memory Leaks (6:32)
Fixing the memory leak (4:56)
Creating a Tabs Component (6:03)
The contentChildren Query Signal (4:50)
Looping through the Tabs (3:40)
Setting an Active Tab (5:40)
Toggling Tabs (5:17)
Preventing the Default Behavior (2:02)
Section 7: Master Project - Reactive Forms
Preparing the Forms (6:00)
Registering a New Form (4:55)
Adding Form Controls (3:19)
Binding a Form (3:09)
Form Validation (7:23)
Understanding Errors (4:36)
Handling Errors (5:21)
Form Controller Status (5:43)
Designing an Input Component (3:46)
Binding Form Controls (2:20)
Updating the Template (4:57)
Validating Emails (7:11)
Validating Numbers (6:01)
Validating Passwords with Patterns (6:18)
Input Masking (5:49)
Applying Input Masking (5:59)
Disabling Buttons (2:50)
Handling Form Submission (2:51)
Designing an Alert Component (11:29)
Section 8: Master Project - Template Forms
Importing the FormsModule (2:09)
Registering a new Form (3:39)
Two-way Binding (6:44)
Template Variables (5:50)
Attribute Validation (3:27)
Handling Error Messages (3:45)
Preparing the Password Field (4:15)
Handling Form Submission (3:56)
Section 9: Introduction to RxJS
Introduction to RxJS (5:55)
Observables (5:47)
Observers (4:22)
Pushing Asynchronous Values (3:40)
Unsubscribing from Observables (3:35)
Declarative Programming with Operators (5:48)
Timing Operators (5:27)
DOM Event Operators (2:16)
The of and from Operators (5:57)
Understanding Pipeable Operators (4:07)
The Map Operator (4:09)
Marble Diagram (2:45)
Filter Operator (7:27)
Reduce Operator (4:06)
Take Operator (4:18)
Tap Operator (3:28)
Understanding Flattening Operators (7:39)
mergeMap Operator (6:16)
switchMap Operator (5:05)
concatMap Operator (2:29)
exhaustMap Operator (2:34)
Flattening Operators Recap (2:22)
Section 10: Master Project - Authentication
Setting Up Firebase (7:11)
Reviewing the Rules (6:18)
Installing AngularFire (3:59)
Importing AngularFire (6:44)
User Registration (8:04)
Handling the Response (8:43)
Buckets, Collections and Documents (3:20)
Firestore Provider (1:50)
Storing User Data (6:17)
Refactoring to a Service (6:34)
Interfaces vs. Classes (6:20)
Connecting the User with their Data (10:26)
Database Rules (2:41)
Understanding Authentication (4:16)
Authentication after Registration (3:22)
The User Observable (3:45)
The Async Pipe (4:59)
Setting Up the Login (10:41)
Destroying the Modal (4:22)
The Delay Operator (3:54)
Signing Out (4:37)
Sidebar JSON Web Tokens (9:32)
Section 11: Master Project - Custom Validators
Creating a Validator Class (3:34)
Validating Passwords (6:33)
Factory Functions (6:11)
Handling Errors (6:03)
Creating an Asynchronous Validator (5:05)
Validating Unique Emails (5:21)
Finalizing the Validator (7:58)
Section 12: Master Project - Routing
Understanding Routing (5:29)
Configuring the Router (3:06)
Registering Routes (7:15)
Exercise Registering a Route (3:40)
Adding Navigation Links (3:45)
Active Links (7:07)
Creating the Manage Route (2:46)
Forcing Redirection (4:43)
A Quick Refactor (4:10)
Adding Route Data (5:49)
Filtering Router Events (4:37)
Retrieving Data Outside of the Outlet (6:50)
Exercise Registering a Route with Data (4:59)
Route Parameters (7:15)
Subscribing to Route Parameters (4:56)
Query Parameters (10:11)
Learning More About Query Parameters (8:35)
Selecting an Option (1:48)
Wildcard Routes (3:31)
Updating Routes (3:49)
Route Guards (5:47)
Section 13: Master Project - Uploading Files
Understanding File Uploads (3:27)
Blocking Events with Directives (8:35)
Handling Drag and Drop Events (7:51)
Handling Files (8:12)
Multi-Step Form (3:58)
The Upload Form (9:27)
Uploading Files with Firebase (9:18)
Firebase Rules and Validation (7:37)
Adding an Alert Component (5:30)
Upload Progress Observable (3:54)
Handling Errors and Successful Uploads (7:32)
Storing the File Data (6:05)
Adding the File Data to the Database (7:19)
Firebase References and Snapshots (2:24)
Disabling Forms (2:48)
Canceling Uploads (5:38)
Redirection after Upload (5:30)
Storing a Timestamp (4:26)
Querying the Database (7:31)
Storing the List of Clips (6:39)
Displaying the List of Clips (2:33)
Preparing the Form (6:38)
Passing on the Clip Data (3:28)
Binding the Edit Form (5:52)
Updating Clips (11:30)
Updating the List of Clips (8:52)
Deleting a Clip from the Storage and Database (11:32)
Sorting Clips with Computed Signals (5:07)
Section 14: WebAssembly & Rust
What is WebAssembly? (8:53)
Getting Started with Rust (6:20)
Exploring the Starter Project (6:46)
Variables (5:16)
Data Types (6:47)
Debugging with Macros (6:54)
Control Flow (4:40)
Match Expressions (7:50)
Arrays (2:50)
Vectors (5:20)
Structures (4:08)
Ownership (6:48)
Results (8:20)
Preparing the Project (3:39)
Installing Webpack (3:40)
Configuring Webpack (10:20)
Reading Files (8:10)
Note: Installing wasm-pack
Compiling Rust with Webpack (4:46)
Importing Web Assembly (5:47)
Logging Files (9:21)
Base64 Decoding (3:48)
Loading an Image from Memory (2:59)
Grayscaling an Image (2:53)
Buffering an Image (5:18)
Encoding an Image (5:10)
App Deployment (4:06)
Section 15: Master Project - Processing Videos with FFmpeg
Understanding FFmpeg (2:47)
Installing FFmpeg (5:06)
Custom Asset Paths (5:18)
Adding support for SharedArrayBuffer (6:47)
Loading FFmpeg with a Service (4:07)
Initializing FFMPeg (6:05)
Saving Files in Memory (6:28)
Generating a Screenshot (11:04)
Generating Multiple Screenshots (5:13)
Creating Screenshot URLs (5:48)
Rendering Screenshots (3:09)
Adding Feedback (3:31)
Selecting a Screenshot (4:19)
Updating the Firebase Storage Rules (2:03)
Uploading a Blob (7:10)
Recalculating the Upload Progress (5:03)
The forkJoin Operator (5:15)
Deleting Screenshots (4:27)
Section 16: Master Project - Playing Videos
Introduction (1:44)
Creating a List Component (2:00)
Handling Scroll Events (8:26)
Querying for Clips (12:43)
Rendering Clips on the Home page (5:20)
Understanding Cross Origin Issues (3:44)
Fixing Cross Origin Issues (8:10)
Fixing the Timestamp (5:08)
Rendering Clips on the Clip Page (3:46)
Installing Videojs (1:37)
Selecting the Video Player (3:21)
Initializing the Video Player (1:42)
Clip Styles (2:10)
Resolving Data with a Guard (8:34)
Dynamically Rendering the Video (6:41)
Fixing the Manage Page (1:03)
Copying Links to the Clipboard (5:26)
Section 17: Master Project - Deployment
Production Budgets (3:28)
Modifying Firebase Rules (3:45)
Deploying an App with Vercel (10:46)
Section 18: Master Project - Testing
Introduction to Testing (11:26)
Understanding Karma and Jasmine (3:11)
Preparing Our App for Testing (3:11)
Writing a Sanity Test (6:04)
Angular’s Test Bed Utility (5:33)
Testing a Component’s Instance (6:28)
Querying the Component’s Template (6:40)
Inverting Matchers (3:16)
Testing Nested Components (5:10)
Testing Content Projection (6:33)
Custom Matcher Error Messages (2:32)
Mocking Services (6:30)
Overriding a Dependency (2:22)
Providing the Router in Tests (1:54)
Exercise Testing the Logout Link (2:59)
Simulating DOM Events (4:02)
Installing Cypress (6:45)
Exploring Cypress (6:04)
Writing an E2E Sanity Test (6:08)
Testing the Video Player (8:53)
Where To Go From Here?
Thank You! (1:17)
Review This Course!
Become An Alumni
Learning Guideline
ZTM Events Every Month
LinkedIn Endorsements
Creating a Shared Component
This lecture is available exclusively for ZTM Academy members.
If you're already a member,
you'll need to login
.
Join ZTM To Unlock All Lectures