Total Duration 30 Hours

Day 1

2 Hrs

Day 2

2 Hrs

Day 3
2 Hrs
Day 4

2Hrs

Day 5

2 Hrs

2Hrs

Day 6

2Hrs
Day 7 2Hrs

Day 8
2Hrs

Day 9 2 Hrs

Day 10
2 Hrs

2Hrs
Day 11
2Hrs

Day 12

2 Hrs

Day 13
2Hrs

2 Hrs
Day 14
2 Hrs

2 Hrs
Day 15
Angular 10
Module 1
Module 1 - Session - 1
Angular 9l Introduction
Why Angular
User Experience similar to a Desktop Application
Productivity and Tooling
Performance
Community
Full-featured Framework
Platform for Targeting Native Mobile not just Web Browsers
Understanding Angular Versions
New Feature in A10 and latest versions
Module 1 - Session - 2
What is Typescript
Why Typescript
Setup and installation
IDE support
Scoping using Let and Const Keywords ( ES6 )
Template Literals ( ES6 )
Spread Syntax and Rest Parameters ( ES6 )
Destructuring ( ES6 )
Power of Types
Type inference
Type Annotations
Number
Boolean
String
Array
Tuple
Enum
Any
Void
Null and Undefined
Never (Typescript 2)
Module 1 - Session - 3
Functions
Classes
Interfaces
Modules
Decorators
Module 1 - Session - 4
Angular CLI
Anatomy of the project
Debugging Angular apps
Working with Augury
AOT Benefits
Modules
Components
Templates
Metadata
Data binding
Directives
Services
Dependency injection
Module 2
Module 2 - Session - 1
Angular Module/Lib/Component
HTML as template
Data binding
Interpolation
Property Binding
Event Binding
Two-way binding
Template expressions
Template syntax
Attribute, class and style bindings
@Input()
@Output
Template reference variables
Safe navigation operator
Module 2 - Session - 2
Angular Directive
Built-in directives
Structural directive NgIf, NgFor, NgSwitch
Attribute directive NgClass, NgStyle, NgModel
@Directive decorator
Module 2 - Session - 3
Pipes
Built-in pipes
@Pipe decorator
Custom pipe development
Use Async pipe for saving Memory bytes
Forms
@angular/forms library
Template driven forms
Form and field validation
Validation check with ng-pristine,ng-dirty, ng-touched, ng-untouched, ng-valid, ng-invalid
Show and hide validation error messages
Form submission with ngSubmit
Module 2 - Session - 4
Reactive/ Model drive forms
ReactiveFormsModule
FormGroup, FormControl classes
FormBuilder for easy form building
Validations using Validators
Setting form model using setValue and patchValue
Use FormArray to build repeated from controls or form groups
Bootstrap 4 feature & component
Module 2 - Session - 5
Dependency Injection
@Injectable decorator
Custom service development
Registering the service with NgModule using providers key
Provider Types
Class
Factory
Value
Module 3
Module 3 - Session - 1
Routing & Navigations
@angular/router library
Configure routes
RouterModule.forRoot and RouterModule.forChild
View child VS Content child
RouterOutlet, RouterLink, RouterLinkActive
Nested Routes
Parametrized routes
Route guards
Router events
Module 3 - Session - 2
RxJS Primer
Why RxJs
Observable interface
Promise
Observable VS Promise
Streams
Operators
Subscription
Subject
Schedulers
Module 3 - Session - 3
HTTP Deprecates & HttpClient
Setup installing the module
Making a request for JSON data
Typechecking the response
Reading the full response
Error handling
Requesting non-JSON data
Sending data to the server
Making a POST request
Configuring other parts of the request
Working with HTTP interceptors for better error handling in http requests
New features in angular cli - ng update, ng add
Angular Elements
Updates to @angular/material
CLI workspaces
Building libraries
Tree shakable providers
RxJs 6 Support
Module 3 - Session - 4
Angular 10 Testing
Testing in Typescript
Testing Component
Testing Service/Provider
Testing Pipe
PWA with Angular 10
Introduction of PWA
Function of PWA Application (service workers, offline storage, browser’s device API)
Browser dependencies (PWAs on Apple vs Android devices) 
Add add @angular/material for Angular PWA development
Analyze The Application Using Lighthouse
SCSS In Angular
1. Variable in Scss
2. Inheritance
3. Mixing
4. Import

Jasmine, Karma
Jest framwork for angular unit testing
Module 4
Module 4 - Session - 1
Angular 10 Security
Angular integration with Java Springboot security
Introduction of Angular 9 build in protections
Preventing cross-site scripting (XSS)
Server-side XSS protection
HTTP-level vulnerabilities
Module 4 - Session - 2
Angular 10 Deployment
Using the Angular CLI with Ahead-Of-Time (AOT) Compilation and Tree-Shaking (removing unused library code)
Angular Bundling
NGRX – Store, Effects etc.
Module 4 - Session - 3
Angular Material UI component library
Angular Chart and Graph Library
Responsive Web Design built in
Interactive Panning and Zooming with Mouse, Keyboard and Touch
Full Control of Chart Animation
Chart Drill-Down Events
Real-Time Streaming Support
High-Volume (Millions of Data Points) Support
Trends Lines and other Data Analysis features
Module 4 - Session - 4
Jenkins deployment
Module 4 - Session - 5
Migrate Angular project to higher version
Major project development
Basic

Basic
Basic
Basic
 Basic

Advanced