TypeScript, Angular, Firebase & Angular Material Masterclass

• NodeJS Installed
• Basic knowledge of NodeJS, NPM, node_modules
• We’ll use AngularCLI, so make sure that it’s installed as well.
• We’ll use Visual Studio Code as our IDE
• You should know JavaScript
• Experience with Object Oriented Programming is a plus

Description

Following is the Curriculum followed in this course:

1. TypeScript, Angular Application Architecture and Angular CLI
2. Angular Modules and Angular Components.
3. Angular’s Component LifeCycle Hooks
4. Dependency Injection In Angular
5. Routing
6. Services
7. Directives
8. Pipes
9. Forms
10. Custom Decorators
11. Angular Material
12. Firebase

TypeScript, Angular Application Architecture and Angular CLI

• What is a Single Page Application
• Why Angular
• Types
• Let, Const
• Class, Interface
• Fat Arrow Functions
• Decorators Modules
• What is Angular CLI and how to use it. Basic tasks (ng serve/build/test, ng generate component/service/directive/pipe)
• Architecture of Angular Applications Built using Angular-CLI
• Change Detection strategy (Zones) – Theoretical

Angular Modules and Angular Components

• @NgModule
• Angular Application Bootstrap Mechanism
• @Component
• Data/Property Binding
• View Encapsulation
• Inter-component Communication (@Input/@Output, Event Emitter)
• Template variables (ViewChild/ContentChild)
• Content Projection(ng-content)
• Templates – will be covered as part of components
• Metadata – basic overview
• Lifecycle hooks
• Order and triggering of each hook
• Hooks specific to Components and Decorators

Dependency Injection(Providers)

• Dependency Injection – Why?
• Dependency Injection – As a design pattern
• Dependency Injection – As a framework
• Dependency Injection – What?
• Injectors and Providers
• Hierarchical Dependency Injection

Routing

• Child routes
• Route params
• Route Guards – CanActivate, CanActivateChild, CanDeactivate, Resolve, CanLoad

Services(@Injectable)

• Service as a singleton, data sharing.
• HttpClient, HttpHeaders, HttpParams
• Observables with Operators like map, subscribe, catch, retry etc
• Subjects
• Sharing data across Components using Service

Directives(@Directive)

• Built In Structural Directives – NgFor, NgIf, NgSwitch
• Built In Attribute Directives – NgClass, NgStyle, NgNonBindable
• Building a Custom Structural Directive
• Building a Custom Attribute Directive

Pipes(@Pipe)

• Build in Pipes
• Building Custom Pipes
• Pure and Impure Pipe

Forms

• Template Driven Forms
• Reactive forms
• Form Validations
• Custom Synchronous form validations
• Custom Asynchronous form validations

Custom Decorators

• Metadata – deep dive
• Building Custom Class Decorator
• Building Custom Property Decorator

Integrating with Third Party Libraries

• Material Design Bootstrap
• Angular Material
• Firebase