Introduction to Angular v18 (Course Introduction)

04:06

Angular CLI

04:43

Understanding Project Structure

06:52

First Component with Architecture

10:56

IQ - First Component with Architecture

01:35

Displaying message dynamically (Interpolation)

02:44

IQ - Interpolation

01:37

Task - Display sum of two values

01:42

Property binding

04:17

IQ - Property Binding

01:57

Task - Property binding with image tag

01:31

Event binding with click event

03:03

IQ - Event Binding

00:51

Task - Creating Counter Example

03:24

Binding other mouse related events

03:39

Binding keyboard events

03:02

$event object

04:16

IQ - $event object

04:12

Task - Checking Shift key status

02:44

Task - Keydown to increment/decrement counter

04:08

Two way binding (ngModel)

06:38

IQ - Two way binding (ngModel)

04:03

Task (Two-way Binding) - Get input field value on button click

02:36

Task - Simple Cart Calculation - Two way binding

03:52

Directives Introduction

01:54

Structural Directives (*ngIf)

04:03

IQ - *ngIf directive

01:38

Task - Implementing show & hide functionality with *ngIf

02:14

Structural Directives (*ngFor)

02:35

IQ - *ngFor Directive

06:15

Structural Directives (*ngSwitch)

03:32

IQ - *ngSwitch directive

02:15

Task - Implementing age validation functionality

03:01

Attribute Directives [ngClass]

06:04

Task - Toggle functionality using ngClass

04:25

Attribute Directives [ngStyle]

03:19

Task [ngStyle] - Changing the color of input field

08:22

Grouping elements with ng-container

03:56

HTML templates with ng-template

03:45

IQ - ng-template Vs. ng-container

02:09

Task - Display msg if input remains empty (ng-container & ng-template)

04:26

Rendering templates with ngTemplateOutlet - Part 1

04:50

Rendering templates with ngTemplateOutlet - Part 2

03:22

IQ - ngTemplateOutlet Directive

02:00

Task - Portfolio Builder (Phase 1) - Defining Template

03:08

Task - Portfolio Builder (Phase 2) - CSS

05:18

Task - Portfolio Builder (Phase 3) - Binding

06:00

Introduction

02:29

Component Creation Hook - ngOnChanges()

04:20

IQ - ngOnChanges()

01:14

Understanding SimpleChanges Object

04:22

IQ - SimpleChanges Object

04:22

Component Creation Hook - ngOnInIt()

06:03

IQ - ngOnInit()

04:05

Detecting Custom Changes With ngDoCheck() hook

06:55

IQ - ngDoCheck()

06:34

Understanding the ngAfterContentInit() hook

07:47

IQ - ngAfterContentInit()

01:59

Checking The Content With ngAfterContentChecked() hook

03:04

Loading Content With ngAfterViewInit() hook

03:33

IQ - ngAfterViewInit()

04:47

Checking The Component View With ngAfterViewChecked() hook

02:47

Destroying Component With ngDestroy() hook

03:43

Introduction To Decorators

01:27

Class Decorators @NgModule

03:40

Class Decorators - @Component Decorator

02:55

Property Decorators - @Input() decorator

03:35

IQ - @Input() decorator

01:46

Task - @Input() Decorator

03:22

Property Decorators - @Output decorator

04:29

IQ - @Output decorator

00:53

Task - Using @Input and @Output Together

07:31

Property Decorators - Accessing Child Components With @ViewChild

08:19

IQ - @ViewChild decorator

00:56

Property Decorators - Accessing The Projected Content With @ContentChild

04:07

IQ - @ContentChild() Decorator

01:04

Property Decorators - Binding Properties With @HostBinding

04:16

Method Decorators - Binding Methods To Events With @HostListener

05:07

Task - Implementing Color Picker

05:29

Parameter Decorators

01:02

Pipes Introduction

03:31

Task - Implementing the built-in pipes

03:57

Understanding Slice Pipe

03:04

Task - Page navigation using slice pipe (Part-1)

05:25

Task - Page navigation using slice pipe (Part-2)

06:39

Understanding Number pipe

03:10

Task - Pound to Kg Converter Using Number Pipe

04:40

