Edukolkata

Angular Training

A widely used client-side JavaScript framework by Google to create SPA applications
Apply Online
View Our:Training Fees

COURSE DESCRIPTION

Angular is one of the most popular JavaScript frameworks that you should know to get a job in software development companies. Not only in mid-level companies but it is being widely used by MMCs as well. It is written in Typescript which will be trans-piled into JavaScript. It is a cross-platform JavaScript framework that can be set up in Mac, Windows, and Linux to create a mobile and desktop web application. Angular is contentiously releasing new versions to bring new features that will give the web application more High performance and Security. It has loads of ready-made JavaScript modules that can be implemented in the system to reduce the development time.

From the very beginning of this website development course we will start to focus on real life projects. So just say goodbye to those boring online videos, our every coding classes will have a separate hands-on experience.

Things to know:

The prime focus of Edukolkata is to provide you an industry-level IT training and that's why our whole training process is based on simultaneous theory and practice classes. Here are a few things you should know before the course begins:

  • Training Mode: Online and Live
  • Practical session on each topic
  • Personal URL for Virtual CV
  • Weekend class available
  • Free three hours demo class
  • Live Project URL

Enquire now


Duration 160 Hours
Minimum Eligibility: Basic Javascript
₹
Course Fee: 4900
apply now

Why Angular

By referring Angularjs we are actually talking about the old version of angular 1x and then we refer to angular 2 4 5 6 7 8 9 or 10 just as angular. you'll probably hear us say it's just angular so when we're talking about angular we mean the new shiny awesome typescript angular. Now javascript is the most commonly used client-side scripting language and it is written into HTML documents by enabling interactions with web pages in many unique ways but the question arises is javascript ideal for developing single-page applications that require modularity testability and other features perhaps not. angular and javascript together bring structure and consistency to your web applications and also provide scalability and maintainability. Angular is specifically developed for single-page applications. It is an open-source javascript framework written completely in typescript and is maintained by Google. Angular as a framework which provides a few advantages while also providing a standard structure for developers. Now typescript defines a set of types to javascript which helps you write javascript that is easier to understand now all the typescript code compiles down or transpile to basic javascript that can run smoothly on any platform. Edukolkata provides an advanced level of Angular training so that you can get your first angular job easily. In this angular you will learn:

  • Build a real-world client-side application with a live URL
  • Troubleshooting compile-time and run-time errors
  • Deploying projects to live server.
  • Repository management with other team members

We also do some mini projects simultaneously so that you can get some hands-on angular experience.

