Angular JS 2.0

Angular 2.0 JS

Objectives:
Angular 2.0 is a productive Web Frameworks for developing complex Single Page Application with RESTFul backend server. Software Developer should learn Angular correctly to use in production applications, to get all the benefits and features offered by AngularJS. This training includes extensive workshop sessions, in-depth content, with hands-on from an experienced Software Architect, Developer & Trainer.

Advanced Angular 2.0 Training covers introductory to intermediate to advanced topics, designed to meet day-to-day challenges faced by software developers while developing AngularJS Application. The course sessions are designed to build a project in iterative mode with best practices followed in the industry such as task automation, unit tests, code lint, modular design, cache, deep understanding REST & HTTP APIs, debugging application & navigations. By end of the training, developers shall have experience of applying all concepts learned on a project, ready to apply skills on production applications.

The course is designed for 3 days, with hands-on and depth understanding of fundamentals. Right from beginning of the training, we introduce best practices, teaching Angular 2.0 with proven patterns.

  • Course Outline:
    Day 1
  • Angular 2 Introduction
  • Single Page Application
  • MVC Pattern
  • Single Page vs Multi-page application
  • Introduction to Components
  • Environment Setup Node.js
  • Mock API Server
  • Setup Gulp
  • Setup up NPM project
  • Setup Karma
  • Visual Studio Code
  • Chrome remote debugging options
  • Debugging with Visual Studio Code
  • Angular 2 cli introduction and features
  • Angular 2 Get Started Minimal Angular 2 Application with Components, List Page, Detail
  • Page, Services
  • File Structure for large Angular Application
  • Type Script &
  • ECMA 2016/ES6
  • Introduction to Type Script, data types
  • Template String
  • Block Scope, Constant, Variables
  • TypeScript Classes, Inheritance, Interfaces
  • TypeScript modules, export, import
  • TypeScript static type checking
  • ES6 features, arrow functions
  • TypeScript Compiler
  • Typings, Definitely Typed,
  • TypeScript Definition Manager
  • Angular 2 Components
  • Creating Components
  • Providers
  • Component selector
  • Component Templates
  • Component Styles
  • Property Binding [One way, Two way]
  • Event Binding
  • Get data into Component through Input
  • Subscribing to components events through output
  • Nested Component
  • Deeper Nesting of Components
  • Components Events
  • Component Life Cycle
  • Accessing Other Components
  • Directives Attribute Directives (NgStyle, NgClass)
  • Structural Directives (NgIf, NgFor, NgSwitch)
  • Angular Templates Template Syntax
  • Function Calls
  • Property Binding Syntax
  • Two Way Binding
  • One way Binding
  • Interpolation
  • Textcontent
  • Syntatic Sugars in Angular 2
  • bing-prop, on-event, bindon-twowayprop
  • Pipes Pipes Introduction
  • Creating custom Pipes
  • Passing Arguments to Pipes
  • Registering Pipes
  • Chaining Pipes
  • Services Implementing Services in Angular
  • Service Dependency
  • Dependency Injection
  • Injectable decorators
  • Provider definition
  • Provider configuration at Angular Bootup

Day 2

  • Observables
  • Introduction to Reactive Extension (RxJS) Library
  • What is Reactiveness
  • Observables
  • Subscription
  • Events
  • Streaming in Observables
  • Promises
  • Promises Introduction
  • Custom Promises
  • Promises vs Observable
  • Custom Directives Creating Custom Attribute Directives
  • Creating Custom Structural Directives
  • Event handlings in Custom directives
  • Using Input
  • Forms Form Controls
  • Control Groups
  • Form Validation
  • Form Builder
  • Form Builder Validation
  • Custom Validation
  • Routing Route Introduction
  • Configuring Routes
  • Redirection
  • Linking
  • Passing values/parameters between Routes
  • Router Outlet
  • Nested Routing /Child Routes
  • Handling Query Parameters
  • HTTP Angular 2 HTTP
  • HTTP GET, POST, PUT and DELETE
  • URL Query Parameters
  • Promises
  • HTTP with Observables
  • Cross Origin Request/CORS Headers
  • Cross Origin Requests/JSONP
  • Application Architecture, Component Tree
  • Bootstraping Angular tree of components
  • Angular Observables
  • Angular Immutables
  • Angular 2 bootstrapping process
  • Gulp Introduction to Gulp
  • Gulp task, watch, src and dest apis
  • Gulp streaming
  • Gulp Best Practices

Day 3

  • TypeScript
  • Advanced TypeScript
  • Custom Decorator
  • Property Decorator
  • Class Decorator
  • Parameter Decorators
  • HTML5
  • Storage
  • Introduction to local storage
  • Introduction to session storage
  • Security with HTML5 storage
  • Cookie fundamentals
  • Web Workers Web Threading
  • Web Workers
  • Unit Testing Angular 2
  • Test Driven Development
  • Introduction to Jasmine
  • Introduction to Karma
  • Jasmine Test Suites, Specs, Expectations
  • Jasmine Matchers
  • Jasmine Custom Matchers
  • Setup Injection, Environment for Angular 2 testing
  • Testing a Components
  • Testing a Service
  • Testing with HTTP
  • Mocking HTTP with MockBackend
  • Testing Directives
  • Testing Pipes
  • Testing Routes (Introduction)
  • SASS Working with SASS
  • Gulp and SASS
  • Generate CSS from SASS
  • Module Loaders
  • Introduction to Webpack
  • Introduction to SystemJS
  • Loading Angular Application with WebPack
  • Loading Angular Application with SystemJS