Angular

Objectives

Angular is a TypeScript-based open-source front-end web framework mainly maintained by Google and by a community of individuals and corporations to address many of the challenges encountered in developing single-page applications. Angular is a structural framework for dynamic webapps. With Angular, designers can use HTML as the template language and it allows for the extension of HTML’s syntax to convey the application’s components effortlessly. Angular makes much of the code you would otherwise have to write completely redundant.

Pre-requisites

• C Language

• HTML

• TypeScript

Course Content

Module 1 : Introduction to HTML5

• What is HTML 5?

• Overview of Different HTML tags and attributes

 

Module 2 : CSS3 (Cascading Style Sheets)

• What is CSS?

• Usage of CSS for different tags and attributes.

• Difference between ID and Class.

 

Module 3 : SCSS

• What is SCSS?

• Installing SCSS.

 

Module 4 : Introduction to Angular 

• Course introduction

• What is Angular?

• Installation

• Angular JS vs Angular2 vs Angular6

• Project setup and First Application

• Editing the first application

 

Module 5 : Introduction to TypeScript and ES6

• Typescript Syntax

• Dom structure

• Installation of typescript

• The Type System – Defining Variables

• The Type System – Defining Arrays

• The Type System – Classes & Objects

• Functions

• Rest and spread operators

• Parameter and Return Value Types

• Arrow Functions

 

Module 6 : Module & Component

• Module Introduction

• Component Introduction

• Creating new component

• Working with components

 

Module 7 : Data Binding

• What is Data Binding?

• Interpolation

• Property Binding

• Event Binding

• Two-way Data Binding

 

Module 8 : Directives

• What are Directives

• Directive Types

• Structural Directives (*ngIf, *ngFor, ngSwitch)

• Adding and Removing Elements Dynamically

• Looping Using *ngFor

• Attribute Directives (ngStyle, ngClass)

• Custom Directive

 

Module 9 : Cross Component Communication

• @Input() , @Output() &EventEmitter

• @ViewChild and @ViewChildren

• Service Basics

• Injecting Services

• Cross-component communication through services

• What is Dependency Injection (DI)?

 

Module 10 : Changing Pages with routing

• Why do we need Router?

• Setting-up and Loading Routes.

• Navigation with Router Links

• Child Routes

• Parameterized routes

• Lazy Loading

 

Module 11 : Handling Forms:(Template Driven Form & Reactive Form)

• Creating the Form and registering the controls.

• Submitting and using the form.

• Adding validation to check user input.

• Outputting validation Error Messages.

• Custom Validators

• Dynamic Reactive form

 

Module 12 : HTTP Request

• Introduction & How HTTP Request work in SPA.

• Sending Requests.

• Using the Returned data.

• Error Handling

• Interceptors

 

Module 13 : Observables

• Built in Observables.

• Custom Observables

 

Module 14 : Using Pipes and Data Formatting

• Using pipes.

• Chaining multiple pipes.

• Creating a custom pipe.

• Creating a filter pipe.

• Async pipe

 

Module 15 : Authentication and Route protection in Angular Application

• How Authentication works in SPA.

• Creating a Sign-Up Page & Route

• Authentication Status

• Route Protection

 

Module 16  : Angular Layouts Design

• Flex layout

• Material design

• Bootstrap with angular

 

Module 17 :  Project

Quick Enroll
100% Placement Assistance
Top