Angular 8

Course description

Angular is the successor of the popular AngularJS 1.x framework. It provides several new features, better performance, but also a completely new syntax. An Angular-app is basically a collection of components brought together within modules. The key to learning Angular is understanding how Components are built and how they interact with each other through Services, Inputs, and Outputs.

The framework used to be called Angular 2, but we’ve seen updates following each other in rapid succession (Angular 2 to 8). At the moment we don’t use version numbers anymore. It’s simply Angular. Although the version numbering (“Angular 1” vs. “Angular 2 and higher”) suggests a simple upgrade path, this is definitely not the case.

Angular is a completely different platform, utilizing new concepts and languages (ECMAScript 6, TypeScript). Knowledge cannot simply be transferred between 1 and 2+, nor is upgrading an existing Angular 1 app a trivial task.

In this course you will learn how to build modules, components and build non-trivial apps using services, routing and communication with RESTful API’s. With the knowledge gained in this course you are confident in building your own apps from scratch, or update and maintain apps that are already started by someone else in your team. You can start immediately, building your first Angular-apps!

 

Target Audience

Angular is not a framework for beginners. This course is intended for developers who have a thorough knowledge of HTML, CSS and JavaScript.

 

Prerequisites

  • HTML, CSS, JavaScript
  • Experience with other MV * -frameworks (like .NET MVC or Spring MVC) is helpful, but not absolutely necessary.
  • Practical experience with different platforms and browsers (Edge, Firefox, Chrome) and debugging JavaScript.
  • Experience with AngularJS 1.x and modular development of (web)apps is useful to understand the differences and new concepts. However, it is not necessary to have previous knowledge of AngularJS.
  • Some knowledge of the Node.js platform and installing packages.
  • Knowledge of the English language. Many websites, documentation and background information are available only in English.

 

Table of Contents – high level overview

  • Why Angular? Differences with Angular 1.x (aka “AngularJS”)
  • Angular basics and architecture overview.
  • What’s new in Angular 8.
  • Installation and configuration with NodeJS.
  • Hello World example – a look at the boilerplate code.
  • Modern tooling: Working with Angular-CLI.
    • Generating apps, generating components
    • Building and running apps.
  • Building and debugging Components with TypeScript.
  • Component metadata, templates and styles.
  • Data binding.
    • Simple Data Binding.
    • Event Binding.
    • Attribute binding (aka one-way binding).
    • Two-way data binding.
  • Building and using Services.
  • Dependency Injection of services.
  • Working with external data and Http.
    • Working with HttpClientModule.
  • Applications as a ‘Tree of components’.
  • Passing data between components.
    • Working with @Input() and @Output().
    • Building a custom Service Bus.
  • Routing.
    • Basic Routing.
    • Routing Parameters.
    • Route Guards to protect parts of your application.
  • Forms – Template driven forms and Model driven forms.
    • Building FormGroups.
    • Form Validation.
  • Angular Unit Testing.
  • Angular Next Steps.
    • Working with multiple modules.
    • Advanced Routing & Lazy Loading.
    • State Management strategies.

 

Textbooks and training

Some suggestions for textbooks and online training to be used in, or as a reference after the training. The books and online course are completely optional. Course contents and labs/exercises can be followed without them.