A computer with either Windows, Mac or Linux to install all the free software and tools needed to build your new apps
What will you get from this course:
- Online Angular Training
- Practical Coding and Implementation
- Make Yourself Job Ready
- Certificate and Placement Support
- Hands-on Training in Live Projects
- Build Highly Reliable and Functional Applications
- You will get to learn an object-oriented programming language
- This courses will help you create standards of enterprise computing
Course Content
Introduction
Dynamic Binding
Directives
Controllers
Scope
Services
Factories
Expressions
Form Validations
Filters
Custom Directives
Routing
Making an API Call
Modules
Dependency Injection
Section 1: Getting Started with Angular 5
Course Introduction
What is Angular
Angular vs Angular 2 vs Angular 4 vs Angular 5
CLI Deep Dive
Project Setup and First App
The Course Structure
What is TypeScript
A basic setup of Bootstrap for Styling
Module Introduction
How an Angular App gets loaded and started
Components
Creating new Component
Understanding the role of AppModule and Component Declaration
Understanding Component Templates
Understanding Component Styles
Understanding Component Selector
Module Introduction
What is Databinding
String Interpolation
Property Binding
Property Binding vs String Interpolation
Event Binding
Bindable Properties and Events
Passing and Using Data using Event Binding
Two-Way Binding
Forms Module and Two Way Binding
Understanding Directives
Using ngIf and Else Conditions
Using ngStyle for Styling Angular App
Applying CSS Class dynamically with ngClass
Displaying Lists using ngFor
Module Introduction
Dividing the App into multiple components
Property and Event Binding deep dive
Binding to custom properties
Binding to custom events
View Encapsulation
Understanding Local Reference inside Templates
Getting Access to the templates using @ViewChild.
Exploring Component Life Cycle
Life cycle hooks deep dive
Creating a basic custom attribute directive
Exploring Renderer to create a Directive
Understanding HostListener and HostBinding
Binding to Directive’s Properties
Building Structural Directives
Exploring switch
Module Introduction
Why Services are required
Creating a Service
Injecting the service into components
Understanding Dependency Hierarchical Injector
Injecting a Service into other services
Module Introduction
Understanding the need of a Router
Setting Up and implementing Routes
Navigating to Router Links
Understanding Router Paths
Styling Active Router Links
Understanding Navigation Paths
Styling Router Links
Navigating Dynamically
Using Relative Paths
Passing Parameters to Routes and fetching route parameters
Fetching route parameters in a Reactive Way
Passing query parameters and fragments
Understanding Nested Routes
Redirecting and Wildcard routes
Redirection Path Matching
Outsourcing the Route Configuration
Introduction to Guards
Understanding can activate
Understanding can activate child
Understanding can deactivate
Passing Static Data to a Route
Understanding Resolve Guard
Exploring Location Strategies
Module Introduction
Understanding built-in Angular Observable
Creating Observables
Using a Custom observable
Unsubscribe
Using Subjects to pass and Listen to Data
Understanding Observable Operators
Module Introduction
Need of Angular’s help
Template Driven vs Reactive Approach
Template Driven Approach
TD: Creating the Form and Registering the controls
TD: Submitting and Using the form
TD: Understanding Form’s State
TD: Accessing Form using @ViewChild
TD: Adding Validation to user input
TD: Built-in Validator and using HTML 5 Validation
TD: Understanding Form State
TD: Outputting Validation Error Messages
TD: Set Default Value with ngModel Property Binding
TD: Using ngModel and two-way binding
TD: Grouping Form Controls
TD: Using Form Data
Reactive Form Approach
Reactive: Creating a Form in Code
Reactive: Submitting the form
Reactive: Adding Validation
Reactive: Getting Access to Controls
Reactive: Grouping Controls
Reactive: FormArray
Reactive: Custom Validators
Reactive: Exploring Error Codes
Reactive: Custom Async Validator
Module Introduction
Using Pipes
Parameterizing Pipes
Chaining Multiple Pipes
Creating a custom Pipe
Pure & Impure Pipes
Understanding the Async Pipe
Introduction & how HTTP request works in SPAs
Sending POST Request
Adjusting request headers
Sending GET requests
Sending PUT Requests
Response with observable operators
Catching HTTP errors
Using the async pipe with HTTP Requests
Module Introduction
How Authentication works in SPAs
Introduction to JWT
Creating a Signup Page and Route
Setting up Firebase SDK
Signing users up
Signing users in
Token introduction
Sending a token
Route protection and redirection example.
Module Introduction
Using types
Classes
Interface
Generics
Wrap up & Modules
Deep dive into typescripts.
Section 14: Project: This section will cover a course project where
we will try to implement all the topics we covered in each session.
The course project will run after the completion of each module.
Overview of TypeScript
Why TypeScript?
JavaScript vs TypeScript
Installing Brackets – an IDE
Installing TypeScript using npm
Primitive Datatypes
User-defined Datatypes
Tuples and Unions
Variables and Operators
if, if-else, switch statements
for, while loops
forEach in TypeScript
Defining and Calling a Function
Returning functions
Parameterized functions
Arrow functions
String methods
Array methods
Other inbuilt methods
Introduction to Classes and Objects
Interfaces
Inheritance
Revising the TypeScript Concepts
Bridging TypeScript to Angular
What is Angular?
Features of Angular
Angular versions
AngularJS vs Angular 2+
What’s new in Angular 9
Installing the latest version of nodeJS
Installing Angular 9 using a node package manager (npm)
Installing an IDE like Visual studio code
List of commands for creating, running and building a project
Create a new Angular project
The folder structure of an Angular Project
Linking bootstrap with Angular
Linking icons, fonts with the Projects
What are the components?
Structure of a component
Default vs custom components
Creating components manually
Creating components using npm
Calling a component
Nesting components
Execution flow of Angular applications
Component Interactions
Introduction to Modules
Introduction to Angular routings
Nested routes
Relative path vs Absolute paths
Lazy loading modules
Pre-loading modules
Preventing unauthorized access using protected routes
Angular elements
Advance concepts of components
Angular Lifecycle hooks
Structural directives
Attribute directives
Custom directives
Introduction to data binding
String Interpolation
Property Binding
Event Binding
Two-way data binding
What are Services?
Need for Services
Creating a Service
Achieving inter-component data exchange
Dependency injection in Angular
Creating an injectable service in a class
Injecting services
Introduction to Angular Animations
Creating a Basic Animation
Example for Advanced Animations
Creating Re-usable Angular Animations
Introduction to Pipes
Importing and using pipes
Parameterizing pipes
Chaining pipes
Custom pipes
Creating a Filter pipe
Introduction to Angular Forms
Template-driven forms
Reactive forms
TDD vs Reactive forms
Adding validations to forms
Displaying error messages
Introduction to Observables
Using observables to pass data
Type-ahead suggestions using Observables
Introduction to RxJS library
Introduction to Http Client Services
HTTP get vs post
Requesting and sending data to the server
Sending get Request
Sending put Request
Adjusting Request Headers
Building the Application
Steps to host the application on some server
Hosting the Application
Creating the Project Setup
Linking BootStrap
Creating modules and grouping Components
Implementing Lazy Loading and adding Routings
Adding necessary Material Components
Completing the contents
Hosting the Website
Introduction to Angular Material
Working with any of three External Plugins
Requirement :
Basic Computer Knowledge like OOPS, C and C++ languages
Nothing else! It’s just you, your computer and your hunger to get started today.
Frequently Asked Questions ?
AngularJS is a JavaScript framework for building dynamic web
applications. What sets it apart is its two-way data binding feature,
which establishes a real-time connection between the model and the view.
It's like having a seamless conversation – changes in the model
automatically reflect in the view and vice versa, ensuring a
synchronized and responsive user interface in AngularJS applications.
Directives in AngularJS are like stage directors providing cues
for components in a tech play. They extend HTML with custom attributes,
turning static elements into dynamic and reusable components. It's akin
to providing stage instructions – directives enhance the declarative
approach by allowing developers to express complex UI behaviors in a
straightforward manner, promoting reusability and maintainability.
Dependency injection in AngularJS is like having specialized
crew members ensure a smooth tech performance. It's a design pattern
where components receive their dependencies rather than creating them.
It's akin to delegating tasks – dependency injection enhances modularity
by promoting a hierarchical and organized structure, making Angular
applications more testable and maintainable.
Scopes in AngularJS are like transparent communication
channels connecting controllers and views in a tech broadcast. They
provide a context for data binding, enabling controllers to share data
with views and vice versa. It's akin to having a shared script – scopes
facilitate seamless communication, ensuring that changes in one part of
the application are reflected in others, promoting a cohesive user
experience.
AngularJS filters are like digital stylists transforming raw data
into a visually appealing presentation. They are used in expressions to
format and manipulate data before it reaches the view. It's akin to
applying filters in a photo editor – AngularJS filters enhance the
visual representation by allowing
About Course :
This Angular Course is designed by industry professionals to meet the needs and standards of the industry.
Our teachers have greater expertise and are now employed by a multinational corporation. Every topic will be thoroughly taught using real-world project examples. This training programme includes evaluation exams, assignments, and exercises for a great hands-on learning experience.
This programme is entirely hands-on and placement-oriented.This course is designed to satisfy the needs of people who wish to work as professional Java programmers. This will also aid learners in passing the Java Programmer Certification exam.
