Comprehensive Angular 4 Programming Training Course in Bonn, Germany

Home Training Bonn-Germany Comprehensive Angular 4 Programming

Comprehensive Angular 4 Programming Training in Bonn, Germany

Enroll in or hire us to teach our Comprehensive Angular 4 Programming class in Bonn, Germany by calling us @303.377.6176. Like all HSG classes, Comprehensive Angular 4 Programming may be offered either onsite or via instructor led virtual training. Consider looking at our public training schedule to see if it is scheduled: Public Training Classes

Provided there are enough attendees, Comprehensive Angular 4 Programming may be taught at one of our local training facilities.


We offer private customized training for groups of 3 or more attendees.
get pricing information
Course Description
This Comprehensive Angular 4 training covers all major topics required to fully use this next generation of the Angular framework. In this course developers will learn to use Angular Directives and to create Angular Components and Services to develop applications based on the Model-View-Controller (MVC) architecture. You will learn to use HTML Templates to define views and to connect views with code using output, two-way, event and property bindings. The course reviews the benefits and challenges of Single Page Applications and how to overcome those challenges using the Angular Router. The course also covers everything you need to know about Typescript - a programming language based on JavaScript that is used to create Angular 4 applications. In addition to the basics of using the Angular 4 framework, you will also learn advanced topics not covered in our 3 day Introduction to Angular 4 Programming class. This includes specifics about how to consume REST web services and WebSocket data from Angular 4 applications. Advanced use of the Angular Routing module and Angular Animations are covered. You will learn how to develop Angular 4 applications using AngularCLI. Details of how to test and debug Angular 4 applications are covered in addition to best practices for the style and organization of Angular 4 projects. Course Length: 5 Days Course Tuition: $2090 (US)

Prerequisites
Students should have some prior understanding of web development using, HTML, CSS and JavaScript. Experience developing with AngularJS or Angular 2 (the prior versions) is not required.

Course Outline

Chapter 1 - Introducing Angular

What is Angular?

Central Features of the Angular Framework

Why Angular?

Scope and Goal of Angular

Angular vs. AngularJS

But Isn't It "Angular 2"?

Installing and Using Angular

Adding Angular and Dependencies to Your App

Building Blocks of an Angular Application

A Basic Angular Application

Basic App - index.html

Basic-App: Application Module File

Basic-App: Main Bootstrap File

Basic-App: The Component File

Major Changes in Angular 4

Summary

Chapter 2 - Development Setup of Angular

Angular is Modular

Managing Angular Files and Dependencies

What is Node.js?

Application of Node.js

Installing Node.js and NPM

"Hello World!" Node app

Node Libraries

Node Package Manager (NPM)

Package.json

Semantic Version Numbering

Package Version Numbering Syntax

Updating Packages

Uninstalling Packages

Installing Angular Packages

Angular CLI

Angular Development Overview

Angular Development Dependencies

TypeScript Definitions

Testing Tools

Development Servers

Angular Application Dependencies

Module Loaders

SystemJS Module Loader

WebPack Module Bundler

Additional Application Dependencies

Summary

Chapter 3 - Introduction to TypeScript and ES6

Programming Languages for Use with Angular

TypeScript Syntax

Programming Editors

The Type System – Defining Variables

The Type System – Defining Arrays

The Type System – Classes & Objects

Class Constructors

Class Constructors – Alternate Form

Interfaces

Parameter and Return Value Types

Working with Modules

TypeScript Transpilation

var, let and const - Defined

var, let and const - Usage

Arrow Functions

Template Strings

Template Strings – Variables and Expressions

Template Strings – Multiline

Generics - Class

Generics - Methods

Generics - Restricting Types

Generics - Restricting Types: Example

Summary

Chapter 4 - Components in Angular

What is a Component?

An Example Component

Component Starter

Developing a Simple Login Component

The HTML Component Template

The templateUrl property

Component Decorator Properties

Component Lifecycle Hooks

Using a Lifecycle Hook: OnInit

Summary

Chapter 5 - Data and Event Binding

Binding Syntax

One-Way Output Binding

Binding Displayed Output Values

Two-Way Binding of Input Fields

Input Binding Examples

Binding Events

Binding Events Examples

Setting Element Properties

Setting Properties: Examples

Passing Data into Components using @Input()

Passing Data from Child to Parent using @Output()

@Output() Example - Child Component

@Output() Example - Parent Component

Summary

Chapter 6 - Attribute Directives and Property Bindings

What are Directives

Directive Types

Apply Styles by Changing Classes

Changing Classes – Example

Applying Styles Directly

Applying Styles Directly - Example

Obsolete Directives and Property Binding

Controlling Element Visibility

Setting Image Source Dynamically

Setting Hyperlink Source Dynamically

Summary

Chapter 7 - Structural Directives

Structural Directives

Adding and Removing Elements Dynamically

If-Else Syntax of ngIf

Declare Variables in ngIf

Looping Using ngFor

