Angular 17 Developer Table of Contents

    
Table of Content
 

 

Introduction

  • Intro
  • Angular CLI
  • Understanding Project Structure
  • NG17-Introduction to Angular 17
  • Getting started with Angular 17
  • Migrating to Angular 17

Angular Fundamentals

  • First Component With Architecture
  • Displaying Message Dynamically
  • Assignment (Display sum of two values)
  • Understanding the @NgModule
  • NG17-Bootstrapping & Utilizing Standalone
  • Property Binding
  • Assignment (Property binding with image tag)
  • Event Binding with Click Event
  • Binding Other Mouse Related Events
  • Binding Keyboard Events
  • $event object
  • Assignment (Checking shift key status)
  • Two Way Binding (ngModel)
  • Assignment (Two-way Binding) - Get input field value on button click
  • Assignment (Creating counter example)

Angular Directives

  • Directives Introduction
  • Structural Directives (ngIf)
  • Assignment - Implementing show & hide functionality with ngIf
  • NG17-Control Flow Statements (@if & @else)
  • Structural Directives (ngFor)
  • Assignment - Displaying list items on button click using ngIf and ngFor
  • NG17-Control Flow Statements @for loop
  • Structural Directives (ngSwitch)
  • Assignment - Implementing age validation functionality using ngSwitch
  • Attribute Directives [ngClass]
  • NG17-Control Flow Statements (@switch)
  • Assignment - ngClass
  • Attribute Directives - [ngStyle]
  • Assignment - Changing the color of input field using [ngStyle]
  • Grouping elements with ng-container
  • HTML templates with ng-template
  • ng-template vs ng-container
  • Assignment - Displaying message if the input field remains empty
  • Rendering templates with ngTemplateOutlet - Part 1
  • Rendering templates with ngTemplateOutlet - Part 2
  • Assignment - Portfolio Builder (Phase 1) - HTML
  • Assignment - Portfolio Builder (Phase 2) - CSS
  • Assignment - Portfolio Builder (Phase 3) - Binding

Component Life Cycle - Lifecycle Hooks

  • Introduction
  • Component Creation Hook - ngOnChanges()
  • Understanding SimpleChanges Object
  • Component Creation Hook - ngOnInit()
  • Detecting Custom Changes With ngDoCheck() Hook
  • Understanding the ngAfterContentInit() Hook
  • Checking The Content With ngAfterContentChecked() Hook
  • Loading Content With ngAfterViewInit() Hook
  • Checking The Component View With ng AfterView Checked() Hook
  • Destroying Component With ngDestroy() Hook

Decorators

  • Introduction To Decorators
  • Class Decorators - @NgModule
  • Class Decorators - @Component
  • Property Decorators - @Input
  • Assignment @Input Decorator
  • Property Decorators - @Output
  • Assignment - Implementing Parent-Child Data Sharing using @Input & @Output
  • Property Decorators - Accessing Child Components With @ViewChild
  • Property Decorators - Accessing The Projected Content With @ContentChild
  • Property Decorators - Binding Properties With @HostBinding
  • Method Decorators - Binding Events With @HostListener
  • Assignment - Implementing Color Picker
  • Parameter Decorators

Angular Pipes

  • Pipes - Introduction
  • Assignment - Implementing the Built-In Pipes
  • Understanding Slice Pipe
  • Assignment - Page Navigation using Slice Pipe (Part 1)
  • Assignment - Page Navigation using Slice Pipe (Part 2)
  • Understanding Number Pipe
  • Assignment - Pound(lbs) to Kg Converter Using Number Pipe
  • Understanding JSON Pipe
  • Assignment - Displaying Table Data To JSON String

Custom Pipes

  • Creating Custom Pipes
  • Assignment - Custom Pipe for Sorting Numbers
  • Assignment - Creating Custom Pipe For Letter Count
  • Pure Vs. Impure Pipe
  • Using Impure Pipes

