TI209
Information technology

Angular : Mastering Google's Front-End Framework

Build robust web applications with Angular and TypeScript

This in-depth training is designed for developers, architects, and project managers aiming to master Angular, Google’s powerful framework for building modern, scalable web applications.
It covers core Angular concepts including syntax, modular architecture, components, services, form handling, routing, HTTP integration, and CLI tools. TypeScript is explored in detail, along with modern JavaScript features (ES6+), dependency injection, and best development practices.
Participants will also learn unit testing strategies with Jasmine, Karma, and Protractor, explore project structuring techniques, and understand key principles of TDD and BDD for building robust applications. Migration guidance from AngularJS is also included.

Is it for you ?

Architects, developers, and web project managers.

Prerequisites

• Good knowledge of web technologies and modern Front-End development tools
• knowledge of JavaScript.

What You'll Walk Away With

  • Master modern JavaScript (ES6+) and TypeScript to structure Angular applications
  • Design full Angular applications using components, modules, services, and dependency injection
  • Implement routing, forms, and HTTP communication for dynamic applications
  • Use Angular CLI and tooling to streamline development, build, and optimization
  • Test and improve application quality with Jasmine, Karma, and TDD/BDD practices

Training content

1 Developing with JavaScript: Reminders

  • Presentation of ECMAScript 5 best practices
  • General presentation of ES7/ES6/ES2015
  • Syntax innovations: scope, template string, arrow functions, promises
  • Object-oriented JavaScript development with class syntax
  • Observer/observable design pattern (ES7)
  • RX.js library
  • Essential tools: Babel, Traceur, and TypeScript
  • In-depth TypeScript
  • ES6/2015: modular approach
  • ES7: asynchronous treatment management with await async
  • Module Loaders: Webpack, import/export

2 Transition from AngularJS 1.x to Angular 

  • Comparison of concepts
  • Migration process
  • Structure of an Angular application
  • Key Angular modules
  • Dependency injection principle
  • Directive classification: component, attribute, structure
  • Decorators: definition of hierarchies

3 The ng or @angular/cli Utility

  • Using the command-line utility
  • Scaffolding a project structure
  • Configuration of task utilities
  • Launching a development/production server (build)
  • Ahead of Time Compilation
  • The concept of “Tree Shaking”
  • Application Bootstrapping

4 Definition of Components

  • Understanding Web Components
  • Angular Compiler: Change Detection
  • Template syntax: interpolation/expression, binding, and filters
  • Transformation directives: ngIf, ngFor, ngSwitch
  • Local and template variables
  • Component class
  • Configuration directives: selector, provider
  • User events and custom logical events: EventEmitter

5 Classification of Application Components

  • Module, RouterModule, SharedModule
  • Component, Directive, Pipe, Service, Guard
  • Dependency injection overview
  • Creation of injectable services
  • Service classification
  • Configuration of the injector
  • Decorators
  • @Host, @ContentChild, @ViewChild
  • Pure JavaScript function, PurePipe

6 Form Management, Routing, and HTTP Request

  • FormControl and FormGroup
  • TDF versus DDF: Template Driven Form and Data Driven Form
  • Validation and custom error handling
  • Data binding via HTTP
  • Management and configuration of HTTP exchanges at the application level
  • Route creation
  • Intercept routing parameters and wildcard
  • Targeting, "router-outlet" routing events
  • Route management and configuration in the component tree

7 Unit Testing

  • Configure the testing environment
  • Introduction to Karma and Jasmine
  • Writing tests with Jasmine
  • Writing integration tests with Protractor
  • Code coverage
  • Code coverage indices
  • BDD (Behavior Driven Development), TDD (Test Driven Development)
  • Test cases: pipe, component, application
  • Angular Coding Style Guide.
See more

📌 Practical information

Our training sessions are offered in Montreal or Quebec City, in person or in a virtual classroom. Dates and locations are specified when you select your session below. If you have any questions, check out our FAQ.

Trainers

Upcoming information
Duration
4 days
Schedule
9h to 16h
Regular fee
$1,950
Preferential fee A preferential rate is offered to public institutions, to members of certain professional organizations as well as to companies that do a certain amount of business with Technologia. To know more, please read the "Registration and rates" section on our FAQ page. Please note that preferential rates are not available for online training courses. Discounts cannot be combined with other offers.
$1,755
Private or personalized training

Do you have several employees interested in the same training course? Whether in person at your offices or remotely in virtual mode, we offer private training courses tailored to your team's needs. Group rates are available. Contact us for more details or request a quote online.

Request a quote

Request in-company training

Do you have several employees interested in the same training course? Whether in person at your offices or remotely in virtual mode, we offer private training courses tailored to your team's needs. Group rates are available. Contact us for more details or request a quote online.

Tell us more
Added to cart View my cart