Workshop: Angular – Structured Introduction

Workshop with all backgrounds on the building blocks in Angular. Remote or in-house.

Develop the background knowledge necessary for your successful projects on all building blocks and concepts in Angular.

Manfred Steyer beim Angular Training

Proven Angular training for your success!

In this training, you will learn from well-known insiders and experts from the very beginning, using many examples, how you can successfully develop modern applications with Angular:

  • A continuous case study shows all of Angular's concepts in the context of a business application.
  • Learn best practices for sustainable development.
    A mix of lecture, live coding and many exercises guarantees that it will never be boring.
  • Use the post-training case study as a template for your own projects
  • Learn valuable background about the concepts and ideas behind the possibilities of Angular.
  • We conduct this training in Germany, Austria and Switzerland. The in-house version of this training can be adapted to your specific project requirements on request.

Optional - Remote Workshops: All of our trainings and consultations can now optionally be booked as remote workshops!

The course of the training at a glance!

Concepts in TypeScript

TypeScript

TypeScript is the language behind Angular. It is a surplus of JavaScript and is compiled (transpiled) according to JavaScript.

We assume that you already have experience with a programming language and therefore focus here on the differences to known mainstream languages ​​such as C # or JAVA and on pitfalls.

  • Object oriented concepts
  • Functional concepts
  • Differences to other languages ​​like C # or JAVA
  • Pitfalls
  • Asynchronous programming

Get started with Angular

Angular

We develop the first functional application on the first day. The following aspects are examined:

  • Build an Angular application using the CLI
  • Project structure and conventions
  • A first component
  • Data binding
  • HTTP access
  • Observables and RxJS

Services Dependency Injection (DI)

Dependency Injection in Angular

To improve our application, we introduce services and use dependency injection to increase testability:

  • Understand the ideas behind DI
  • Provide reusable business logic through services
  • Token and provider
  • Types of providers
  • Hierarchical DI and scopes
  • Tree-shakable provider

Components

Angular Komponenten

Then we look at the many details of components and find out how data binding really works for components.

We use the knowledge gained to create additional components that communicate with each other. This makes our application modular and easier to maintain:

  • Templates
  • Communication between components
  • Property bindings
  • Event bindings
  • Two-way bindings
  • How data binding works in Angular
  • Cycles and other traps
  • Lifecycle hooks

Forms

Angular Formulare

Angular is particularly strong when dealing with forms. There are even two object models for this: template-driven forms and reactive forms.

Here we look at these two variants and find out when which option is the better one. We also look at the many different types of validation:

  • Use template-driven forms
  • Use reactive (imperative) forms
  • Check values with predefined validators
  • Write your own validators
  • Asynchronous validators
  • Multifield validators

Angular Modules

Angular Module

Angular modules allow our large application to be divided into manageable parts. In this section, we look at the ideas behind modules, their implementation, and module categorization, which is usually the norm in Angular applications.

In this section we will extend the maintainability of our application by dividing it into modules. This also ensures that the application can “grow”:

  • Understand the Angular modular system
  • Root modules
  • Feature modules
  • Shared modules
  • Core modules
  • Modules and dependency injection

Routing

Angular Router

The router is the linchpin of most Angular applications. It simulates pages within a single page application and allows deep linking:

  • Create navigation structures with routing
  • Configure the router
  • Transfer and read out routing parameters
  • Performance optimization with lazy loading

Testing

Angular Testing

Another great feature of Angular is the built-in support for automated testing. These are, on the one hand, isolated unit tests and, on the other hand, integration or end-2-end tests:

  • Unit tests with Jasmine and Karma
  • End-2-end tests with Jasmine and Protractor
  • Use of dependency injection, mocks and spies to increase testability
  • Integrated auxiliary constructs for testing
    Test coverage

Further Topics

We use the rest of the time to discuss further topics and to test them on the basis of our case study. As with all items on the agenda, we can also take your individual project situation into account:

  • RxJS and Observables and Reactive Architectures
  • Performance tuning
  • Authentication
  • State management

By the way, we have a lot to tell about these and other advanced topics. That is why we also offer our advanced workshop with a focus on enterprise solutions and architectures with Angular.

The trainer has incredible knowledge of Angular and beyond and explains very understandably."

Participant in June 2019, Vienna

Only One Step Away!

Send us your inquery today - we help you with pleasure!

Jetzt anfragen!