Understanding JSON Pipe

01:58

Displaying Table Data To JSON string

04:34

Creating Custom Pipes

03:39

IQ - Custom Pipes

00:58

Task - Creating Custom Pipe For Sorting Numbers

06:23

Task - Creating Custom Pipe For Letter Count

03:19

Pure Vs Impure Pipe

03:56

Using Impure Pipes

03:11

Routing Introduction

03:00

Creating a simple route - <router-outlet>

04:16

IQ - <router-outlet>

01:15

Creating A Navigation Link With “routerLink” Directive

02:03

IQ - routerLink Directive

00:50

Creating A NavBar Using Routes

05:54

Passing Route Parameters (Dynamic Routing)

03:24

IQ - Dynamic Routing

01:03

Wildcard Routes - Displaying The ‘404’ Page

03:19

IQ - Wildcard Routes

01:14

Understanding Nested Routes

02:28

IQ - Nested Routes

01:17

Task - Creating a multi-level menu

03:16

Redirecting Routes

04:10

IQ - Redirecting Routes

00:53

Understanding ActivatedRoute

04:51

IQ - ActivatedRoute

01:50

Query Parameters In Routing

04:17

IQ - Query Parameters In Routing

01:37

Navigating Routes

06:57

IQ - navigate() method

02:45

Task - Displaying Course Details And Fetching The Query Parameters

05:17

Introduction To Services

06:51

IQ - Introduction to Services

01:07

Dependency Injection

03:39

IQ - Dependency Injection

00:44

Providing Services

05:34

IQ - Providing Services

01:42

Injecting services using inject()

06:19

IQ - inject() function

01:17

Injecting Tokens

04:25

IQ - Injecting tokens

01:33

Injecting String Tokens

02:23

IQ - Injecting String Tokens

00:42

Injection Token Object

02:44

IQ - Injection Token Object

00:57

Providing Value With useValue

02:12

IQ - Providing Value With useValue

00:35

Task - Provide A Constant Value As Dependency

02:44

Alias Provider - useExisting Property

02:13

IQ - useExisting Property

00:25

Factory Provider - useFactory Property

02:22

IQ - useFactory Property

01:16

Providing dependencies using “deps” property with useFactory

03:51

IQ - Providing dependencies using “deps” property with useFactory

00:59

useFactory Vs useValue

03:04

Introduction To Angular Forms

02:36

Getting Started with Template-Driven Forms ngForm directive

04:13

IQ-ngForm directive

00:59

Task - Creating A Simple Submit And Reset Form

04:17

Template Driven Form

04:46

IQ-Template Driven Form

00:28

Understanding ReactiveFormsModule

02:41

IQ-ReactiveFormsModule

00:54

Understanding FormControl

05:01

IQ-FormControl

01:16

Understanding FormGroup

05:50

IQ-Understanding FormGroup

01:28

Dynamic Forms With FormArray

05:40

IQ-Dynamic Forms With FormArray

01:22

Understanding FormBuilder

01:52

IQ-FormBuilder

00:37

Validating Form Controls

05:31

IQ-Validating Form Controls

00:31

Task - Creating Multi Step Reactive Form With Bootstrap (Part 1)

05:02

Task - Creating Multi Step Reactive Form With Bootstrap (Part 2)

03:56

Task - Creating Multi Step Reactive Form With Bootstrap (Part 3)

08:25

Tracking Form Control States

04:34

IQ-Tracking Form Control States

00:44

Task - Multiple Validations On Password Field

04:52

Creating Custom Validators

05:02

IQ - Creating Custom Validators

00:51

Task - Custom URL Validator

05:56

Securing Routes With Route Guards

06:05

IQ - Route Guards

01:12

CanDeactivate Route Guard

06:37

IQ - CanDeactivate Route Guard

00:49

CanActivateChild Route Guard

05:11

IQ - CanActivateChild Route Guard

00:24

Task - Login Authentication

07:21

CanMatch Guard

05:03

IQ - CanMatch Guard

01:03

Introduction To Lazy Loading

01:50

Lazy Loading Of Components

06:46

Preloading of Components

05:10

IQ - Preloading of Components

01:29

