EIEIOTECHNOVATION
← Training programmes

EIEIO / PROGRAMMING & DEVELOPMENT

Angular 7

Course outline

2 days
Discuss this programme →

Duration

2 days

Synopsis

Angular 7 is a major Angular release. It brings with it many small improvements and maintains the dependencies and further performance improvements. Therefore, this Angular release prepares for the future. To avoid a premature release with an incomplete version of the Ivy Renderer, the Angular team subjects the new renderer to an internal test phase. Provided that, in a few months the Ivy Renderer release will have smooth integration. With Angular CLI and Material/CDK, the Angular “platform” continuously broadens, and many partner projects are helping to expand the Angular environment.

Course Objective

  • Develop modern, complex, responsive and scalable web applications with Angular 7
  • Fully understand the architecture behind an Angular 7 application and how to use it
  • Use their gained, deep understanding of the Angular 7 fundamentals to quickly establish themselves as frontend developers
  • Create single-page applications with on of the most modern JavaScript frameworks out there

Pre-requisites

  • NO Angular 1 or Angular 2 knowledge is required!
  • Basic HTML and CSS knowledge helps, but isn't a must-have
  • Prior TypeScript knowledge also helps but isn't necessary to benefit from this course
  • Basic JavaScript knowledge is required

Course Outline

Angular Introduction

  • What is Angular
  • Angular vs Angular 7
  • Project setup and First app
  • What is Typescript

Angular Basic

  • How Angular App gets Loaded and Started
  • Creating and Using Components, with CLI and Nesting Components
  • Working with Components Template, Style, and understanding Componesnts Selector
  • What is Databinding
  • String Interpolation, Property & Event Binding, Combining all Forms of Databinding
  • What is Directives
  • Understanding Directives, Using/Styling/Enhancing/Applying ngIf, ngStyle, ngClass

Project Understanding

Debugging

  • Angular Error Message
  • Debugging code in th browser Using Sourcemaps
  • Using Augury to Dive into Angular Apps

Components and Databinding Deep Dive

  • Splitting Apps into Components
  • Binding/Assigning an alias to custom Properties
  • Binding/Assigning an alias to custom Events
  • More understanding view Encapsulation
  • Using Local references in Templates
  • Getting access to the Template & DOM with @ViewChild
  • Understanding the Component Lifecycle
  • Lycycle Hooks in action, Template access

Directives Deep Dive

  • ngFor, ngIf, ngClass and ngStyle Recap
  • Using the Renderer to build a better attribute Directive
  • Using HostListener to listen to host Events
  • Using HostBinding to bind to host Properties
  • Understand ngSwitch

Using Service and Dependencies Injection

  • Why would you need Services
  • Creating logging service
  • Injecting the Logging service into Components
  • Creating Data service
  • What is Hierarchical Injector
  • Injecting Service into service
  • Using services for Cross component communication

Programme scope, delivery arrangements and suitability are confirmed during enquiry.