Angular 4 Course

Angular 4 training will familiarize you with the fundamentals of this language to build SPA applications that will help your business achieve faster ROI due to lesser development and maintenance cost, and faster accessibility.

DURATION:
20 hours

What Will I Learn?

  • Create single-page applications with on of the most modern JavaScript frameworks out there
  • Develop web applications using Angular 4 (or 2)
  • Write cleaner and reusable code for better maintainability
  • Understand and Master the core concepts of Angular 4
  • Learn the basics of TypeScript

Overview/Description
Configuring the environment is the first step in the Angular app development process. In this course, you’ll learn how to install and set up the prerequisites for creating an Angular development environment. The course will cover creating an app root module and root component as part of building a basic Angular application.

Target Audience
Developers who want to learn how to use Angular 4 to create web apps

Is this course right for you?

Angular 4 course is apt for web developers who want to use Angular to build sophisticated applications. Even students who want to make a career in web application development will find this Angular 4 certification course useful.

Prerequisites:

All attendees must have substantial prior experience developing with JavaScript.

Objectives

Module 1: Introduction

  • Course Objectives
  • Course Outline
  • What is Angular
  • Why use Angular

Module 2: AngularJS to Angular 4

  • What’s Changed
  • Semantic Versioning

Module 3: Introduction to TypeScript

  • Why Use TypeScript
  • Basic Types
  • Classes and Interfaces
  • Type Definitions
  • Compiling TypeScript

Module 4: ES2015 Primer

  • Let and Const
  • Template Strings
  • Lambda Functions
  • Modules

Module 5: Environment Setup

  • Node / NPM
  • Polyfills
  • TypeScript
  • Module Bundler (Webpack)
  • Code Linting
  • Test Setup
  • Application File Structure
  • Angular CLI
  • Code Editors

Module 6: Getting Started

  • Our First Component

Module 7: Modules

  • Why use Modules
  • NgModule
  • Declarations
  • Providers
  • Imports
  • Bootstrapping
  • The Core Module
  • Shared Modules

Module 8: Components

  • Introduction to Components
  • Component Architecture Patterns
  • Decorator Metadata
  • State & Behaviour
  • Inputs and Outputs

Module 9: Templates

  • Inline vs External
  • Template Expressions
  • Data Bindings
  • Built-in Structural Directives
  • Built-in Attribute Directives

Module 10: Custom Directives

  • Types of Directive
  • Create your own Structural Directive
  • Create your own Attribute Directive

Module 11: Pipes

  • Built-in Pipes
  • Custom Pipes

Module 12: Services

  • Introduction to Services
  • Building a Service

Module 13: Dependency Injection

  • Introduction to Dependency Injection
  • Injectors & Providers
  • Registering Providers

Module 14: Lifecycle Hooks

  • Component LifeCycle
  • Using ngOnInit
  • All lifecycle Hooks

Module 15: Change Detection

  • What is Change Detection
  • Zone.js

Module 16: Routing

  • The Component Router
  • Defining Routes
  • Navigation
  • Route Params
  • Child Routes

Module 17: Advanced Routing

  • Route Guards
  • Route Resolves

Module 18: Template-driven Forms

  • Introduction to forms
  • Template-driven forms
  • Validation

Module 19: Model-driven Forms

  • Introduction to ‘Reactive’ forms
  • FormGroup & FormControl
  • Validators

Module 20: Asynchronous Operations

  • Introduction to Async
  • Promises
  • Observables
  • Async Pipes
  • HTTP Request / Response

Module 21: Advanced HTTP

  • Headers & Request Settings
  • Providing HTTP

Module 22: Component Styling

  • Introduction to Angular Styling
  • Component Styling
  • Shadow DOM
  • Loading Styles

Module 23: Animation

  • Introduction to Animations
  • State & Transitions
  • Animatable Properties
  • Keyframes

Module 24: Testing

  • Introduction to Testing
  • Unit Testing
  • E2E Testing

Module 25: Security

  • Security in Angular
  • Sanitization
  • Trusting Values
  • Cross-site Request Forgery

Module 26: Internationalization

  • Pre-compiled and runtime
  • Using ng2-Translate

Module 27: Performance

  • Change Detection Strategy
  • Running outside the Zone
  • Web Workers

Module 28: Optimization & Deployment

  • Precompiling (AoT)
  • Lazy Loading
  • Deployment Best Practices
  • Production Mode

Module 29: Upgrading from AngularJS 1.X to Angular 2+

  • Introduction to Upgrading
  • Project Preparation
  • Upgrade Adapter

Module 30: Native Applications

  • Introduction to Native
  • Cordova
  • Ionic
  • React Native
  • NativeScript
  • Progressive Web Apps
  • Electron

Module 31: Server-side Rendering

  • Introduction to Server-side Rendering
  • Angular Universal

Module 32: Conclusion and Resources

Register This Course