Sprint 1 Sprint 2 Sprint 3 Sprint 4
Lecture 1.1 Preview ( 8 )
Getting Started
Lecture 2.1 Preview ( 12 )
Directives
Lecture 3.1 Preview ( 37 )
Handling Forms in Angular Apps
Lecture 4.1 Preview ( 10 )
Dynamic Components
Lecture 1.2 Preview ( 7 )
TypeScript Introduction
Lecture 2.2 Preview ( 10 )
Using Services & Dependency Injection
Lecture 3.2 Preview ( 11 )
Using Pipes to Transform Output
Lecture 4.2 Preview ( 21 )
Angular Modules & Optimizing Angular Apps
Lecture 1.3 Preview ( 27 )
Angular Introduction
Lecture 2.3 Preview ( 30 )
Changing Pages with Routing
Lecture 3.3 Preview ( 28 )
Making Http Requests
Lecture 4.3 Preview ( 5 )
Deploying an Angular App
Lecture 1.4 Preview ( 20 )
Components & Databinding
Lecture 2.4 Preview ( 10 )
Understanding Observables
Lecture 3.4 Preview ( 23 )
Authentication & Route Protection in Angular
Lecture 4.4 Preview ( 6 )
Whiat is Angular Universal
Lecture 1.5 Preview ( 12 )
Directives
Lecture 2.5 Preview ( 37 )
Handling Forms in Angular Apps
Course Fees
One Time Payment for single admission:
₹ 12000 59% Off 4900/-
You can also join with us a group of 3 students and get additional discounts on the total course fee:
₹4900 x 3 =  14700 Extra 10% Off 13200/-
  • Each student in same group will get extra ₹500 /- discount

  • Getting Started

    • Course Introduction
    • What is Angular?
    • Angular vs Angular 2 vs Angular 8
    • CLI Deep Dive & Troubleshooting
    • Create Your First App
    • Editing the First App
    • What is TypeScript?
    • A Basic Project Setup using Bootstrap for Styling

  • TypeScript Introduction

    • Introduction
    • Using Types
    • Classes
    • Interfaces
    • Generics
    • Wrap up & Modules
    • Deep dive into TypeScript

  • Angular Introduction

    • Module Introduction
    • How an Angular App gets Loaded and Started
    • Components Introduction
    • Creating a New Component
    • Understanding the Role of AppModule and Component Declaration
    • Using Custom Components
    • Creating Components with the CLI & Nesting Components
    • Working with Component Templates
    • Working with Component Styles
    • Fully Understanding the Component Selector
    • Practicing Components
    • What is Databinding?
    • String Interpolation
    • Property Binding
    • Property Binding vs String Interpolation
    • Event Binding
    • Bindable Properties and Events
    • Passing and Using Data with Event Binding
    • Two-Way-Databinding
    • Combining all Forms of Databinding
    • Understanding Directives
    • Using ngIf to Output Data Conditionally
    • Enhancing ngIf with an Else Condition
    • Styling Elements Dynamically with ngStyle
    • Applying CSS Classes Dynamically with ngClass
    • Outputting Lists with ngFor
    • Practicing Directives

  • Components & Databinding

    • Module Introduction
    • Splitting Apps into Components
    • Property & Event Binding Overview
    • Binding to Custom Properties
    • Assigning an Alias to Custom Properties
    • Binding to Custom Events
    • Assigning an Alias to Custom Events
    • Custom Property and Event Binding Summary
    • Understanding View Encapsulation
    • More on View Encapsulation
    • Using Local References in Templates
    • @ViewChild() in Angular 8
    • Getting Access to the Template & DOM with @ViewChild
    • Projecting Content into Components with ng-content
    • Understanding the Component Lifecycle
    • Seeing Lifecycle Hooks in Action
    • Lifecycle Hooks and Template Access
    • @ContentChild() in Angular 8
    • Getting Access to ng-content with @ContentChild
    • Property & Event Binding and View Encapsulation

  • Directives

    • Module Introduction
    • ngFor and ngIf Recap
    • ngClass and ngStyle Recap
    • Creating a Basic Attribute Directive
    • Using the Renderer to build a Better Attribute Directive
    • More about the Renderer
    • Using HostListener to Listen to Host Events
    • Using HostBinding to Bind to Host Properties
    • Binding to Directive Properties
    • What Happens behind the Scenes on Structural Directives
    • Building a Structural Directive
    • Understanding ngSwitch

  • Using Services & Dependency Injection

    • Module Introduction
    • Why would you Need Services?
    • Creating a Logging Service
    • Injecting Service into Components
    • Creating a Data Service
    • Understanding the Hierarchical Injector
    • How many Instances of Service Should It Be?
    • Injecting Services into Services
    • Using Services for Cross-Component Communication
    • Practicing Services

  • Changing Pages with Routing

    • Module Introduction
    • Why do we need a Router?
    • Understanding the Example Project
    • Setting up and Loading Routes
    • Navigating with Router Links
    • Understanding Navigation Paths
    • Styling Active Router Links
    • Navigating Programmatically
    • Using Relative Paths in Programmatic Navigation
    • Passing Parameters to Routes
    • Fetching Route Parameters
    • Fetching Route Parameters Reactively
    • An Important Note about Route Observables
    • Passing Query Parameters and Fragments
    • Retrieving Query Parameters and Fragments
    • Practicing and some Common Gotchas
    • Setting up Child (Nested) Routes
    • Using Query Parameters - Practice
    • Configuring the Handling of Query Parameters
    • Redirecting and Wildcard Routes
    • Important: Redirection Path Matching
    • Outsourcing the Route Configuration
    • An Introduction to Guards
    • Protecting Routes with canActivate
    • Protecting Child (Nested) Routes with canActivateChild
    • Using a Fake Auth Service
    • Controlling Navigation with canDeactivate
    • Passing Static Data to a Route
    • Resolving Dynamic Data with the resolve Guard
    • Understanding Location Strategies

  • Understanding Observables

    • Module Introduction
    • Analyzing Angular Observables
    • Getting Closer to the Core of Observables
    • Building a Custom Observable
    • Errors & Completion
    • Observables & You!
    • Understanding Operators
    • Subjects
    • Wrap Up
    • Useful Resources & Links

  • Handling Forms in Angular Apps

    • Module Introduction
    • Why do we Need Angular's Help?
    • Template-Driven (TD) vs Reactive Approach
    • An Example Form
    • TD: Creating the Form and Registering the Controls
    • TD: Submitting and Using the Form
    • TD: Understanding Form State
    • TD: Accessing the Form with @ViewChild
    • TD: Adding Validation to check User Input
    • Built-in Validators & Using HTML5 Validation
    • TD: Using the Form State
    • TD: Outputting Validation Error Messages
    • TD: Set Default Values with ngModel Property Binding
    • TD: Using ngModel with Two-Way-Binding
    • TD: Grouping Form Controls
    • TD: Handling Radio Buttons
    • TD: Setting and Patching Form Values
    • TD: Using Form Data
    • TD: Resetting Forms
    • Practicing Template-Driven Forms
    • Introduction to the Reactive Approach
    • Reactive: Setup
    • Reactive: Creating a Form in Code
    • Reactive: Syncing HTML and Form
    • Reactive: Submitting the Form
    • Reactive: Adding Validation
    • Reactive: Getting Access to Controls
    • Reactive: Grouping Controls
    • Fixing a Bug
    • Reactive: Arrays of Form Controls (FormArray)
    • Reactive: Creating Custom Validators
    • Reactive: Using Error Codes
    • Reactive: Creating a Custom Async Validator
    • Reactive: Reacting to Status or Value Changes
    • Reactive: Setting and Patching Values
    • Practicing Reactive Forms
    • [OPTIONAL] Assignment Solution

  • Using Pipes to Transform Output

    • Introduction & Why Pipes are Useful
    • Using Pipes
    • Parametrizing Pipes
    • Where to learn more about Pipes
    • Chaining Multiple Pipes
    • Creating a Custom Pipe
    • Parametrizing a Custom Pipe
    • Example: Creating a Filter Pipe
    • Pure and Impure Pipes (or: How to "fix" the Filter Pipe)
    • Understanding the "async" Pipe
    • Practicing Pipes

  • Making Http Requests

    • A New IDE
    • Module Introduction
    • How Does Angular Interact With Backends?
    • The Anatomy of a Http Request
    • Backend (Firebase) Setup
    • Sending a POST Request
    • GETting Data
    • Using RxJS Operators to Transform Response Data
    • Using Types with the HttpClient
    • Outputting Posts
    • Showing a Loading Indicator
    • Using a Service for Http Requests
    • Services & Components Working Together
    • Sending a DELETE Request
    • Handling Errors
    • Using Subjects for Error Handling
    • Using the catchError Operator
    • Error Handling & UX
    • Setting Headers
    • Adding Query Params
    • Observing Different Types of Responses
    • Changing the Response Body Type
    • Introducing Interceptors
    • Manipulating Request Objects
    • Response Interceptors
    • Multiple Interceptors
    • Wrap Up
    • Useful Resources & Links

  • Authentication & Route Protection in Angular

    • Module Introduction
    • How Authentication Works
    • Adding the Auth Page
    • Switching Between Auth Modes
    • Handling Form Input
    • Preparing the Backend
    • Make sure you got Recipes in your backend!
    • Preparing the Signup Request
    • Sending the Signup Request
    • Adding a Loading Spinner & Error Handling Logic
    • Improving Error Handling
    • Sending Login Requests
    • Login Error Handling
    • Creating & Storing the User Data
    • Reflecting the Auth State in the UI
    • Adding the Token to Outgoing Requests
    • Attaching the Token with an Interceptor
    • Adding Logout
    • Adding Auto-Login
    • Adding Auto-Logout
    • Adding an Auth Guard
    • Wrap Up
    • Useful Resources & Links

  • Dynamic Components

    • Module Introduction
    • Adding an Alert Modal Component
    • Understanding the Different Approaches
    • Using ngIf
    • Preparing Programmatic Creation
    • Creating a Component Programmatically
    • Understanding entryComponents
    • Data Binding & Event Binding
    • Wrap Up
    • Useful Resources & Links

  • Angular Modules & Optimizing Angular Apps

    • Module Introduction
    • What are Modules?
    • Analyzing the AppModule
    • Getting Started with Feature Modules
    • Splitting Modules Correctly
    • Adding Routes to Feature Modules
    • Component Declarations
    • The ShoppingList Feature Module
    • Understanding Shared Modules
    • Understanding the Core Module
    • Adding an Auth Feature Module
    • Understanding Lazy Loading
    • Implementing Lazy Loading
    • Alternative Lazy Loading Syntax
    • More Lazy Loading
    • Preloading Lazy-Loaded Code
    • Modules & Services
    • Loading Services Differently
    • Ahead-of-Time Compilation
    • Wrap Up
    • Useful Resources & Links

  • Deploying an Angular App

    • Module Introduction
    • Deployment Preparation & Steps
    • Using Environment Variables
    • Deployment Example: Firebase Hosting
    • Server Routing vs Browser Routing

  • Whiat is Angular Universal

    • Adding Angular Universal
    • Getting Started with Angular Universal
    • Working on the App Module
    • Adding a Server-Side Build Workflow
    • Adding a NodeJS Server
    • Pre-Rendering the App on the Server

  • Angular Animations

    • Making Animations Work with Angular 4+
    • Introduction
    • Setting up the Starting Project
    • Animations Triggers and State
    • Switching between States
    • Transitions
    • Advanced Transitions
    • Transition Phases
    • The "void" State
    • Using Keyframes for Animations
    • Grouping Transitions
    • Using Animation Callbacks

  • Custom Project & Workflow Setup

    • Introduction
    • Initializing the Project
    • Setting up the Basic Project Files
    • Installing the Core Dependencies
    • Filling the Project Files with Some Life
    • index.html & Polyfills
    • Installing Development Dependencies
    • Setting up a Development Workflow
    • Updating to Angular 6 + Webpack 4
    • Finishing & Using the Development Workflow
    • Setting up a Production Workflow
    • Adding Types & Fixing Bugs
    • Finishing Touches
Other Course Details
Total Classes:
80
Placement Support:
No
Certificate Available:
Yes
No of students in batch:
10
Assignment Available:
Yes
*The avobe information may change without any prior notice.

There are many ways to learnHow to Apply

apply now