Angular 7 Training & Certification Course

• Develop modern, complex, responsive, and scalable web applications using Angular 7
• Create Angular components with TypeScript
• Deploy Angular Router to modularize applications
• Work with templates and decorators in Angular
• Use Dependency Injection in Angular
• Grasp the architecture of an Angular 7 application and how to use it
• Establish themselves as front-end developers on the basis of their thorough understanding of the Angular 7 framework

• Web Application Developers
• Software Developers
• Software Achitects
• IT Professionals
• Students who aspire to a career in web application development

• Basic knowledge of HTML & CSS
• Basic knowledge of JavaScript would be an added advantage

Angular 7 Introduction

• Understanding what you will learn in this course

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

Understanding Angular Versions

• AngularJS (Angular 1.x)
• Angular 2
• Angular 4
• Angular 5
• Angular 6
• Angular 7

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 )

Power of Types

• Introduction
• Type inference
• Type Annotations
• Number
• Boolean
• String
• Array
• Tuple
• Enum
• Any
• Void
• Null and Undefined
• Never (Typescript 2)

Explore Functions

• Introduction
• Using types in functions
• Function as types
• Optional and default parameters
• Arrow functions

Classes

• Introduction
• Inheritance
• Access modifiers
• Getters and setters
• Readonly & static

Interfaces

• Introduction
• Optional properties and methods
• Strict structural contract
• Extending interface
• Implementing interface

Modules

• Introduction
• Import
• Export
• Default

Decorators (Typescript Aspect Oriented Programming)

Working with Angular CLI

• Angular CLI
• Anatomy of the project
• Debugging Angular apps
• Working with Augury

Eight Main Building blocks of Angular (Birds Eye View Of Angular)

• Modules
• Components
• Templates
• Metadata
• Data binding
• Directives
• Services
• Dependency injection

Angular modules

• Why modules
• How to create modules
• Built-in modules
• Root Module
• Feature module

Components

• Introduction
• @Component decorator
• Component configuration object
• Custom components
• Component with templates
  • Inline
  • External
• Component with Styles
  • Inline
  • External

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

Directives

• Introduction
• Built-in directives
• Structural directive
  • NgIf
  • NgFor
  • NgSwitch
• Attribute directive
  • NgClass
  • NgStyle
  • NgModel

Pipes

• Introduction
• Built-in pipes
• @Pipe decorator

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

Dependency Injection

• Introduction
• Why DI
• @Injectable decorator
• Custom service development
• Registering the service with NgModule using providers key
• Provider Types
• Class
• Factory
• Value

Routing And Navigation

• Introduction
• @angular/router library
• Configure routes
• RouterModule.forRoot and RouterModule.forChild
• RouterOutlet, RouterLink, RouterLinkActive
• Nested Routes
• Parametrized routes
• Route guards

RxJs Primer

• Introduction
• Why RxJs
• Observable interface
• Streams
• Operators
• Subscription
• Subject
• Schedulers

HTTP Deprecated & HttpClient

• Setup installing the module
• Making a request for JSON data
• Typechecking the response
• Error handling
• Sending data to the server
• Making a POST request
• Configuring other parts of the request

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
• How to upgrade to Angular 6

New Features in Angular 7

• TypeScript 3.1 support
• RxJs 6.3 support
• Node 10 support
• New CLI prompts
• Application performance improvements
• New features to Angular CDK & Material
  • Virtual scrolling
  • Drag and Drop
• Content projection support for angular elements
• New partner launches
  • Angular console
  • @angular/fire

How to upgrade to Angular 7

Testing

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

Deployment

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