Angular 6 Training

  • Overview
  • Course Content
  • Drop us a Query

Angular6 is script based development framework widely used by developers to create single page applications. It is highly acclaimed among the developers owing to its dependency injection and data binding features which helps in reducing the amount of code that needs to be written. Angular 6 enables programmers to build robust applications and the ease of deployment of a web application

Angular 6 training program from Multisoft systems helps you understand the concept of this language to develop SPA applications that will empower your business achieve quick ROI due to low development and maintenance cost, and faster accessibility. The training program teaches students how to take their skills to the next level by implementing Angular application using templates, components, routing, and tests. The training program helps you understand the best practices as well as the architecture and design of Angular applications. The objectives of Angular 6 training at Multisoft systems are:

  • Understand the difference between Angular and  traditional web development frameworks
  • Learn to write the code with using TypeScript language and ES6 features
  • Build a robust application with Angular 6
  • Understand and use Angular Forms, Dependency Injection, Observables, and Routing
  • Explore Angular coding and architecture best practices
  • Know about all the parts of an Angular application including Modules, Services, Components, and Pipes
  • Design, develop and deploy an Angular 6 application using the Angular CLI
  • Build reusable elements using angular elements
  • Develop dynamic model-driven forms that are easier to unit test
Who is the Target Audience?
  • Web Developers who want to build sophisticated applications through Angular
  • Students who want to pursue web application development as a career
Prerequisites
  • The candidates should have the basic knowledge of HTML and JavaScript.

Module 1: Introduction

  • 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 Angular 6

  • How to upgrade Angular 6

Module 26: Testing

  • Introduction
  • Testing in Typescript
  • Testing Component
  • Testing Service/Provider
  • Testing Pipe

Module 27: Deployment

  • Manually
  • Using the Angular CLI with Ahead-Of-Time (AOT) Compilation and Tree-Shaking (removing unused library code)

A Few Things You'll Love!

What our Students Speak

+