Module 1: Introduction
Module 2: Why Angular?
- History of Angular
- The leap from AngularJS to Angular
- Desktop Application class User Experience
- Productivity and Tooling
- Performance
- Community
- Full-featured Framework
- Supported Browsers (Angular 11)
- Platform for Targeting Native Mobile, not just Web Browsers
Module 3: Deep Dive into TypeScript
- Introduction
- What is Typescript
- Why Typescript
- Setup and installation
- IDE support
- Scoping using let and const Keywords (ES6)
- Template Literals (ES6)
- Rest and Spread Parameters (ES6)
- Destructuring (ES6)
- Introduction to Types
- Type inference
- Type Annotations
- Number
- Boolean
- String
- Array
- Tuple
- Enum
- Any
- Void
- Null and Undefined
- Never
- Introduction to Functions
- Using types in functions
- Function as types
- Optional and default parameters
- Arrow functions
- Introduction to Classes
- Inheritance
- Access modifiers
- Getters and setters
- Read-only & static
- Introduction to Interfaces
- Optional properties and methods
- Strict structural contract
- Extending interface
- Implementing interface
- Introduction to Modules
- Import / Export
- Default
- Decorators
Module 4: Working with Angular CLI
- Angular CLI
- Anatomy of the project
- Setting up a workspace
- Updating Angular apps using ng update
- Adding support for external libraries using ng add
- Debugging Angular apps
- Working with Augury
- Using the Angular Language Service with Microsoft VSCode
Module 5: Nine Building blocks of Angular (Birds Eye View of Angular)
- Modules
- Components
- Templates
- Metadata
- Data binding
- Directives
- Services
- Dependency injection
- Angular Ivy
Module 6: Angular modules
- Why modules?
- How to create modules
- Built-in modules
- Root Module
- feature module
Module 7: Components
- Introduction
- @Component decorator
- Component configuration object
- Custom components
- Component with templates
- Inline
- External
- Component with Styles
- Inline
- External
- Angular Elements
Module 8: Templating
- HTML as template
- Data binding
Module 9: Interpolation
- Two-way binding
- Template expressions
- Template syntax
- Attribute, class, and style bindings
- @Input()
- @Output
- Template reference variables
- Safe navigation operator
Module 10: Directives
- Introduction
- Built-in directives
- Structural directive
- NgIf
- NgFor
- NgSwitch
- Attribute directive
- NgClass
- NgStyle
- NgModel
Module 11: Pipes
- Introduction
- Built-in pipes
- @Pipe decorator
Module 12: Forms
- Introduction
- @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
- 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
Module 13: Dependency Injection
- Introduction
- Why DI
- @Injectable decorator
- Custom service development
- Registering the service with NgModule using providers key
- Provider Types
- Class
- Factory
- Value
Module 14: Routing and Navigation
- Introduction
- @angular/router library
- Configure routes
- RouterModule.forRoot and RouterModule.forChild
- RouterOutlet, RouterLink, RouterLinkActive
- Nested Routes
- Parametrized routes
- Route guards
Module 15: RxJs Primer
- Introduction
- Why RxJs
- Observable interface
- Streams
- Operators
- Subscription
- Subject
- Schedulers
Module 16: Interfacing with backend services & APIs using HttpClient
- Setup installing the module
- Making a request for JSON data
- Type checking the response
- Error handling
- Sending data to the server
- Making a POST request
- Configuring other parts of the request
Module 17: Level up with Angular
- Creating Libraries
- Angular Material Essentials
- Lazy Loading
- Customizing the Angular CLI using the Builder API
- Server Side Rendering with Angular Universal
- Working with Service Workers
- Building a Progressive Web App
Module 18: Testing
- Introduction
- Testing in Typescript
- Testing Component
- Testing Service/Provider
- Testing Pipe
Module 19: Deployment
- Manual Deployment
- Deployment using the Angular CLI with Ahead-Of-Time (AOT) Compilation and Tree-Shaking (removing unused library code)
- Deployment Platforms for Angular Apps
Module 20: Capstone Projects
- Use Angular skills to build applications that provides details of famous hotels in multiple cuisines - a mini project like Wikipedia but limited to book details.
- Use Angular skills of React, Redux, and Redux Saga to build an online web application that sells technology courses online.