Angular Routing

  • Routing - Introduction
  • Understanding Router Module Structure
  • - Creating a Simple Route
  • Creating a Navigation Link with "routerLink" Directive
  • Assignment - Creating a Navbar Using Routes
  • Passing Route Parameters (Dynamic Routing)
  • Wildcard Routes - Displaying the 404 Page
  • Understanding Nested Routes
  • Assignment - Creating a Multi-Level Menu
  • Redirecting Routes
  • Understanding forRoot and forChild in Routing
  • Understanding ActivatedRoute
  • Query Parameters In Routing
  • Assignment - Displaying Course Details and Fetching the Query Parameters

Angular Services

  • Introduction to Services
  • Dependency Injection
  • Providing Services

Angular Tokens

  • Injecting Tokens
  • Injecting String Tokens
  • Injection Token Object
  • Providing Value With "useValue"
  • Assignment - Provide A Constant Value As Dependency
  • Alias Provider - useExisting Property
  • Factory Provider - useFactory Property
  • Providing Dependencies Using "deps" Property With useFactory
  • useFactory Vs. useValue

Angular Template Driven Forms

  • Introduction to Angular Forms
  • Understanding ngForm Directive
  • Assignment - Creating A Simple Submit And Reset Form
  • Template-Driven Form

Angular Reactive Forms

  • Understanding FormControl
  • Understanding FormGroup
  • Dynamic Forms With FormArray
  • Understanding FormBuilder
  • Validating Form Controls
  • Creating Multi Step Reactive Form With Bootstrap (Part 1)
  • Creating Multi Step Reactive Form With Bootstrap (Part 2)
  • Creating Multi Step Reactive Form With Bootstrap (Part 3)
  • Tracking Form Control States (Dirty and Pristine Properties)
  • Multiple Validations On Password Field

Custom Form Validators

  • Creating Custom Validators
  • Custom URL Validator

Route Guards

  • Securing Routes With Route Guards
  • CanDeactivate Route Guard
  • CanActivateChild Route Guard
  • Assignment - Login Authentication
  • Loading Modules with CanLoad Route Guard
  • CanMatch Guard

Lazy Loading

  • Introduction to Lazy Loading
  • Lazy Loading Of Modules
  • Preloading Of Modules
  • Relative Question - Preloading Vs. Lazy Loading
  • NG17-Deferred Loading
  • NG17-@defer with @placeholder
  • NG17-@defer with @loading
  • NG17-@defer with @error
  • NG17-Working with Triggers (on idle)
  • NG17-Working with Triggers (on viewport)
  • NG17-Working with Triggers (on interaction)
  • NG17-Working with Triggers (on hover)
  • NG17-Working with Triggers (on immediate)
  • NG17-Working with Triggers (on timer)
  • NG17-Prefetching of @defer Blocks
  • NG17-Defining Custom Triggers

Observables & RxJS

  • Understanding Observables & RxJS
  • Managing Observables & Subscribers
  • Unsubscribing an Observable
  • Understanding Async Pipe
  • Assignment - Fetching JSON Data With Async Pipe

RxJS Operators

  • RxJS {of} Operator
  • RxJS {from} Operator
  • RxJS {interval} Operator
  • RxJS {timer} Operator
  • Assignment - Implementing a Loading Spinner with Timer Operator
  • RxJS {empty} Operator
  • RxJS Pipeable Operators
  • RxJS {filter} Operator
  • RxJS {map} Operator
  • RxJS {mergeMap} Operator
  • Assignment - mergeMap() - Displaying the Courses Associated With User
  • RxJS {concatMap} Operator
  • RxJS {switchMap} Operator

Handling HTTP Calls With Angular

  • Making HTTP Calls With HttpClient
  • Making HTTP Calls With Observable
  • Implementing HTTP POST Request
  • Modifying Data With PUT Request
  • Removing Data With DELETE Request
  • CRUD App#1 Displaying Products With GET Request
  • CRUD App#2 Adding Products With POST Request
  • CRUD App#3 Fetching Products Data Before Updating
  • CRUD App#4 Updating Products With PUT Request
  • CRUD App#5 Deleting Products With DELETE Request

