Angular 6
Angular provides dependency injection, particularly useful for assembling data services for applications, along with use of an HTML template to compose components. In Angular, developers still compose components with an HTML component that connects to TypeScript code for imperative parts of the program.
Angular 6 Features:
Angular 6 has a smaller footprint, features some great new functionality including more command-line optimisations, updated Typescript support, and many more under-the-bonnet fixes and enhancements.
Duration:
Course Content:
Module 1: Introduction
- Angular 6 Introduction
Module 2: 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
Module 3: Understanding Angular Versions
- AngularJS (Angular 1.x)
- Angular
- Angular 2
- Angular 4
- Angular 5
- Angular 6
Module 4: Typescript & ES6
- Introduction
- 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 )
Module 5: Power of Types
- Introduction
- Type inference
- Type Annotations
- Number
- Boolean
- String
- Array
- Tuple
- Enum
- Any
- Void
- Null and Undefined
- Never (Typescript 2)
Module 6: Explore Functions
- Introduction
- Using types in functions
- Function as types
- Optional and default parameters
- Arrow functions
- Function overloading
Module 7: Classes
- Introduction
- Inheritance
- Access modifiers
- Getters and setters
- Read only& static
- Abstract classes
Module 8: Interfaces
- Introduction
- Optional properties and methods
- Readonly&const
- Strict structural contract
- Extending interface
- Implementing interface
Module 9: Modules
- Introduction
- Import
- Export
- Default
Module 10: Decorators (Typescript Aspect Oriented Programming)
- Decorators (Typescript Aspect Oriented Programming)
Module 11: Working with Angular CLI
- Angular CLI
- Anatomy of the project
- Debugging Angular apps
- Working with Augury
Module 12: 8 Main Building blocks of Angular (Birds Eye View Of Angular 5)
- Modules
- Components
- Templates
- Metadata
- Data binding
- Directives
- Services
- Dependency injection
Module 13: Angular modules
- Angular modules
Module 14: Angular libraries
- Angular libraries
Module 15: Components
- Introduction
- @Component decorator
- Component configuration object
- Custom components
- Component with templates
- Inline
- External
- Component with Styles
- Inline
- External
Module 16: Templating
- 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 17: Directives
- Introduction
- Built-in directives
- Structural directive
- NgIf
- NgFor
- NgSwitch
- Attribute directive
- NgClass
- NgStyle
- NgModel
- @Directive decorator
Module 18: Pipes
- Introduction
- Built-in pipes
- @Pipe decorator
- Custom pipe development
Module 19: 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 20: Dependency Injection
- Introduction
- Why DI
- @Injectable decorator
- Custom service development
- Registering the service with NgModule using providers key
- Provider Types
- Class
- Factory
- Value
Module 21: Routing And Navigation
- Introduction
- @angular/router library
- Configure routes
- RouterModule.forRoot and RouterModule.forChild
- RouterOutlet, RouterLink, RouterLinkActive
- Nested Routes
- Parametrized routes
- Route guards
- Router events
Module 22: RxJs Primer
- Introduction
- Why RxJs
- Observable interface
- Streams
- Operators
- Subscription
- Subject
- Schedulers
Module 23: HTTP Deprecated& 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
Module 24: New Features in Angular 6
- 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 25: How to upgrade to Angular 6
- How to upgrade to Angular 6
Module 27: Testing
- Introduction
- Testing in Typescript
- Testing Component
- Testing Service/Provider
- Testing Pipe
Module 29: Depoyment
- Manually
- Using the Angular CLI with Ahead-Of-Time (AOT) Compilation and Tree-Shaking (removing unused library code)
