{< Course Details >}

FRONT END WEB{< Course Details >}

centers@acadgild.com | www.acadgild.com | 90360 10796

centers@acadgild.com | www.acadgild.com | 90360 10796 ww ww ww ww ww 8880025025

{ }css

</>

HTML

{ ; }JS

01

Our Front end development course teach you how to build effective and interactive web sites with advanced naavigation and multimedia.

We will introduce you to the fundamentals of the three building blocks of all modern websites i.e; jQuery, HTML5 & CSS3. You will also learn about the latest Angular JS versions and its tools and also be a part of live projects.

Brief About the Course

02

This course is designed for beginners as well as for working professionals who want to enhance their expertise. Web Developers, Software Engineers, Mobile App Developers and candidates with technical background will benefit from this course.

Who shouldtake thiscourse

Front-end Web Developers are much in demand making it a hot job for the year. For the success of any business it is very important to have a well designed & interactive website, that will attract and retain the customers. So it will be a top priority of every organization to invest on Front end developers. Average salary of Front-end Web Developer is $75K to $100K for 2+ years experience. Web Development employment to grow to 20% more by 2022.

Why Learn

03

04

Prerequisites

Basic programming knowledge of HTML, CSS & JavaScript will be

beneficial.

05

Introduction to AngularJs 2• Evolution of the web

• Introduction to front end frameworks,

• What is Single Page Application • How SPA works

• Traditional website • Misconception about SPA

• What's new in SPA • Benefits of SPA • History of Angular

• Problems with angular 1.x

• Introduction to Angular 2

Session

01

Session

02 ES6 - Part 1• What is ES6? • Does All browser supports ES6?

• Some basic features of ES6 • Scoping • Destructuring

• Promises • Arrow functions • Drawback of Arrow Function

• Generators • Classes • Inheritance • Get & Set • Module

2 Hours

ES6 - Part 2• Sets and Maps • WeakMap

• Rest parameters • Spread • Iterators

Session

032 Hours

2 Hours

06

Session

04 TypeScript I• Typescript features

• Typescript: Data types, Functions

• Function: Inferring the types

• Typescript: Classes

• Typescript: Inheritance

• Typescript: Interface

• Public, Private and protected modifiers

• Generics, Generic Types

• Generic Classes, Generic Constraints

TypeScript II• Typescript: Decorators

• Enable Experimental Support for Decorators

• Class Decorator • Property Decorator • Method Decorator

• Parameter Decorator • TypeScript Modules

• Implicit Internal Modules • Named Internal Modules

• Exports, External Modules, Namespace, Mixins

Session

052 Hours

2 Hours

07

Project 1Session 04 & 05

08

Seed Project, BootStrappingProject StructureAngular ModuleComponent Basics, Project I• Angular 2 Project • Angular 2 Architecture

• Angular 2 beta, Gulp

• Webpack, Webpack dev server, Sass, Jasmine, Karma

• Angular 2 beta • Running Angular 2 beta application

• Understanding Tsconfig.json • Typings

• Bootstrapping Angular App • Project Structure

• Angular Module

Session

062 Hours

• Interpolation • Template Expressions

• Template Statements • Binding Syntax

• Property Binding • Property binding or interpolation?

• Attribute Bindings • Class binding • Style binding

• Event Binding • Local Template Variables

• Built-in Directives - NgClass;NgStyle;NgIf

AngularJs Template SyntaxInBuilt Directives, Project I Cont..

Session

072 Hours

09

Data Bindings, Forms in Angular 2• Difference in Event & Property Binding

• Two way data binding with ngModel

• User Input

• Form Controls in Angular 2

• Controls and Control Groups

• Form & NgForm

• Input & NgControl

• Error & Validation Handling

• CSS for Forms,Custom validation

Session

082 Hours

• Dependency Injection

• Why dependency injection?

• Dependency Injection: Usage,Configuring the injector

• Injectable Decorators

• Dependency Injection Tokens

Dependency Injection in Angular 2

Session

092 Hours

10

Components in Detail• Component in Angular 2 • Metadata for Classes

• Styles, Encapsulation, Templates,

• Component Availability, Annotations

• Event Delegation • Delegation: EventEmitter

• ViewChildren & Content Children

Session

102 Hours

• Directives,Difference between Directives and Component

• Directive Metadata • Types of directive

• Point to remember • Host, HostBinding, HostListener

• Web Component, ExportAs, LifeCycle

• ngOnInit, ngOnChanges, ngDoCheck, ngOnDestroy

• Input, Output.

Directives in DetailSession

11

• Pipes • Chaining pipes • Parameters in Pipe

• Custom Pipe • Async Pipes • Built In Pipes-date • Slice

• Decimal • Percent • Currency • J-son • Lowercase

• Uppercase • About Pipe in detail

PipesSession

12

2 Hours

2 Hours

11

Routing, Navigation• Router • Behavior of Browser • Introduction to Router

• The Basics • Configuration • RouteConfig

• RouterOutlet • RouterLink • ROUTER_PROVIDERS

• Navigation • Life Cycle • Two critical points

• Child Routers • Query Parameters • URL Style/HTML5

• Mode • Linker Route Parameters

Session

132 Hours

• Http Client • HTTP Get • Post Methods • Promises

• Observables vs Promises • Transforming Data

• JSONP • Custom Headers • Query String Parameters

• Intro to RxJS

Http ClientSession

142 Hours

• Intro to Services in Angular 2 • Service• Inject the HeroService • Providers Overview • Simple Service Example • Lifecycle Hooks Component Lifecycle • Methods - OnInit• OnDestroy • DoCheck • OnChanges • AfterContentInit• AfterContentChecked • AfterViewInit.

Services, Providers, LifeCycle hooksSession

152 Hours

12

Events in angular 2,Data & state management• Events in Angular Event Emitter Class • Emit Method

• Next Method • Subscribe Method

Session

162 Hours

Migrating Angular 1 to 2, Performance Considerations, Change detection• Migrating Angular 1 to 2 Code Changes • Upgrade Adapter

• Hybrid App Angular 1 & 2 • Upgrade • Controllers

Session

172 Hours

Testing & deployment• Testing Angular 2 Apps Unit Testing

• Technologies - Jasmine • Mock Dependencies

• Testing• Components • End to End Tests

• Performance Tests Deployment

Session

182 Hours

13

Progressive Web App - I• Introduction To Progressive Web App

• What Is Progressive Web App • Why Progressive Web App

• Characteristics Of Progressive Web App

• Core Tenets Of Progressive Web App- Service Workers

• App Shell • App Manifest • First Progressive Web App Intro

• Install And Verify Web Server • Architect The App Shell

• Implement Your App Shell • JavaScript App Code.

Session

192 Hours

• Start App With Fast First Load • Differentiating The First Run

• Inject Data • Test App • Use Service Workers

• Register The Service Worker • Cache The Site Assets

• Test Out In Offline Mode.

Progressive Web App - IISession

202 Hours

14

Project 2Session 21, 22, 23, 24