Preloading Strategy (NoPreloading)

02:51

IQ - NoPreloading Strategy

00:28

Preloading Strategy (Custom Preloading)

06:01

IQ - Custom Preloading Strategy

01:30

Task - Preloading Based On User Roles

02:35

IQ - Preloading Vs. Lazy Loading

01:45

Deferred Loading

05:22

@defer with @placeholder

02:56

@defer with @loading

02:27

@defer with @error

01:27

Working with Triggers (on idle)

02:49

Working with Triggers (on viewport)

04:44

Working with Triggers (on interaction)

01:31

Working with Triggers (on hover)

02:01

Working with Triggers (on immediate)

01:07

Working with Triggers (on timer)

01:07

Prefetching of @defer blocks

02:05

Defining Custom Triggers

03:27

Understanding Observables & RxJS

06:16

IQ - Observables & RxJS

01:03

Managing Observables & Subscribers

07:15

IQ - Managing Observables & Subscribers

01:03

Unsubscribing an Observable

04:55

IQ - Unsubscribing an Observable

01:02

Understanding Async Pipe

05:13

IQ - Understanding Async Pipe

00:54

Task - Fetching JSON Data With Async Pipe

04:27

Hot Observable Vs Cold Observable

05:55

RxJS { of } Operator

02:58

IQ - RxJS { of } Operator

00:23

RxJS { from } Operator

01:56

IQ - RxJS { from } Operator

00:59

RxJS { interval } Operator

03:11

RxJS { timer } Operator

03:43

Task - Implementing a loading spinner

03:07

RxJS { EMPTY } Operator

02:38

IQ - RxJS { EMPTY } Operator

00:57

RxJS Pipeable Operators

03:00

IQ - RxJS Pipeable Operators

01:10

RxJS { filter } Operator

03:32

RxJS { map } Operator

04:43

IQ - RxJS { map } Operator

00:44

RxJS { mergeMap } Operator

02:38

IQ - RxJS { mergeMap } Operator

01:17

Task - Displaying the Products Associated With User

02:42

RxJS { concatMap } Operator

03:56

IQ - concatMap() operator

01:06

RxJS { switchMap } Operator

04:13

IQ - RxJS { switchMap } Operator

00:23

Making HTTP Calls With HttpClient

05:46

Making HTTP Calls With Observable

02:38

Implementing HTTP POST Request

05:20

Modifying Data With PUT Request

04:47

Removing Data With DELETE Request

03:41

Task - CRUD App - Displaying Products With GET Request (Part 1)

05:45

Task - CRUD App - Adding Products With POST Request (Part 2)

06:02

Task - CRUD App - Fetching Products Data Before Updating (Part 3)

06:37

Task - CRUD App - Updating Products With PUT Request (Part 4)

03:27

Task - CRUD App - Deleting Products With DELETE Request (Part 5)

03:54

Introduction to Signals

01:59

Creating Signal

03:44

IQ - Creating Signal

01:05

Updating Signal Value

03:10

IQ - update() method

01:30

Task - To-do List

07:45

Computed Signals

04:13

IQ - Computed Signals

01:35

Understanding effect() function

04:55

Cleaning up the effect()

05:15

Untracking Signals

05:07

Task - Updating The Cart using Signals

07:31

Linked Signals

04:53

Converting Observable To Signal

03:53

Task - Filtering Products Based on User Input with linkedSignal() - Pt1

08:00

Task - Filtering Products Based on User Input with linkedSignal() - Pt2

04:59

Task - Filtering Products Based on User Input with linkedSignal() - Pt3

03:39

Introduction - CSR, SSR & SSG

02:23

Understanding The Initial Deployment Phase

04:28

Discussing the CSR and SPA’s

03:48

SPA Deployment

05:10

From Client To Server-Side - SSR Migration

05:36

Serving the SSR App

02:35

Optimizing Code for Server-Side Rendering (SSR)

04:14

Understanding Static Site Generation(SSG)

02:17

Implementing SSG

05:01

Understanding Hybrid Rendering

07:42

Introduction to Change Detection

06:05

Expression Errors while Detecting Changes

02:44

Optimizing Code for Change Detection

05:41

