Contents
Angular5 Training Overview
Angular 5 training by real-time experts with real time examples, this Angualar5 Training covers all the topics in depth with the complete overview of AngularJS,2 and 4
Overview of the Course
Angular is a framework for building client applications in HTML and either JavaScript or a language like A TypeScript that compiles to JavaScript.The framework consists of several libraries, some of the core and some optional.
You write Angular applications by composing HTML templates with Angularized markup, writing component classes to manage those templates, adding application logic in services, and boxing components and services in modules.
Then you launch the app by bootstrapping the root module. Angular takes over, presenting your application content in a browser and responding to user interactions according to the instructions you’ve provided.
Objectives of the Course
- Develop modern, complex, responsive and scalable web applications with Angular 4• Develop modern, complex, responsive and scalable web applications with Angular 4
- Use their gained, deep understanding of the Angular 4 fundamentals to quickly establish themselves as frontend developers• Fully understand the architecture behind an Angular 4 application and how to use it
- Create single-page applications with on of the most modern JavaScript frameworks out
Pre-requisite / Target Audience
- JavaScript OOP basics (constructor pattern, inheritance, polymorphism, this object)• ES6 – class, extend, arrow function, import• TypeScript is identical to ES6, but has few more important features such as Interface, Type system & Decorators
Introduction
In this module, we will learn what typescript is and what the benefits of typescript are over other scripting languages. We can also learn how to install and setup the environment and how we can create our first example using typescript.• What is TypeScript?
• Benefits of TypeScript:
• Setup the Environment
• First TypeScript Example
Data Types and Variables
In this module, we will learn what the datatypes that are used in typescript are, and we will introduce a new data type let.o Basic Data Types
- Arrays
- Tuples
- Enum
- Any and void
- null and undefined
- Type Inference
- Type Casting
- Difference between let and var
- Const declaration
Destructuring & Spread
In this module, we will learn how to extract the data from objects and arrays in a convenient way using destructuring and we can learn how to break arrays and objects into components using spreads.
- Array Destructuring
- Object Destructuring
- Mixed Destructuring
- Property renaming
- Default Values
- Spreads
Working with Classes
In this module, we will learn how to write classes and how to create objects for our classes like we do in other programming languages like Java, C# etc. And we can also learn how we can fulfill OOPS concepts using typescript.o Writing and Using Classes
- Constructor method
- Inheritance of classes
- Typecasting
- Type Assertion
- Static Properties
- Abstract class
Working with Interfaces
In this module, we will learn how to work with interfaces in typescript.o Interface Declaration and Initialization with an object.
- Duck Typing
- Interface Implementation by class
- Interface having Optional Property
- Class extending another class and also implementing an Interface
- Excess Property Checks
- Indexable Types
- Extending Interfaces
Generics
In this module, we will learn what are generics, when to use them and how to create generics using typescript. And its wide range of usage over all the OOPS concepts.o When to Use Generic Functions
- Generic Types
- Generic Interface
- Generic Classes
- Generic Constraints
- Using Type Parameters in Generic Constraint
Modules and Namespaces
In this module, we will learn how to export and import between module. And how can we group the required modules into a namespace
- Export Syntax
- Import Syntax
- Re-export
- Default exports
- Using require()
- Declaring and Using Namespaces
Ambients
In this module, we will learn how to make use of our javascript functions with typescript.
- Definition
- Syntaxo Examples
Angular5 Course Content
Introduction
In this module, we will learn what is angular, what are the major differences between Angular 1.X, Angular 2 and Angular 4. We will also learn how to set up in the local environment and a small introduction to typescript.
- What is Angular?
- Angular (vs) Angular2 (vs) Angular4 (vs) Angular5
- Setup for local environment
Directives
In this module, we will learn what the built-in directives that we mostly use in angular4, and usage of Host Listener and Host Binding. Also, we can learn how to create attribute directives.
- Structural directives (Built-in Directives (ngIF, ngFor, ngSwitch)
- Style and Class Directives ( ngClass, ngStyle)
- Attribute directives
- Host Listener and Host Binding
Data binding
In this module, we will learn how to do data-binding in angular4, and how we can make use of @input and @output decorators.
- Property binding and Interpolation
- Event binding
- Two-way Binding
- Use of @Input and @Output
Components
In this module, we will learn one of the major concept in angular4 i.e., components. And we can also learn how to create a dynamic component using ngComponentOutlet.
- What are components?
- Understanding Components lifecycle hooks
- Creating and using components
- Dynamic components using ngComponentOutlet
Modules
In this module, we will learn what modules are, and usage of modules in a different manner. We can also learn what AOT compilation is.
- Root App module
- Ahead-Of-Time(AOT) Compilation
- Feature modules
- Lazy Loading a Module
- Shared Module
Forms
In this module, we will learn two different types of creating forms in angular4 i.e. template driven and model-driven. And we will also learn how to do validations and how to create custom validators.
- Template Driven Forms
- Model Driven & Reactive Forms
- Form with @ViewChild
- Validations
- Resetting & submitting forms
- Custom Valuators
Pipes
In this module we will learn what pipes are, and how to pass parameters to pipes, and how to create custom pipes.
And we will also learn new concept Async pipes that is introduced in angular4.
- Why pipes are useful?
- Parameterizing pipes
- Custom pipes
- Pure and Impure pipes
- Async pipes
Services & Dependency injection
In this module we will learn what are services and how do they communicate using HTTP protocol to the server.
And we will also learn about very interesting topic Dependency Injection in angular.
- Creating Service
- Logger Service
- $http Service
- Injectors
- Providers
- Tokens
- DI in Angular Framework
Routing
In this module, we will learn the introduction for routing in angular and how to navigate between views, how to do parameterized routing.
- Introduction
- Configuring & Navigating
- Parameterized routes
Crud Operations Using Http Service
In this module we will create an application with an end-to-end start from the server to client, getting response and requests using HTTP service.
- Creating Services
- Creating Components
- Creating Routings
- Configuring NgModule
- Run the application
Implement Single page application(SPA)
Real-time Project implementations
- Product Abstract Document
- Requirement Specification Document
Step-by-Step procedure for building the project from ground up
- Complete Source Code
- Database Script with Sample data
- Instructions to Setup the Project on a Development box
- Instruction to Deploy the project in Production Box / Microsoft Azure
At the end of the course, participants will be able to
- Build native mobile apps for Android, iOS and using Angular4
- Understand the fundamentals of Angular Forms and its architecture
- Present data in beautiful, interactive lists
- Build forms and setting pages