Table of Contents
Angular and SPA
- Introduction to Single Page Applications (SPA)
- What do we need Angular for
- Setting up the Development Environment
- Angular Application Architecture
- First Angular App
TypeScript and ESNext
- Module Introduction and Introduction to TypeScript
- Setting up the environement to write TypeScript
- Variable declarations (var, let, and const)
- Types - Primitives
- Types - Reference and Special Types
- Operators - Spread and Backticks
- Operators - Destructure and Rest
- Classes
- Interface
- Arrow Functions
- Modules
- fetch
- async/await
Decorators, @NgModule, Angular Modules and App Bootstrap Mechanism in Angular
- Module Introduction and an overview of Angular Modules
- What are decorators?
- Angular Modules and the @NgModule Decorator
- declarations
- imports and exports
- providers, bootstrap, and entryComponents
- Angular Application Bootstrap Mechanism
@Component Decorator, Angular Components, Communication, and the Lifecycle Hooks
- Module Introduction
- Angular Components and the @Component Decorator
- Creating an Angular Component using the Angular CLI and on StackBlitz
- Component Decorator Metadata
- View Encapsulation - Emulated, ShadowDom, None
- Data Binding - String Interpolation - {{ }}
- Property Binding - []
- Event Binding - ()
- @Input and @Output Property Decorators
- Two-way Data Binding - [()]
- Attribute Binding - [attr.]
- Class Binding - [class.]
- Style Bindings - [style.]
- Introduction to Lifecycle Hooks in Angular
- Using Lifecycle Hooks in Angular
- View Queries - View Child, View Children, Content Child, Content Children
- Change Detection Mechanism in Angular. ZoneJS, NgZones
Angular Routing, Guards
- Introduction to Routing
- Implementing Routing in an Angular App
- Creating a User List. Setting the stage for Child Routing
- Abstracting the user link to a separate component
- Implementing Child Routes
- Path Match and Route Types
- Introduction to Route Guards in Angular
- CanActivate and CanActivateChild Guards in Angular
- CanDeactivate Guard in Angular
- Prefetching Data for a Component using Resolve
Dependency Injection (As a Pattern, As a Framework), Services, HTTP, Observables
- Introduction to Section
- DI as a Pattern, DI as a Framework and Types of Providers
- Hierarchical Dependency Injection
- Introduction to Services in Angular
- GET data from a Rest API using HttpClient
- CRUD Operations using HttpClient, HttpParams and HttpHeaders
- Observables and Operators in Observables - Map, Retry, Catch
- Behavior Subject and Sharing Data using Behavior Subjects
Directives and Pipes in Angular
- Introduction to Section
- Introduction to Directives
- Built in Structural Directives
- Built in Attribute Directives
- Building custom Attribute Directives
- Building Custom Structural Directives
- Introduction to Pipes in Angular
- Using Built In Pipes
- Creating Custom Pipes in Angular
- Pure and Impure Pipes in Angular
- Decorators Revisited
- Building Custom Decorators in Angular
- Building a Custom Lifecycle Hook Class Logger Decorator
- Building Custom Property Decorator in Angular
Forms in Angular
- Introduction to Section
- Types of Form Building Strategies in Angular
- Creating Long Bootstrap forms quickly using VS Code using Emmet
- Adding FormControl(s) to a Template Driven form using the ngModel directive
- Getting the JavaScript Object Representation of a form using ngForm directive
- Disabling the Submit Button on a Form using form's $invalid flag
- Getting the JavaScript Object Representation of a form in TypeScript Class
- Adding Checkbox, Radio Buttons and Select List to your Template Driven Form
- Creating Subsections in the form using NgModelGroup directive
- Steps to implement a Reactive form in Angular
- Quickly creating a Bootstrap form for our Reactive form using Emmet
- Creating a Reactive form in the TypeScript class & connecting it to the template
- Adding form Validations to a Reactive Form
- Dynamically Adding or Removing FormControl(s) or FormGroup(s) using FormArray(s)
- Adding Synchronous Custom Validations to your Reactive Form
- Adding Async Custom Validations to your Reactive Form
- Resetting the value of a form
Using Third Party Libraries and Frameworks like MDB, Angular Material & Firebase
- Introduction to the Section
- Creating an Angular CLI Project with SCSS as a base style
- Introducing Material Design Bootstrap into your Angular CLI Project
- Adding a Navbar in your header
- Adding Material Design Buttons
- Adding Cards
- Using Material Design Dropdowns and Form Inputs
- Introducing Angular Material into your Angular CLI Project on the top of MDB
- Adding Radio Buttons, Slide Toggle, Slider, Progress Bar and Spinner
- Introduction to Firebase
- Creating an App using the Firebase Console
- Setting up your Angular CLI Project to support Firebase
- Interacting with Firebase Realtime Database using methods on AngularFireList
- Adding and Reading Data from Realtime Database in Firebase
- Updating and Deleting Data from Realtime Database in Firebase
Apply for Certification
https://www.vskills.in/certification/web-development/angular-9-certification