Signals - Angular 16

  • Introduction to Signals
  • Creating Signal
  • Updating Signal Value
  • Mutating A Signal
  • To-Do List Assignment
  • Computed Signals
  • Understanding effect() Function
  • Untracking Signals
  • Assignment - Updating The Cart Using Signals

Angular - 17 [All Lectures Collection]

  • Introduction to Angular 17
  • Getting Started With Angular 17
  • Bootstrapping & Utilizing Standalone
  • Control Flow Statements @for Loop
  • Control Flow Statements (@if & @else)
  • Control Flow Statements (@switch)
  • Deferred Loading
  • @defer with @placeholder
  • @defer with @loading
  • @defer with @error
  • Working with Triggers (on idle)
  • Working with Triggers (on viewport)
  • Working with Triggers (on interaction)
  • Working with Triggers (on hover)
  • Working with Triggers (on immediate)
  • Working with Triggers (on timer)
  • Prefetching of @defer Blocks
  • Defining Custom Triggers

eStore Project

  • Introduction
  • eStore Project Creation
  • Installing Bootstrap
  • Beginning Header Component
  • Adding Search Bar
  • Category Dropdown in Search Bar
  • Login Link, Wish-list, and Cart Icons
  • Category Navigation Bar
  • Creating Home Component
  • Reorganizing Header and Category Navigation Components Hierarchy
  • Creating Error 404 Page
  • Side Navigation Component
  • Fetching Data into Side Navigation Component
  • Products Component
  • Styling Product Card
  • Fetching Data into Products Component
  • Creating Ratings Component
  • Installing MySQL
  • Creating Database
  • Creating Node Server
  • Configuring API Route
  • Configuring Nodemon
  • Connecting To MySQL
  • Data Fetching with SQL Query
  • Removing getConnection() Call
  • Creating Routes With Express
  • Configuring Routes with "express.Router()"
  • Creating Workspace
  • Fetching Categories From Server
  • Fetching Categories in Category Navigation Bar
  • Introducing State Management
  • Populate Header Search Categories
  • Define Routes to Fetch Products
  • Fetching Products in Products Component
  • Query Parameters to Filter Products by Category
  • Add Products Store
  • Filter Products From Side Navigation Bar
  • Filter Products From Category Navigation Bar
  • Adding Keywords In Database
  • Find Products Using Search Box
  • Lazy Loading Home Module and Products Gallery Component
  • Creating Product Details Component
  • Implementing Shopping Cart - Part 1
  • Implementing Shopping Cart - Part 2
  • Creating Shopping Cart Component - Part 1
  • Creating Shopping Cart Component - Part 2
  • Cart Summary and Session Storage
  • User Signup API
  • Starting User Sign Up Form
  • Adding Validations in User Sign Up Form
  • Connect Sign Up Form to API
  • User Login API + Introduction to JWT
  • User Login Form
  • Connect User Login Form to API
  • Create User Drop Down Menu
  • Adding Logout Functionality
  • Display Delivery Address In Checkout Screen
  • Creating API to Save Order
  • Creating Order Service
  • Saving Order From Cart
  • API to Get Orders List
  • Creating Past Orders Component
  • Displaying Past Orders and Route Guard

Angular Testing

  • Intro - Why Testing? Manual Vs Automated
  • Unit Vs. Integrated Vs. End to End
  • Jasmine & Karma - First Test
  • Jasmine before() and after() Methods
  • Unit Tests for Rating Component
  • Spies and Mocks
  • Unit Testing Forms
  • Unit Testing Routes
  • Unit Testing HTTP Services
  • Integration Test
  • Code Coverage


Apply for Certification

https://www.vskills.in/certification/angular-15-developer-certification-course

 For Support