Angular, 3rd Edition

Angular, 3rd Edition

by Manfred Steyer
Released September 2021
Publisher(s): dpunkt
ISBN: 9783960091660

Read it now on the O’Reilly learning platform with a 10-day free trial.

O’Reilly members get unlimited access to books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial

Book description

Manfred Steyer, bekannter Trainer und Berater mit Schwerpunkt Angular, berücksichtigt in seinem Praxisbuch alle aktuellen Entwicklungen einschließlich der Version 12. Die 3. Auflage erleichtert durch eine flachere Lernkurve den Einstieg.

Anhand eines Beispielprojekts werden zunächst die Grundlagen des komponentenorientierten Frameworks vermittelt: Komponenten, Datenbindung und Formulare, Services, Pipes, Module, Routing sowie die dazugehörige Testautomatisierung. Der erste Teil vermittelt das nötige Rüstzeug, um erfolgreich eine erste Angular-Anwendung zu entwickeln.Anschließend geht es um weiterführende Themen, die für komplexe Geschäftsanwendungen wichtig sind: moderne Security-Szenarien, Internationalisierung, Performance-Tuning, reaktive Architekturen und State Management mit NgRX und RxJS, Bibliotheken und Monorepos.

Table of contents

  1. Cover
  2. Titel
  3. Impressum
  4. Inhalt
  5. Vorwort
  6. 1 Projekt-Setup
    1. Visual Studio Code
    2. Angular CLI
    3. Node.js und Angular CLI installieren
    4. Ein Projekt mit der CLI generieren
    5. Angular-Anwendung starten
    6. Build mit CLI
    7. Projektstruktur von CLI-Projekten
    8. Internet Explorer 11
    9. Eine Style-Bibliothek installieren
    10. Alternativen zu Bootstrap
    11. Zusammenfassung
  7. 2 Erste Schritte mit TypeScript
    1. Motivation
    2. Mit TypeScript starten
      1. Hallo Welt!
      2. Variablen deklarieren
      3. Ausgewählte Datentypen in TypeScript
      4. Ein erstes Objekt samt Modul
      5. Auto-Importe mit Visual Studio Code
      6. Klassen
      7. Funktionen und Lambda-Ausdrücke
    3. Interfaces und Vererbung
      1. Interfaces
      2. Klassenvererbung
      3. Type Assertion (Type Casting)
      4. Abstrakte Klassen
      5. Zugriff auf die Basisklasse
    4. Ausgewählte Sprachmerkmale
      1. Getter und Setter
      2. Generics
      3. Exceptions
      4. Spread-Operator
      5. Strikte Null-Prüfungen
    5. Asynchrone Operationen
      1. Callbacks und die Pyramide of Doom
      2. Promises
      3. async und await
      4. Bedeutung von Promises in Angular
    6. Zusammenfassung
  8. 3 Eine erste Angular-Anwendung
    1. Angular-Komponente erzeugen
    2. Komponentenlogik
    3. Auf das Backend zugreifen
    4. Templates und die Datenbindung
      1. Two-Way-Binding
      2. Property-Bindings
      3. Direktiven
      4. Pipes
      5. Event-Bindings
      6. Das gesamte Template
    5. Komponenten einbinden
    6. Anwendung ausführen und debuggen
      1. Anwendung starten
      2. Fehler in der Entwicklerkonsole entdecken
      3. Die Anwendung im Browser debuggen
      4. Debuggen mit Visual Studio Code
    7. Zusammenfassung
  9. 4 Komponenten und Datenbindung
    1. Datenbindung in Angular
      1. Rückblick auf AngularJS 1.x
      2. Property-Binding
      3. Event-Bindings
      4. Das Zusammenspiel von Property- und Event-Bindings
      5. Bindings im Template
      6. Two-Way-Bindings
    2. Eigene Komponenten mit Datenbindung
      1. Überblick
      2. Vorbereitungen
      3. Eine Komponente mit Property-Bindings
      4. Komponenten mit Event-Bindings
      5. Komponenten mit Two-Way-Bindings
    3. Life-Cycle-Hooks
      1. Ausgewählte Hooks
      2. Experiment mit Life-Cycle-Hooks
      3. Angular und Zyklen
      4. DateControl mit Life-Cycle-Hooks
    4. Zusammenfassung
  10. 5 Services und Dependency Injection
    1. Ein erster Service
    2. Services austauschen
    3. Services mit klassischen Providern konfigurieren
    4. Einen Service lokal registrieren
    5. Arten von Providern
      1. useClass
      2. useValue
      3. useFactory
      4. useExisting
      5. multi
    6. Konstanten als Tokens
    7. Zusammenfassung
  11. 6 Pipes
    1. Überblick
    2. Built-in-Pipes
    3. Eigene Pipes
      1. Pure Pipes
      2. Implementierung einer einfachen Pipe
      3. Pipes registrieren und nutzen
    4. Weiterführende Konstellationen
      1. Pipes und Objekte
      2. Pipes und Direktiven
      3. Pipes und Services
      4. Aufräumarbeiten mit ngOnDestroy
    5. Zusammenfassung
  12. 7 Module
    1. Motivation
    2. Eine Angular-typische Modulstruktur
    3. Shared Modules
    4. Feature-Modules
    5. Root-Modules
    6. Module reexportieren
    7. Zusammenfassung
  13. 8 Routing
    1. Überblick
    2. Erste Schritte mit dem Router
      1. Routing-Konfiguration für das AppModule einrichten
      2. Routing-Konfiguration für Feature-Modules einrichten
      3. Platzhalter in AppComponent hinterlegen
      4. Hyperlinks zum Aktivieren von Routen einrichten
    3. Parametrisierte Routen
      1. Arten von Routing-Parametern
      2. Parameter in Komponenten auslesen
      3. Parametrisierte Routen konfigurieren
      4. Auf parametrisierte Routen verweisen
    4. Hierarchisches Routing mit Child-Routes
      1. Überblick über Child-Routes
      2. Child-Komponente implementieren
      3. Child-Komponente registrieren
      4. Hyperlinks zum Aktivieren von Child-Routen einrichten
    5. Aux-Routes
      1. Platzhalter für Aux-Routes
      2. Komponente für Aux-Route erzeugen
      3. Konfiguration für Aux-Route
      4. Verweise auf Aux-Routes einrichten
    6. Mit dem Query-String und dem Hash-Fragment arbeiten
      1. QueryString und Hash-Fragment programmatisch beeinflussen
      2. Query-String und Hash-Fragment deklarativ beeinflussen
      3. Query-String und Hash-Fragment auslesen
    7. HTML5-Routing vs. Hash-Routing
      1. PathLocationStrategy
      2. HashLocationStrategy
    8. Zusammenfassung
  14. 9 Template-getriebene Formulare und Validierung
    1. FormsModule einbinden
      1. Eingaben validieren
      2. Zugriff auf den Zustand des Formulars
    2. Bedingte Formatierung von Eingabefeldern
    3. Eigene Validierungsdirektiven
      1. Eine erste Validierungsdirektive erstellen
      2. Parametrisierbare Validierungsdirektiven
      3. Multi-Field-Validatoren erstellen
      4. Asynchrone Validatoren
    4. Komponente zum Präsentieren von Validierungsfehlern
    5. Die Standardsteuerelemente von HTML nutzen
      1. Checkboxen
      2. Radiobuttons
      3. Drop-down-Felder
    6. Zusammenfassung
  15. 10 Reaktive Formulare
    1. Erste Schritte mit reaktiven Formularen
      1. Modul einbinden
      2. Das Formular mit einem Objektgraphen beschreiben
      3. Reactive Formulare mit dem FormBuilder beschreiben
      4. Einen Objektgraphen an ein Formular binden
      5. Werte ins Formular schreiben
    2. Validatoren
      1. Synchrone Validatoren
      2. Parametrisierte Validatoren
      3. Asynchrone Validatoren
      4. Multi-Field-Validatoren für reaktive Formulare
    3. Geschachtelte Formulare
      1. Geschachtelte FormGroups
      2. Wiederholgruppen mit FormArray
    4. Dynamische Formulare
    5. Zusammenfassung
  16. 11 Reactive Extensions Library for JavaScript (RxJS)
    1. Grundlegende Typen von RxJS
      1. Observables, Observer und Operatoren
      2. Observables instanziieren
      3. Subjects
    2. Observables vs. Promises
      1. Observables in Promises umwandeln
      2. Promises in Observables umwandeln
    3. Gruppen von Operatoren
      1. Creation Operators
      2. Transformation Operators
      3. Filtering Operators
      4. Join Operators
      5. Error Handling Operators
      6. Multicasting Operators
      7. Utility Operators
    4. Reaktiver Entwurf
    5. Flattening
    6. Datenflüsse kombinieren
      1. Der Operator combineLatest
      2. combineLatest vs. withLatestFrom
      3. Der Operator merge
    7. Multicasting
      1. Motivation für Multicasting
      2. Hot vs. Cold Observables
    8. Fehlerbehandlung
    9. Observables schließen
    10. Reaktive Services
    11. Zusammenfassung
  17. 12 Testautomatisierung
    1. Jasmine und Karma
      1. Aufbau eines Jasmine-Tests
      2. Tests mit Karma ausführen
      3. Karma auf dem Build-Server
    2. Angular und Jasmine
      1. Komponenten mit dem TestBed testen
      2. Arbeiten mit Attrappen (Mocks)
      3. Gray-Box-Tests mit Spys
      4. HTTP-Zugriffe simulieren
      5. Asynchrone Tests
      6. Templates mit DOM-Zugriffen testen
      7. Direktiven testen
      8. Pipes testen
    3. Testabdeckung ermitteln
    4. Zusammenfassung
  18. 13 Performancetuning
    1. Optimierte Datenbindung mit OnPush
      1. Datenbindung visualisieren
      2. Immutables
      3. Immutables und Datenbindung
      4. Observables und Datenbindung
      5. Immutables und/oder Observables
      6. Manuelle Änderungsverfolgung
    2. Lazy Loading von Routen
      1. Routen für das Lazy Loading einrichten
      2. Lazy Loading im Browser nachvollziehen
      3. Lazy Loading und Tree-Shakable Provider
      4. Lazy Loading, klassische Provider und Shared Modules
      5. Korrekte Nutzung von SharedModules beim Einsatz von Lazy Loading
    3. Preloading
      1. Preloading aktivieren
      2. Eigene Preloading-Strategien entwickeln
      3. Selektives Preloading mit eigener Preloading-Strategie
    4. Zusammenfassung
  19. 14. Querschnittsfunktionen
    1. Guards
      1. Das Aktivieren von Routen verhindern
      2. Das Deaktivieren einer Komponente verhindern
    2. Events
    3. Resolver
      1. Vorbereitungen
      2. Resolver erzeugen und verwenden
    4. HttpInterceptoren
    5. Zusammenfassung
  20. 15. Authentifizierung und Autorisierung
    1. Cookie-basierte Security
    2. Cookies und XSRF
    3. Tokenbasierte Security
    4. OAuth 2 und OpenID Connect
      1. OAuth 2
      2. Benutzer mit OpenID Connect authentifizieren
      3. JSON Web Token
      4. OAuth-2- und OIDC-Flows
    5. OAuth 2 und OIDC mit Angular nutzen
    6. Zusammenfassung
  21. 16 Internationalisierung
    1. I18N mit dem Angular-Compiler
      1. Überblick
      2. @angular/localize installieren
      3. Texte markieren
      4. Strings in der Komponentenklasse markieren
      5. Texte extrahieren
      6. Übersetzte Texte in Builds integrieren
      7. Sprache beim Einsatz von ng serve festlegen
      8. Übersetzungstexte zur Laufzeit angeben
      9. Grammatikalische Formen berücksichtigen
      10. Unterschiedliche Formate unterstützen
      11. Manuell weitere Formate laden
    2. ngx-translate
      1. Überblick
      2. Bibliothek installieren und konfigurieren
      3. Sprachdateien bereitstellen
      4. Texte einbinden
      5. Texte zur Laufzeit laden
      6. Sprachwechsel
      7. Grammatikalische Formen berücksichtigen
      8. Unterschiedliche Formate nutzen
      9. Lazy Loading
    3. Zusammenfassung
  22. 17 Reaktive Zustandsverwaltung mit NGRX (Redux)
    1. Zustandsverwaltung mit Services
    2. Das Redux-Muster
    3. NGRX einrichten
    4. Building-Blocks implementieren
      1. State modellieren
      2. Actions festlegen
      3. Reducer definieren
      4. Effect einrichten
    5. Auf den Store zugreifen
    6. Debuggen mit dem Store
    7. Selektoren
      1. Ein erster Selektor
      2. Selektoren verschachteln
    8. Meta-Reducer
    9. Zusammenfassung
  23. 18 Details zu Komponenten und Direktiven
    1. Vorbereitungen
    2. Weiterführende Aspekte von Komponenten
      1. Content Projection
      2. Parent-Komponenten referenzieren
      3. View und Content
      4. Kommunikation über Template-Variablen
      5. Kommunikation über Services
    3. Attributdirektiven
      1. Direktiven definieren
      2. Mit der Umwelt kommunizieren
      3. Direktiven und Template-Variablen
    4. Strukturelle Direktiven
      1. Templates und Container
      2. Microsyntax
      3. Eine einfache DataTable umsetzen
      4. ViewContainerRef direkt zum Einblenden von Templates verwenden
      5. Bestehende ViewContainer ergänzen
      6. Dialoge dynamisch einblenden
      7. ViewContainerRef direkt zum dynamischen Erzeugen von Komponenten verwenden
      8. Komponenten für Formularfelder
    5. Ausgaben formatieren und Eingaben parsen
    6. Eigene Formularsteuerelemente
    7. Zusammenfassung
  24. 19 Wiederverwendbare Bibliotheken und Monorepos
    1. Monorepo erstellen
    2. Aufbau von Bibliotheken
    3. Bibliothek in Monorepo ausprobieren
    4. npm-Paket bauen und bereitstellen
    5. npm-Paket konsumieren
    6. Zusammenfassung
  25. Index
  26. Über den Autor

Product information

  • Title: Angular, 3rd Edition
  • Author(s): Manfred Steyer
  • Release date: September 2021
  • Publisher(s): dpunkt
  • ISBN: 9783960091660