The Advanced Angular training course is designed to provide students with real-life experience using advanced topics of Angular web development.
The course will begin by discussing advanced topics related to building blocks, components, communication, lifecycle, and the component router. Students will then explore advanced topics in data binding, directives, and pipes. Next, the course will evaluate advanced services and HTTP clients as they relate to Angular. Finally, the course will discuss advanced topics related to forms, testing, and security. Throughout the course, students will work to build out an entire Angular web application.success.
Interpret the advanced concepts of Angular.
Utilize the Angular Command-line interface (CLI).
Build a web application using Angular.
Angular Essentials
Semantic versioning and release schedule
Angular CLI
Environments config
CLI: ng update, ng add and schematics
Modules and Build Process
Modules and ngModule
Module architecture: Feature modules
Module architecture: Shared module
Angular builds: AOT vs JIT - What to use for production
Build modes and environments
Introduction to Webpack
Should we use Webpack directly for custom builds?.
Components
What are components?
Template and expressions
Passing data to a component with @Input()
Practicing with Angular CLI
Component architecture best practices
Data Bindings
One-way data bindings
Expressions
Two-way data bindings with ngModel
Template syntax
Template reference variables
Directives
What are directives for?
Different kinds of directives
ngFor
ngIf
ngSwitch
ngClass and ngStyle
How to create a custom directive?
Data bindings in directives
Pipes
What are pipes for?
Pure and Impure pipes
How to create our own pipes?
Services and Dependency Injection
Purpose of services
Dependency injection in Angular
Injector Tree
Decorators for dependency injection: @Optional(), @Host(), @Self()
How to create a service?.
HTTP Client and Asynchronous Data
How to use the HTTP client?
What is a promise?
Introduction to RxJS
What is an Observable?
Writing our own Observable or Promise
RxJs operators
Examples of RxJs operators: max, merge, filter
Async pipe
Http Interceptor
Websockets in Angular
Component Communication and Lifecycle
How do components share data?
Strategies for component communication
@ViewChild() decorator
Introduction to the component lifecycle
Lifecycle hooks
Change detection strategies for performance optimization
Component Router
What is the component router?
Example of the component router in action
Child routes and route parameters
Guards for authentication and user rights
Lazy-loading with feature modules
Forms
How to handle forms with Angular?
Properties provided by Angular to validate forms
Template-driven forms and reactive forms
Form validation and submission
Custom form validator
Advanced Projects and Tools
Progressive web apps
Angular Custom Elements
Ivy renderer
Angular Material
Angular Universal or how to pre-compile on the server
Schematics
Angular Augury: Debugging Angular apps in Google Chrome
Testing Angular Applications
How to test Angular applications?
Karma and Jasmine
End to end tests with Protractor
Angular Test Bed
Mocking and stubbing with Jasmine and Angular
HTTP Client and Asynchronous Data
How to use the HTTP client?
What is a promise?
Introduction to RxJS
What is an Observable?
Writing our own Observable or Promise
RxJs operators
Examples of RxJs operators: max, merge, filter
Async pipe
Http Interceptor
Websockets in Angular
Component Communication and Lifecycle
How do components share data?
Strategies for component communication
@ViewChild() decorator
Introduction to the component lifecycle
Lifecycle hooks
Change detection strategies for performance optimization
Component Router
What is the component router?
Example of the component router in action
Child routes and route parameters
Guards for authentication and user rights
Lazy-loading with feature modules
Forms
How to handle forms with Angular?
Properties provided by Angular to validate forms
Template-driven forms and reactive forms
Form validation and submission
Custom form validator
Advanced Projects and Tools
Progressive web apps
Angular Custom Elements
Ivy renderer
Angular Material
Angular Universal or how to pre-compile on the server
Schematics
Angular Augury: Debugging Angular apps in Google Chrome
Testing Angular Applications
How to test Angular applications?
Karma and Jasmine
End to end tests with Protractor
Angular Test Bed
Mocking and stubbing with Jasmine and Angular
Security in Angular
How to prevent Cross-site Scripting attacks (XSS)
Best practices and things to avoid
Trusting values with the DOMSanitizer
Prevent HTTP attacks
Security audits of Angular applications
State Management and Redux
What is state management?
Redux: Core concepts and principles
Redux Store
NgRx: Redux for Angular
NgRx: Reducer, Store, Actions and Effects
Resources and Best Practices
How to include external libraries
How to use angular.io (cheatsheet, etc.)
Style guide and best practices
Official Angular blog
Web developers experienced in Javascript wanting to understand more advanced topics for web development using Angular.