Autoplay
Autocomplete
Previous Lesson
Complete and Continue
Complete Angular Developer in 2023: Zero to Mastery
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
Understanding Your Video Player (notes, video speed, subtitles + more)
Set Your Learning Streak Goal
Bootstrapping Angular
Understanding Frameworks (4:40)
The Angular CLI (4:08)
Latest Version Of Angular (2:21)
Web Developer Monthly
Creating a New Application (3:35)
Starting the Server (5:08)
Time For TypeScript
Angular Cheat Sheet
Reviewing the Configuration Files (7:43)
Main Entry File (1:25)
AOT Compilation (5:01)
Loading a Platform (2:59)
Bootstrapping Angular (2:47)
Enabling Production Mode (4:28)
Understanding Modules (4:00)
Creating Modules (6:05)
Understanding Components (1:58)
Creating Components (6:00)
External Templates and Styles (5:59)
Everything Else (3:44)
Let's Have Some Fun (+ Free Resources)
OPTIONAL: TypeScript
Introduction to TypeScript (5:08)
Installing TypeScript (3:45)
Type Annotations (4:49)
Variables (4:39)
Union Types (3:14)
Arrays (3:00)
Objects (3:30)
Interfaces (3:45)
Classes (3:31)
Generics (7:41)
TypeScript Configuration (1:55)
Why Decorators? (4:38)
Writing Decorators (7:03)
Component Fundamentals
Interpolation (7:45)
Property Binding (3:49)
Event Binding (6:17)
Type Assertions (5:37)
Creating a Component (5:31)
Custom Properties (6:43)
Input Aliases (2:44)
Emitting Events (9:10)
Content Projection (3:17)
Discovering Lifecycle Hooks (6:07)
Exploring More Lifecycle Hooks (10:32)
Scoped CSS (4:23)
Unlimited Updates
Transforming Content
Understanding Pipes (2:06)
Pipe Basics (5:42)
Angular Dev Tools (2:39)
Pipe Parameters (6:14)
Dealing with Numbers (7:13)
Debugging with Pipes (1:50)
Understanding Directives (1:59)
The ngClass Directive (5:09)
The ngStyle Directive (4:10)
Understanding ng-template (2:11)
The ngIf Directive (3:50)
The ngFor directive (5:43)
Course Check-In
Master Project: Component Design
Introduction to Master Project (6:02)
What is Tailwind? (5:36)
Installing Tailwind (7:15)
Configuring Tailwind (2:30)
Practicing with Tailwind (5:25)
Loading Static Assets (4:41)
What’s Next? (3:30)
Creating a User Module (4:35)
Navigation and Modal Components (5:33)
Exporting Components (3:24)
Designing a Modal (2:23)
Creating a Shared Module (4:09)
Creating a Reusable Modal (2:47)
Multi-slot Content Projection (3:12)
Understanding Services (3:31)
Creating a Service (1:41)
Understanding Dependency Injection (5:34)
Injecting Services (5:11)
Opening the Modal (5:51)
Closing the Modal (3:09)
Understanding Singletons (3:46)
Creating an ID System (5:45)
Refactoring the Service (5:04)
Updating the Components (4:46)
Memory Leaks (6:02)
Fixing the memory leak (4:46)
CSS Issues (5:49)
Creating a Tabs Component (6:03)
The ContentChildren Decorator (5:40)
The QueryList Object (3:22)
Looping through the Tabs (3:20)
Setting an Active Tab (7:07)
Toggling Tabs (4:17)
Preventing the Default Behavior (1:59)
Implement a New Life System
Master Project: Reactive Forms
Preparing the Forms (5:42)
Adjusting the "noPropertyAccessFromIndexSignature" option
Registering a new Form (4:15)
Adding Form Controls (3:15)
Binding a Form (3:05)
Form Validation (7:11)
Understanding Errors (4:16)
Handling Errors (5:16)
Form Controller Status (5:49)
Designing an Input Component (3:50)
Binding Form Controls (8:23)
Updating the Template (6:27)
Validating Emails (6:49)
Validating Numbers (5:57)
Validating Passwords with Patterns (6:00)
Input Masking (5:54)
Applying Input Masking (6:05)
Disabling Buttons (5:11)
Handling Form Submission (2:49)
Designing an Alert Component (10:13)
Master Project: Template Forms
Importing the FormsModule (2:22)
Registering a new Form (4:04)
Two-way Binding (6:38)
Template Variables (5:46)
Attribute Validation (3:24)
Handling Error Messages (3:40)
Preparing the Password Field (4:13)
Handling Form Submission (4:49)
Exercise: Imposter Syndrome (2:55)
Intro to RxJS
Introduction to RxJS (6:02)
Observables (5:21)
Observers (4:20)
Pushing Asynchronous Values (3:39)
Unsubscribing from Observables (3:33)
Declarative Programming with Operators (5:47)
Timing Operators (5:25)
DOM Event Operators (2:15)
The of and from operators (5:53)
Understanding Pipeable Operators (4:01)
The Map Operator (4:04)
Marble Diagram (2:43)
Pluck Operator (3:39)
Filter Operator (6:10)
Reduce Operator (4:03)
Take Operator (4:16)
Tap Operator (3:26)
Understanding Flattening Operators (7:01)
mergeMap Operator (6:14)
switchMap Operator (4:41)
concatMap Operator (2:28)
exhaustMap Operator (2:31)
Flattening Operators Recap (2:21)
Master Project: Authentication
Setting up Firebase (7:08)
Reviewing the Rules (6:14)
Skipping Library Checks
Installing AngularFire (3:57)
Importing AngularFire (6:58)
User Registration (7:54)
Handling the Response (8:37)
Buckets, Collections, and Documents (3:17)
Storing User Data (6:32)
Refactoring to a Service (6:18)
Interfaces vs. Classes (7:50)
Collection Types (6:20)
Connecting the User with their Data (10:08)
Database Rules (2:39)
Understanding Authentication (4:13)
Authentication after Registration (3:19)
The User Observable (5:52)
The Async Pipe (7:37)
Initializing Firebase First (9:32)
Setting up the Login (9:25)
Destroying the Modal (6:07)
The Delay Operator (4:05)
Signing Out (4:26)
Sidebar: JSON Web Tokens (9:31)
Master Project: Custom Validators
Creating a Validator Class (3:56)
Static Methods (3:18)
Validating Passwords (6:12)
Factory Functions (6:15)
Handling Errors (6:03)
Creating an Asynchronous Validator (5:26)
Validating Unique Emails (5:24)
Finalizing the Validator (7:27)
Master Project: Routing
Understanding Routing (5:28)
Configuring the Router (5:49)
Registering Routes (7:00)
Exercise: Registering a Route (3:39)
Adding Navigation Links (3:12)
Active Links (6:45)
Generating a Routing Module (5:56)
Forcing Redirection (4:39)
A Quick Refactor (3:28)
Adding Route Data (5:24)
Filtering Router Events (4:34)
Retrieving Data Outside of the Outlet (7:42)
Exercise: Registering a Route with Data (4:36)
Route Parameters (6:52)
Subscribing to Route Parameters (4:35)
Query Parameters (9:29)
Learning More About Query Parameters (8:42)
Selecting an Option (1:47)
Wildcard Routes (5:06)
Updating Routes (3:49)
Route Guards (5:51)
Master Project: Uploading Files
Understanding File Uploads (3:24)
Blocking Events with Directives (9:01)
Handling Drag and Drop Events (7:09)
Handling Files (7:53)
Multi Step Form (4:29)
The Upload Form (9:12)
Uploading Files with Firebase (6:54)
Firebase Rules and Validation (7:23)
Adding an Alert Component (5:15)
Upload Progress Observable (3:46)
Handling Errors and Successful Uploads (10:22)
Storing the File Data (8:28)
Adding the File Data to the Database (8:12)
Firebase References and Snapshots (2:22)
Disabling Forms (2:47)
Fallback Upload (6:17)
Canceling Uploads (5:46)
Redirection after Upload (6:24)
Storing a Timestamp (4:38)
Querying the Database (8:53)
Storing the List of Clips (7:20)
Displaying the List of Clips (2:12)
Preparing the Form (7:05)
Passing on the Clip Data (3:27)
Binding the Edit Form (6:32)
Updating Clips (9:17)
Updating the List of Clips (6:59)
Deleting a Clip from the Storage/Database (10:01)
Sorting Clips with Behavior Subjects (11:05)
Composite Indexes (4:31)
WebAssembly & Rust
What is WebAssembly? (8:51)
Getting Started with Rust (6:17)
Exploring the Starter Project (6:46)
Variables (5:14)
Data Types (6:46)
Debugging with Macros (6:51)
Control Flow (4:38)
Match Expressions (7:48)
Arrays (2:49)
Vectors (5:18)
Structures (4:06)
Ownership (6:48)
Results (8:19)
Preparing the Project (3:40)
Installing Webpack (3:39)
Configuring Webpack (10:05)
Reading Files (8:09)
Compiling Rust with Webpack (4:47)
Importing Web Assembly (5:42)
Logging Files (9:14)
Base64 Decoding (3:06)
Loading an Image from Memory (3:21)
Grayscaling an Image (2:57)
Buffering an Image (4:19)
Encoding an Image (5:39)
App Deployment (4:05)
Master Project: Processing Videos with FFmpeg
Understanding FFmpeg (2:44)
Installing FFmpeg (5:00)
Custom Asset Paths (5:25)
Adding support for SharedArrayBuffer (6:45)
Loading FFmpeg with a Service (4:11)
Initializing FFMPeg (6:46)
Saving Files in Memory (5:45)
Generating a Screenshot (11:00)
Generating Multiple Screenshots (5:08)
Creating Screenshot URLs (5:46)
Bypassing Sanitization with Pipes (8:24)
Adding Feedback (3:38)
Selecting a Screenshot (4:15)
Updating the Firebase Storage Rules (2:02)
Uploading a Blob (6:31)
Recalculating the Upload Progress (4:47)
The forkJoin Operator (7:22)
Deleting Screenshots (3:45)
Master Project: Playing Videos
Section Overview (1:43)
Creating a List Component (1:47)
Handling Scroll Events (7:40)
Querying for Clips (10:38)
Rendering Clips on the Home page (4:50)
Understanding Cross Origin Issues (3:43)
Fixing Cross Origin Issues (8:09)
Fixing the Timestamp (8:15)
Rendering Clips on the Clip Page (3:30)
Installing Videojs (1:37)
Selecting elements with the ViewChild Decorator (5:58)
Initializing the Video Player (2:02)
Styles without View Encapsulation (5:16)
Tailwind’s Aspect Ratio Classes (1:26)
Resolving Data with a Guard (8:09)
Dynamically Rendering the Video (7:02)
Fixing the Manage Page (1:03)
Copying Links to the Clipboard (6:04)
Lazy Loading Modules (6:31)
Master Project: Deployment
Production Budgets (3:26)
Modifying Firebase Rules (3:42)
Deploying an App with Vercel (10:44)
Master Project: Testing
Introduction to Testing (11:20)
Understanding Karma and Jasmine (8:13)
Preparing our App for Testing (2:56)
Writing a Sanity Test (6:01)
Angular’s Test Bed Utility (5:55)
Testing a Component’s Instance (6:27)
Querying the Component’s Template (6:39)
Inverting Matchers (3:10)
Testing Nested Components (4:41)
Testing Content Projection (6:24)
Custom Matcher Error Messages (2:30)
Mocking Services (6:32)
Overriding a Dependency (2:44)
Importing the Router Testing Module (1:59)
Exercise: Testing the Logout Link (3:05)
Simulating DOM Events (3:58)
Installing Cypress (6:09)
Exploring Cypress (6:04)
Writing an E2E Sanity Test (6:04)
Testing the Video Player (8:52)
Where To Go From Here?
Thank You! (1:17)
Review This Course!
Learning Guideline
LinkedIn Endorsements
Become An Alumni
Coding Challenges
Adding the File Data to the Database
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