IQ - Optimizing Code for Change Detection

01:28

Change Detection with OnPush Strategy

05:25

Change Detection with Inputs

04:06

OnPush + Signals: Understanding Component Data Sharing

04:40

OnPush + Signals: Problem with Cross-Component Data Sharing

02:37

Manual Change Detection - RxJS Subjects

05:44

Using Async Pipe with BehaviorSubject

02:27

Implementing Zoneless Change Detection

05:27

Introduction & Definition

02:40

Setting up the Environment

02:24

Installing & Configuring Tailwind CSS

02:56

Creating Header Component

04:47

Adding Search Bar

04:59

Category Dropdown in Search Bar

02:34

Adding Login link, Wishlist & Cart icons

03:54

Adding a Category Navigation Bar

05:27

Creating Home Component

02:55

Reorganizing Header & Category Navigation Components

01:22

Creating Error 404 Page

05:23

Creating Side Navigation Component - Pt1

09:35

Creating Side Navigation Component - Pt2

04:05

Fetching data into side navigation component

08:08

Creating Products Component

02:02

Styling Product Card

04:20

Fetching Data Into Products Component

05:44

Adding Ratings for Each Product

09:51

Creating Database with MySQL

08:37

Creating a Node Server

02:58

Configuring API Route

02:42

Configuring nodemon with eStore server

01:52

Connecting to MySQL Database

05:06

Fetching Data with SQL Query

02:41

Removing the getConnection() Call

02:25

Creating Routes with Express

02:38

Configuring Routes with “express.Router()"

01:39

Fetching Categories from Server

06:48

Fetching Categories in Category Navigation Bar

03:44

Introducing State Management

12:00

Connecting Store to the UI

04:36

Populate Header Search Categories

02:21

Define Routes to Fetch Products

07:06

Fetching Products on the Client-Side

03:17

Server-Side Category Filtering

08:14

Adding Products Store

06:38

Products Filter on Side Navigation Bar

07:56

Products Filter on Category Navigation Bar

03:07

Adding Keywords in Database

04:22

Find Products Using Search Box

07:44

Displaying “No Products Found” Message

02:46

Lazy Loading Home & Products

05:31

Defer Loading the Product Images

02:38

Creating Product Details Component

05:39

Making the UI Dynamic on Route Change – Product Details Page

07:17

Dynamic Product Detail Rendering

09:43

Implementing Shopping Cart - Part 1

10:29

Implementing Shopping Cart - Part 2

03:17

Implementing Shopping Cart - Part 3

06:27

Creating Shopping Cart Component

06:58

Displaying Products Inside The Cart

04:08

Implementing Quantity Update and Product Removal - Part 1

03:11

Implementing Quantity Update & Product Removal - Part 2

09:32

Cart Summary & Session Storage

09:37

Creating User Signup API

10:57

Starting with User Signup Form

06:32

Creating User Signup Form

03:56

Adding Validations in User Signup Form

05:10

Implement Same Password Validation

04:01

Connect Signup Form to API - Part 1

10:14

Connect Signup Form to API - Part 2

03:21

Creating User Login API

09:38

Starting with User Login Form

07:27

Connecting User Login Form to API

09:27

Building a Reactive User Menu After Login

09:57

Creating User Logout Option

03:42

Adding Logout Functionality

08:57

Display Delivery Address in Checkout Screen

08:05

API To Save Authenticated Orders- Part 1

03:05

API To Save Authenticated Orders- Part 2

07:40

API To Save Authenticated Orders- Part 3

04:48

Creating order service

07:43

Saving Order From Cart

07:36

API to Get Orders List

10:34

Creating Past Orders Component

05:57

Displaying the Past Ordered Products

08:39

Connecting Order Service with Past Order Component

08:05

Implementing AuthGuard

04:15

Introduction to Stripe Payment Gateway

01:57

Creating a Stripe Account

02:41

Configuring Stripe with Node.js

07:35

Configuring Stripe with Angular - Environment Setup

03:08

Creating Stripe Service

07:09

Configuring Stripe Inside the Cart

07:28

Saving Orders on Successful Payment

01:30

Storing & Displaying the Past Order Details

05:13