Seminar / Kurs : Advanced Angular

Inhalte

In dieser Schulung für fortgeschrittene Angular-Entwickler und Entwicklerinnen lernen Sie alles für Ihre großen und langfristig wartbaren Angular-basierten Unternehmens- und Industrieanwendungen:

Struktur mit Monorepos, Nx und Strategic Design
Microfrontends mit Module Federation und Co.
Reaktive Architekturen mit RxJS
State-Management-Patterns mit NgRx
Performance-Tuning großer Anwendungen
Web Components mit Angular Elements
uvm.

Durch die Übungen ergibt sich nach und nach eine Anwendung, die Sie am Ende des Workshops für Ihre eigenen Projekte nutzen können.

Aktuellste Angular-Features

Wir behandeln alle aktuellen Angular-Features vor dem Hintergrund nachhaltiger Architekturen:

Signals: Reaktivität, RxJS-Interop und Change Detection
Der neue NgRx Signal Store

Bonus: Round Table mit Deinen Trainern

Alle Workshop-Teilnehmer sind zu einem round Table mit den Trainern eingeladen. Hier wird der Workshop zur Beratung: Bringe Deine projektbezogenen Fragen mit und diskutiere sie mit uns.

Du kannst natürlich während des gesamten Workshops Fragen stellen. Dieser Round Table eignet sich jedoch besonders für Fragen, bei denen Du zunächst etas umfangreicher ausholen musst, um Deine aktuelle Projektsituation und Probleme zu erläutern.

Agenda im ÜBERBLICK Advanced Angular – Architektur Workshop Struktur für große Anwendungen: Monorepos, Nx und Strategic Design

Architekturen mit Domain Driven Design (DDD) planen
CLI Workspaces und Monorepos mit Nx
Leichtgewichtige Architekturen mit Standalone Components und APIs
Wiederverwendbare npm-Pakete entwickeln und verteilen
Kategorieren für Bibliotheken, Module und Komponenten
Architekturvorgaben mit Nx und Sheriff erzwingen
Buildperformance: Inkrementelle Builds und Tests sowie Caching
Integration in den CI-Prozess
Anpassbare Bibliotheken mit erweiterten DI-Mustern und Content Projection
Das Open/Closed-Principle in Angular mit eigenen Standalone APIs

Skalierbare Architekturen: Micro Frontends mit Module Federation und Angular Elements

Von Strategic Design zu Micro Frontends
Vor- und Nachteile von Micro Frontends
Mono Repos vs. multiple Repos
Webpack Module Federation zum Laden separat kompilierter und bereitgestellter Micro Frontends nutzen
Dynamisches Module Federation
Module Federation und Standalone Components
Teilen von Abhängigkeiten
Umgang mit verschiedenen Versionen
Kommunikation zwischen Micro Frontends
Frameworkübergreifende Entwicklung mit Angular Elements und Web Components

Moderne Lösungen mit ???? Signals

Konzepte und Building-Blocks: Signals, Computed und Effects
Reaktivität mit Signals
Die Resource API
Korrekter Einsatz von Effects
Linked Signals
Signals und Change Detection
Interop mit RxJS

State Management mit dem neuen NgRx Signal Store

Der State-Layer in Deiner Architektur
Die verschiedenen Betriebsmodi des Signal Stores
View-Models
Normalisierte Zustände
Umgang mit Seiteneffekten
Verwalten von Entitäten
Custom Features für wiederkehrende Anforderungen
Externe Updater: Trennen von Intention und Ausführung
Signal Store und Lazy Loading
RxJS-basierte Seiteneffekte
Signal Store und Resource API
Unterschiede und Gemeinsamkeiten zu Redux

State Management mit dem klassischen NgRx Store und Redux

Das Redux-Muster
Actions und Reducer
Selectors
Effects
@ngrx/entities
Fassasden als Dreh- und Angelpunkt
Der klassische NGRX Store und Signals

Reaktive Architekturen RxJS

Reaktives Denken und reaktiver Entwurf
Chaining/ Piping von Operatoren
Combination Operators
Higher-Order Observables
Implizites und Explizites Schließen
Cold und Hot Observables sowie Multicasting
Subjects nutzen
Fehlerbehandlung
Debugging

Bonus: Moderne Security-Architekturen und Single Sign-on

Existierende Identity-Lösungen wie Active Directory anbinden
Social Login (Login with Facebook etc.)
OAuth 2 sowie 2.1 und OpenId Connect
JSON Web Tokens (JWT)
Token Refresh
Single Sign out
Aktuelle Empfehlungen der OAuth 2 Working Group und Konsequenzen
Tokens im Browser vs. Security Gateways (Backend for Frontends)

Zielgruppe

Fortgeschrittene Angular-Entwickler

Trainer: Manfred Steyer

In dieser Schulung für fortgeschrittene Angular-Entwickler und Entwicklerinnen lernen Sie alles für Ihre großen und langfristig wartbaren Angular-basierten Unternehmens- und Industrieanwendungen: