Angular 7 Training

  • Overview
  • Course Content
  • Drop us a Query

Angular 7 is the latest framework of the Angular series by Google. This Angular framework is liked by web developers across the globe due to the new and useful features it offers. Some of its notable features include CLI prompts, Angular Material, Virtual Scrolling, Angular Compatibility Compiler, Drag and Drop, and even more. Also, the version 7 is much faster and better performing than its predecessor. The significance of the Angular framework can be ascertained from the fact that it has been used to create some of the most widely used websites and apps of the present age, such as YouTube, Gmail, Netflix, PayPal, Upwork, and iStock Photo, among others; all these websites/apps make extensive use of the robust Angular JS framework.

Today, the demand for Angular experts is rising in the IT industry because the companies are looking for proficient professionals who can build dynamic apps. This demand is not going to diminish, rather it will grow in the years ahead owing to the popularity of apps. The salaries of the Angular professionals are also very lucrative; in the US, the front-end Angular developers are paid an average annual salary of $108,066. Therefore, it would be wise to invest your time and money in Angular training.You will be trained right from the basics to the advanced concepts, from setup to deployment, of this framework. You will gain expertise in creating, building, and deploying, Angular applications through practical exercises.

Upon the completion of this course, the candidates will be able to:

  • 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
Target Audience
  • Web Application Developers
  • Software Developers
  • Software Achitects
  • IT Professionals
  • Students who aspire to a career in web application development
Prerequisites
  • 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)

A Few Things You'll Love!

What our Students Speak

+
1
×
Hello

How can help you?