The Complete Angular Course 2022: From Zero to Expert!

Course Curriculum

Chapter 1: Introduction

Lecture 1: Introduction: What is Angular

Lecture 2: Why should you learn Angular

Chapter 2: Angular development system setup and first application

Lecture 1: Install the required software and tools

Lecture 2: Create first angular application

Lecture 3: Create multiple application in one project (Workspace)

Chapter 3: Angular application structure

Lecture 1: Best way to learn Angular structure with a real life example

Lecture 2: package.json vs package-lock.json and node_modules

Lecture 3: Angular project folders and files

Chapter 4: Components

Lecture 1: Role of component and module

Lecture 2: how to create a new component

Lecture 3: Custom prefix in the component selector

Lecture 4: Interpolation (Display data dynamically on HTML UI)

Lecture 5: Event Binding in Angular

Lecture 6: Property binding in Angular

Lecture 7: Class binding in Angular

Lecture 8: Attribute binding in Angular

Lecture 9: Style binding in Angular

Lecture 10: Template reference variable in Angular

Lecture 11: *ngIf in Angular

Lecture 12: If else in Angular

Lecture 13: For loop in HTML Template using *ngFor Directive (Index, First, Last, Even, Odd)

Lecture 14: Improve for loop performance using trackBy function

Lecture 15: Switch Case statement in HTML Template using ngSwitch & ngSwitchCase directive

Chapter 5: Create new Real time Book-Store application

Lecture 1: Setup the GitHub repo

Lecture 2: Add multiple modules and components

Chapter 6: Routing

Lecture 1: Introduction to Angular Routing

Lecture 2: Setup routing in new angular application

Lecture 3: Routing with multiple modules and components / Nested routing

Lecture 4: Separate routing modules for feature modules

Lecture 5: Multiple router-outlet

Lecture 6: Pass parameters in the route

Lecture 7: routerLink

Lecture 8: get params value from route using ActivatedRoute

Lecture 9: get params value in parent and child route

Lecture 10: get query string value from url

Lecture 11: set query string value

Lecture 12: navigate to other url from component file

Lecture 13: Angular 404 page not found

Lecture 14: redirectTo in angular route

Lecture 15: Lazy Loading Components in Angular

Chapter 7: UX Design in Angular using Bootstrap and Angular Material

Lecture 1: 3 ways to install bootstrap in angular

Lecture 2: How to install angular material in angular application

Lecture 3: Auto generate angular material components using schematics

Lecture 4: Upgrade (update) Angular 12 to 13

Lecture 5: Angular Material toolbar responsive

Lecture 6: Create a separate component for Angular Material toolbar

Lecture 7: Create separate module for angular material components

Lecture 8: Remove the dummy code from app (Code cleanup)

Lecture 9: Remove the dummy code from app (Code cleanup) | Part 2

Chapter 8: Services in Angular

Lecture 1: Create a service in angular app and display data

Lecture 2: Update the design of book card

Lecture 3: Difference between ProvidedIn "root" and "any"

Lecture 4: Service providers: useClass

Lecture 5: Service providers: useExisting

Lecture 6: Service providers: useValue

Lecture 7: Service provider: useFactory

Lecture 8: Working with getter and setter in Angular

Chapter 9: Different ways of communication between components

Lecture 1: What are the different types of relationships among the components?

Lecture 2: Pass data from parent to child using @Input property

Lecture 3: Use Getter & Setter with @Input decorator

Lecture 4: Pass data to child component using Template Reference Variable

Lecture 5: Access the Child component, directive & html element using @ViewChild()

Lecture 6: Pass data from Child to Parent component using @Output and EventEmitter

Lecture 7: Pass data between components using Service

Chapter 10: Component lifecycle in Angular

Lecture 1: What are Angular hooks | Methods for component life cycle

Lecture 2: ngOnChanges in Angular

Lecture 3: ngOnInit in Angular

Lecture 4: ngDoCheck in Angular

Lecture 5: ngAfterContentInit and ngAfterContentChecked with contentProjection

Lecture 6: ngAfterViewInit in Angular

Lecture 7: ngAfterViewChecked in Angular

Lecture 8: ngOnDestroy in Angular

Chapter 11: Angular Forms: Template driven approach to work with forms in Angular

Lecture 1: Introduction to Angular Forms

Lecture 2: Design first (basic) form using Template Driven Approach

Lecture 3: Save form data | Add new book using Template Driven Form

Lecture 4: Use Angular Material components to design the responsive form

Lecture 5: Using Angular Material Select & Toggle component in Angular form

Lecture 6: Using Angular Material DatePicker component

Lecture 7: 2 Way binding using ngModel in Template driven form

Lecture 8: How to check if Angular form is valid or invalid

Lecture 9: Display the validation message in template driven form

Lecture 10: Pristine, Dirty, Touched & Status in Angular form

Lecture 11: Display different error message for each failed validation

Chapter 12: Reactive forms in Angular

Lecture 1: Getting started with Reactive forms in Angular

Lecture 2: Working with Angular Nested FormGroup

Lecture 3: Validations in reactive form and set the default values of controls

Lecture 4: setValue() and patchValue() in Angular

Lecture 5: How to get value or reference of form control in Angular Reactive Form