Angular Course

This course covers all the practical aspects of developing applications with Angular. By the end of the course, students will be able to join existing Angular projects and start developing features.

Syllabus

This hands-on training consists of eight modules that cover both basic concepts as well as most of the common pain points engineers face daily when developing single-page applications with Angular.

I. The Development Environment

Introduction to the modern development environment and technologies for front­end development

  • Overview of the stack - NPM / Webpack
  • Working with the Angular CLI
  • Understanding the project structure conventions and
  • Setting the IDE for Angular development
  • Best practices

II. Angular architecture and concepts

Understanding the core concepts and design behind Angular.

  • The Renderer
  • Change detection system
  • Patterns in use
  • The core entities of Angular
  • The use of javascript decorators
  • Best practices and relevant references.

III. TypeScript Primer

Getting familiar with TypeScript, the default language for Angular application development

  • Module system
  • Classes and Interfaces
  • Arrow functions and Template strings
  • Working with types

IV. Angular Module System

  • The need for modules
  • The bootstrapping process
  • Modules API and usage
  • Best practices

V. Components Deep Dive

The component is a core building block of an Angular application. In this module, we will deep dive into the component metadata API.

  • Building a basic component
  • Shadow DOM
  • Templates and Styles
  • The Component class
  • Data bindings and Template syntax
  • Angular core directives
  • Components types review
  • Data projection, building a Wrapper component
  • Component inputs - Working with properties
  • Component outputs - Creating custom events
  • Components communication using local variables
  • Best practices

VI. Dependency injection

Angular uses dependency injection for instantiating and wiring object together.

  • Understanding the role of the Provider
  • Creating and using a class provider
  • Other types of providers
  • Understanding the dependencies injectors hierarchy ­
  • Common patterns and best practices
  • Angular built-in providers

VII. Angular Modules

As a framework, Angular introduces several modules that are aimed for common development challenges.

  • Angular HttpClient Module - communication with the server
  • Angular Reactive Forms - managing complexed forms
  • Angular Router - navigation system

State Management (4th day - optional)

To build a robust architecture for a large Angular app, we use a state management solution to orchestrate a unidirectional data flow and a single source of truth between components.

  • Managing a Reactive State
  • Single Source of Truth and unidirectional data flow
  • Handling Immutability
  • Difference between solutions - NgRx / Redux / MobX
  • Deep-dive into the solution of choice
During the course, the students will be practicing taught material on their laptops and will be able to ask questions related to their current projects.
Contact Us
We are leading front-end consultancy specializing in React, React Native, and Angular. We build web and mobile apps, train teams and consult on complex projects.

Tel AvivIsrael

New York CityUSA

© 500Tech. Building high-quality software since 2012.