Angular 19+ Training Syllabus
Reactivity & Signals
- Reactivity & Change Detection
- ZoneJS in Angular Applications
- Problems with ZoneJS
- Zoneless Applications
- Signals
- Create, set and update signals
- Writable and Read-only signals
- Computational Signals
- Advantages of Computational Signals
- Effects
- Creating and Running Effects
- Automatically and Manually destroyed effects.
- Signal values equality for complex data
- Untracking Dependencies
- Cleanup Functions
Angular 19+ Features
- Stand Alone Components
- Stand Alone Components vs Modules
- Dependency Injection using inject
- inject vs legacy DI methods
- Control flows
- @if @for @switch
- Deferable views using @defer
- New ways to create Route Guards
- New ways to create HTTP Interceptors
- DI through routes
- Different Rendering Methods
- Server Side Rendering (SSR)
Introduction
- Introduction to web development
- Traditional vs Modern Web Development
- Traditional Servers vs Node JS
- Old and Modern JavaScript
- Issues with ES5 JavaScript
- ES5 vs ES6 JavaScript
- Why to use & Advantages of TypeScript
- Angular 19+ vs Previous versions
- Current Angular Development Scenario
TypeScript
- Typing System
- TypeScript Types
- Enums, Consts & Type aliases
- Arrays Types
- Functions
- Optional, Default parameters
- Fat Arrow Functions
- Interfaces
- Object Oriented Programming
- Classes and Class Constructors
- Properties, Methods, Getters and Setters
- Generics and Decorators
Introduction to Angular
- Introduction to Angular
- Installing Angular CLI
- Creating Angular Application
- Running Angular Application
- Angular Application Structure
- Global Configuration Files
- Roles in Angular Application
- Installing third party libraries
- Legacy Angular Modules
Components
- Introduction to Components
- Role of a Component
- Stand Alone Components
- Old vs New (v19+) Components
- Component Life Cycle
- Life Cycle Methods
- OnInit, OnChanges
- OnViewInit, OnContentInit
- DoCheck, OnDestroy
- Constructor vs OnInit
- Creating Custom Components
- Parent & Child Components
- Re-usable Components
Data Bindings
- Angular Data Bindings
- String Interpolation
- Property & Event Bindings
- Two Way Data Binding
- Template Variables
- Component Communications
- Input and Output
- ViewChild, ViewChildren
- ContentChild, ContentChildren
- Content Projection
- Events and Event Emitters
- Listening to Event Emitters
- Container & Presentational Components
- Smart & Dumb Components
Directives
- Angular Directives
- Attribute Directives
- Built-In Attribute Directives
- Structural Directives
- Built-In Structural Directives
- New Directives
- @if – @for – @switch
- Old NgIf, NgFor and NgSwitch Directives
- ng-container
- ng-template and template outlets
- ng-template context
- Custom Directives
- Element Refs, Renderers
- Host Binding, Host Listeners
Pipes
- What are Pipes
- Built-In Angular Pipes
- Currency Pipe
- Number Pipe
- Percent Pipe
- Lower and Upper Case Pipes
- Date Pipe
- Async Pipe
- Custom Pipes
- Custom pipe with parameters
- Pure and Impure Pipes
- Improving application performance using pipes
Services
- What are Services in Angular
- Injectable Services
- Dependency Injection
- DI with inject function
- Singletons
- Export and Import Services
- Shared Services
- Providing Services
- Services at Component Level
- Global Services
- root, any, platform options
- useFactory, useClass & useValue
Template Driven Forms
- Forms Module
- Template Driven Forms
- NgForm & NgSubmit
- NgModel and Two way Bindings
- Form Validations
- Touched & Untouched states
- Pristine & Dirty states
- Valid and Invalid
- Form Submit
- Password & Confirm Password Validations
- Handling Check Boxes & Radio Buttons
- Handling Select, Range inputs
Reactive Forms
- What are Reactive Forms
- Reactive vs Template Driven Forms
- Form Group
- Form Control
- Form Array
- Form Builders
- Form Validators
- Required, Min, Max, Pattern Validators
- Sync vs Async validators
- Custom Validators
- Custom Async Validators
- Subscribing to Form Values
- Setting & Patching the Forms
- Resetting the Form
- Form Status & Status Changes
- Handling Check boxes, Radio Buttons, Select options, Ranges etc.,
- Dynamically Generating Input Fields
HTTP & RxJS
- HTTP Module
- Promises
- Reactive Programming
- Observables & Observers
- Subscriptions
- Subject
- Behavior Subject
- Replay Subject
- Get, Post, Put, Patch & Delete Requests
- Error Handling & HttpErrorResponse
- Working with APIs
- Http Headers
- Authorization & JWT
- HTTP interceptors
Routes
- What are Routes
- How to Configure Routes
- Router Outlet
- Router Link & Navigation
- SPA (Single Page Application)
- Activated Routes
- Route Parameters
- Subscribing to route parameters
- Query Parameters and subscribing to them
- Accessing Route Params using Input
- Programmatic Navigation
- Route Guards
- Implementing Can Activate Guard
- Implementing Can Deactivate Guard
- Child Routes
- Eager Loading
- Lazy Loading
- Pre Loading
- Custom Preloading Strategy
- Passing Services through Routes