Angular Architektur: Planung und State Management

Ziele

In diesem Kurs zur Angular Architektur lernen die Beteiligten kennen, wie sie eine robuste und skalierbare Angular-Architektur aufrichten, die einfach zu refaktorisieren und zu warten ist. Die Teilnehmer lernen außerdem Techniken zur Komponentenkommunikation, Zustandsverwaltung, Codeorganisation, allgemeine Best Practices, Performance-Betrachtungen und mehr.

Zielgruppe

Sehr gute Erfahrung mit Angular und TypeScript WebEntwickler, Softwareentwickler, Programmierer, Softwarearchitekten

Voraussetzungen

Dieser Kurs richtet sich an erfahrene Entwicklerinnen und Entwickler mit Grundkenntnissen in Angular, die ihre Fähigkeiten in der Architektur und Strukturierung von Angular-Anwendungen vertiefen möchten. Voraussetzung sind Kenntnisse in TypeScript und grundlegende Erfahrung mit Angular-Komponenten, Modulen und Diensten. Der Kurs vermittelt fortgeschrittene Techniken zur Komponentenkommunikation, Zustandsverwaltung mit NgRx und die Nutzung von RxJS. Ziel ist es, robuste, skalierbare und gut wartbare Anwendungsarchitekturen zu entwerfen.

Agenda

Einführung

Planung der Anwendungsarchitektur

• Architecture Überlegungen
• Architecture Planning Template
• Angular Style Guide

Organisieren von Funktionen und Modulen

• Organisieren von Funktionen und Modulen
• Core und Shared Module
• Verhindern des Reimports von Core
• Überprüfen der Modulorganisation
• Benutzerdefinierte Bibliotheken

Strukturieren von Komponenten 

• Container- und Präsentationskomponenten
• Passing State mit Input- und Output-Properties
• Change Detection Strategien
• ngOnChanges: Reference vs. value
• Klon-Techniken
• Komponentenvererbung

Komponentenkommunikation

• Techniken der Komponentenkommunikation
• RxJS-Themen
• Erstellen eines Event Bus Service
• Erstellen eines Observable Service
• Abmelden von Observables

State Management

• Die Notwendigkeit von State Management
• Optionen für State Management
• Dienste verwenden
• NgRx verwenden
• Verwendung von ngrx-data
• Verwendung von Observable Store
• Überprüfung der Optionen für die Zustandsverwaltung

Zusätzliche Betrachtungen

• Interfaces, Klassen und Enums
• Functions vs. Pipes
• Hinzufügen eines Memo Decorators
• HttpClient- und RxJS-Operatoren
• Verwendung von Interceptors