fb

Learn Angular from Beginner to Advanced

Angular is a TypeScript-based open-source front-end web application platform. Angular is a complete rewrite from the same group that built AngularJS.

365 days course access

Live instructor-led online classes

Industry-based projects

Master AngularJS, design custom directives, and build a single page application.

E-box Job Assistant

Get noticed by the top hiring companies

Guide from “Amphi”

The Super teacher

Learn Angular from Beginner to Advanced

Includes:

  • 6 Hours 45 Min of lecture Videos
  • 76 hands-on practice exercises
  • 16 Assessment exercises
  • 290 knowledge based questions
  • 4 Live connect session
             (Master classes)
  • Lifetime access
Contact Us
+91 95669 33778

Learn Angular from Beginner to Advanced

ABOUT THE COURSE

This course will help you to gain a good understanding of Angular Framework without any knowledge on AngularJS. Fully understand the architecture behind an Angular 8 application and how to use it. Create single-page applications with one of the most modern JavaScript frameworks. This course will start from scratch with Installation, Workspace, Component and so on.

COURSE OBJECTIVES

Upon successful completion of the course, the learner will be able to :
  • Design a single-page application by using Angular with Typescript
  • Build the web application by creating Components, Directives and Templating and common angular directives like NgFor, NgStyle, NgIf, and NgSwitch.
  • Understand standard pipes and building our own pipe.
  • Build Angular Services using the HTTP module.

Course Content

Introduction

Welcome! In this module, you will learn about what and why of Angular. The benefits of using Angular for front end designing. Angular is a MVVM javascript framework to gear up single page applications. It is one way of building applications with reusable and modular code across all platforms.

  • 1 Video
  • 30 Mins
  • 15 Problems

Workspace and file structure and ng commands

Any framework will contain a specific folder structure to store the files in an organized way. In this module, you'll learn about the directory structure of an Angular project and the different config files used to set up the project. Adding plugins and modules using package.json file and also the commands associated with it.

  • 1 Video
  • 30 Mins
  • 15 Problems

Angular Architecture

The beauty of Angular lies in the fact that it provides easy access to create asynchronous events. In this module, you'll learn how Angular is architected and what are the basic building blocks of Angular, that takes you to build rich Single Page Application.

  • 1 Video
  • 20 Mins
  • 15 Problems

Angular Components

By this time you'll be familiar with the overall idea of Angular, now its time to start building an application. In this module, you'll be exposed to creating a component which is a basic building block of any Angular project, adding variables and displaying them in HTML.

  • 1 Video
  • 1 Hour
  • 18 Problems

Displaying data in Components

A component is useless until data is displayed on the HTML. You can display data by binding controls in an HTML template to properties of an Angular component. In this module, you'll create a component and display them in HTML using interpolation.

  • 1 Video
  • 2 Hours
  • 24 Problems

Data Binding

Data from the component can be displayed by using property binding. In this module, you'll learn how to bind properties from the component in HTML page, template reference variable and also the different types of binding.(1-way binding and 2-way binding).

  • 1 Video
  • 2 Hours
  • 22 Problems

Structural Directives

Mostly in any programming or scripting language, there will be a need to control the statement executed on a condition or in a repeated manner. Angular provides some inbuilt directives such as ngIf,ngFor,ngSwitch to control the data displayed on the HTML page. Structural directives change the DOM layout by adding and removing DOM elements.

  • 1 Video
  • 1 Hour
  • 21 Problems

Attribute Directives

An Attribute directive changes the appearance or behavior of a DOM element. Attribute directives are used as attributes of elements. In this module, you will learn about the attribute directives NgModel,NgClass.

  • 1 Video
  • 1 Hour
  • 19 Problems

Component Interaction

Once you start building an application in Angular you will come across a scenario where you need to transfer data from one Component to another. This is established by using some decorators like @Input. In this module, you'll learn about binding data from one component to another using @Input and @Output decorators, Event Emitters.

  • 1 Video
  • 3 Hours
  • 22 Problems

Pipes

Using Angular pipes is a way to write display-value transformations that you can declare in your HTML. Every application starts out with what seems like a simple task: get data, transform them, and show them to users. Once data arrives you need to display them in a format for better user experience. For example in most use cases, users prefer to see a date in a simple format like April 15, 1988 rather than the raw string format Fri Apr 15 1988 00:00:00 GMT-0700. In those scenarios pipes come to rescue.

  • 1 Video
  • 2 Hours
  • 21 Problems

Lifecycle Hooks

A component has a lifecycle managed by Angular. Angular creates and renders components along with their children, checks when their data-bound properties change and destroys them before removing them from the DOM. In this module, you'll learn about the lifecycle methods a component goes through.

  • 1 Video
  • 30 Mins
  • 16 Problems

Angular Elements

Once you start creating a project you will find out that you are using a standard HTML template in various places. In those scenarios you can create a Custom HTML element and use everywhere rather using the HTML template.

  • 1 Video
  • 1 Hours
  • 15 Problems

Promises and Observables

Observables are a key part of Angular which helps in Asynchronous function calling. It helps in loading the particular content in a HTML without loading the entire page which is much needed in Single Page Applications. In this module, you'll learn about promises,observables and how to implement them.

  • 1 Video
  • 4 Hours
  • 25 Problems

Material Framework

Material Design is a visual language that synthesizes the classic principles of good design with the innovation of technology and science. Most of the modern web applications use material design. Angular has its own material design components. In this module, you'll learn to use the material framework API and some of the material components.

  • 1 Video
  • 3 Hours
  • 25 Problems

Flex Layout

The flex layout helps in designing a flexible responsive layout structure. In this module, you'll learn about the different layout structures using flex and some of its style properties.

  • 1 Video
  • 1 Hour
  • 18 Problems

Forms

Handling user input with forms is the cornerstone of many common applications. Applications use forms to enable users to log in, to update a profile, to enter sensitive information and to perform many other data-entry tasks. In this module, you'll learn about reactive forms and template-driven forms in detail.

  • 2 Videos
  • 3 Hours
  • 24 Problems

DI and Services

In this module, you'll learn about creating a service and writing the application logic in a service. You will be learning about ngservice and injecting services.

  • 1 Video
  • 45 Mins
  • 15 Problems

Local Data Store

In Angular application's there will be scenarios where the same data could be loaded in different components. Redux is used to create a common data store that can be used by all components in a page.

  • 1 Video
  • 2 Hours
  • 15 Problems

Http Client

Most of the data in an angular application is retrieved from a HTTP client. In this module, you'll learn about making a HTTP call to the servers and display the data.

  • 1 Video
  • 4 Hours
  • 21 Problems

Routing

The Angular Router enables navigation from one view to the next as users perform application tasks. This module will explain in detail about all the routing concepts associated with Angular.

  • 1 Video
  • 4 Hours
  • 21 Problems

Recommended Courses

You can opt for the following courses once you comeplete your ongoing course

About E-Box

E-Box is a Technology Enabled Active Learning and
Assessment platform for technology and engineering
domains apart from the basic LMS components like
quizzes, assignments, lesson components.

Connect with us

E-Box Google Playstore