ngFor - Basic Syntax

ngFor - Full Template Syntax

Creating Tables with ngFor

ngFor Local Variables

ngFor Changes in the backing data source

Swapping Elements with ngSwitch

ngSwitch - Basic Syntax

ngSwitch - Full Template Syntax

Summary

Chapter 8 - Template Driven Forms

Template Driven Forms

Importing Forms Module

A Basic Angular Form

Binding Input Fields

Accessing the Form Object

Binding the Form Submit Event

The Submit Function

Basic HTML5 Validation - "required" Attribute

HTML5 vs. Angular Validation

Angular Validators

Angular Validation State

Displaying Form Validation State

Displaying Field Validation State

Displaying Validation State Using Classes

Disabling Submit when Form is Invalid

Submitting the Form

Binding to Object Variables

Additional Input Types

Checkboxes

Select (Drop Down) Fields

Rendering Options for Select (Drop Down)

Date fields

Radio Buttons

Summary

Chapter 9 - Model Driven Forms

Model Driven Forms Overview

Setup for Model Driven Forms

Form Component Setup

Setup Main FormGroup

formControlName

FormControl Object

Getting Form Values

FormBuilder Form Initialization

Validation

Built-In Validators

Custom Validator

Using a Custom Validator

Useful FormGroup and FormControl Properties/Functions

Sub FormGroups - Component Class

Sub FormGroups - HTML Template

Why Use Sub FormGroups

Summary

Chapter 10 - Angular Modules

Why Angular Modules?

Angular Built-in Modules

The Root Module

How to Create a Module

Feature Modules

@NgModule Properties

Using One Module From Another

Importing BrowserModule or CommonModule

Lazy-Loaded Modules

How to Organize Modules?

Relative Paths for Resources

Summary

Chapter 11 - Services and Dependency Injection

What is a Service?

Creating a Basic Service

What is Dependency Injection?

What Dependency Injection Looks Like

Injecting Services

Dependency Injection Hierarchy Diagram

Using a Service in a Component: Dedicated Instance

Injection Hierarchy - Dedicated Instance

Using a Service in a Component: Dedicated Instance - Example Code

Using onInit to Initialize Component Data

Using a Shared Service Instance

Injection Hierarchy - Shared Instance

Dependency Injection and @Host

Dependency Injection and @Optional

Summary

Chapter 12 - HTTP Client

The Angular HTTP Client

Using The HTTP Client - Overview

Importing HttpModule

Importing Individual Providers into Services

Service Using Http Client

Service Imports

The Observable object type

What does an Observable Object do?

Making a Basic HTTP GET Call

Using the Service in a Component

The PeopleService Client Component

Client Component Code Review

Importing Observable Methods

Enhancing the Service with .map() and .catch()

Using .map()

Using .catch()

Using toPromise()

GET Request

GET Request with Options

POST Request

POST Request Example

Reading HTTP Response Headers

Summary

Chapter 13 - Consuming REST Web Services in Angular

REST Web Services and Angular

Understanding REST

REST Example – Create

REST Example – Retrieve

REST Example – Update

REST Example – Delete

REST Example – Client Generated ID

REST Example – JSON

Knowledge of the REST API

Common Angular Tasks for REST Communication

Angular Service Class Using HTTP Client

RequestOptions

URL Path Parameters

Query Parameters

Common HTTP Request Headers

Override Default Request Options

Returning Response Data

DELETE

GET

PUT

POST

Security of REST APIs

Summary

Chapter 14 - Consuming WebSockets Data in Angular

Web Sockets Overview

Web Sockets Use Cases

Web Socket URLs

Web Sockets Servers

Web Socket Client

The socket.io-client library

Using socket.io-client in JavaScript

Setting up socket.io-client in Angular Projects

Using socket.io-client in an Angular service

Angular websocket.service Notes:

The Angular Web Socket Client Sample App

Angular websocket.component.ts

The Full websocket.component.ts code

Implementation Modifications

Summary

Chapter 15 - Pipes and Data Formatting

What are Pipes?

Course Directory [training on all levels]

Technical Training Courses

Software engineer/architect, System Admin ... Welcome!

Business Training Courses

Project Managers, Business Analysts, Paralegals ... Welcome!

Upcoming Classes

Gain insight and ideas from students with different perspectives and experiences.

CompTIA Security+ (Exam SY0-501)
22 June, 2020 - 26 June, 2020
Developing Applications For Linux (LFD401)
13 July, 2020 - 16 July, 2020
ASP.NET MVC 5 Using C#
27 July, 2020 - 29 July, 2020
.NET Framework Using C#
13 July, 2020 - 16 July, 2020
20483: Programming in C#
22 June, 2020 - 26 June, 2020
See our complete public course listing

Comprehensive Angular 4 Programming Training in Bonn, Germany

Course Description

Prerequisites

Course Outline

Course Directory [training on all levels]

Interesting Reads Take a class with us and receive a book of your choosing for 50% off MSRP.