Willkommen, schön sind Sie da!
Logo Ex Libris

Angular

  • Fester Einband
  • 977 Seiten
(1) Bewertungen ansehen
Bewertungen
(1)
(0)
(0)
(0)
(0)
Alle Bewertungen ansehen
Lernen Sie die Möglichkeiten von Angular kennen! Angular-Webapplikationen professionell entwickeln Einführung, Praxis, TypeScript ... Weiterlesen
20%
54.90 CHF 43.90
Auslieferung erfolgt in der Regel innert 2 bis 4 Werktagen.
Bestellung & Lieferung in eine Filiale möglich

Beschreibung

Lernen Sie die Möglichkeiten von Angular kennen! Angular-Webapplikationen professionell entwickeln Einführung, Praxis, TypeScript und RxJS Formulare, Routing, HTTP-Anbindung, Animationen, i18n, reaktive Anwendungen, Performance-Tuning Angular ist das JavaScript-Framework für professionelle Webapplikationen - hier lernen Sie es umfassend kennen! Christoph Höller macht Sie mit allen relevanten Technologien, Standards und Kernbestandteilen des Angular-Frameworks vertraut. Am Praxisbeispiel einer Projektverwaltung führt Ihnen der Webprofi die Komponenten und Konzepte von Angular vor. Formulare, Routing, HTTP-Anbindung und Testing - hier lernen Sie Schritt für Schritt, wie Sie eigene Angular-Webapplikationen erstellen. Inkl. aller neuen Features und Komponenten. Aktuell inkl. Material Design. Aus dem Inhalt: Angular-Kickstart Komponenten & Direktiven Pipes, Services, Dependency-Injection Angular-CLI Modularisierung Formulare HTTP-Anbindung Echtzeitunterstützung Internationalisierung Animationen Performance-Optimierung ECMAScript, TypeScript, RxJS Material Design NPM-Libraries und Mono-Repos WebComponents Server-Side Rendering Die Fachpresse zur Vorauflage: iX - Magazin für professionelle Informationstechnik: "Das Buch bietet Expertenwissen in einer fast unglaublichen Tiefe."

Autorentext
Christoph Höller ist selbstständiger IT-Consultant mit den fachlichen Schwerpunkten Konzeption und Implementierung hochverfügbarer Unternehmensapplikationen auf Basis des Java-EE-Stacks, Entwicklung von responsiven Webapplikationen mit JavaScript, AngularJS und Big-Data-Speichern, UML-Modellierung, Objektorientierte Softwareentwicklung.

Klappentext

Lernen Sie die Möglichkeiten von Angular kennen!

  • Angular-Webapplikationen professionell entwickeln
  • Einführung, Praxis, TypeScript und RxJS
  • Formulare, Routing, HTTP-Anbindung, Animationen, i18n, reaktive Anwendungen, Performance-Tuning
Angular ist das JavaScript-Framework für professionelle Webapplikationen - hier lernen Sie es umfassend kennen! Christoph Höller macht Sie mit allen relevanten Technologien, Standards und Kernbestandteilen des Angular-Frameworks vertraut. Am Praxisbeispiel einer Projektverwaltung führt Ihnen der Webprofi die Komponenten und Konzepte von Angular vor. Formulare, Routing, HTTP-Anbindung und Testing - hier lernen Sie Schritt für Schritt, wie Sie eigene Angular-Webapplikationen erstellen. Inkl. aller neuen Features und Komponenten. Aktuell inkl. Material Design.

Aus dem Inhalt:

  • Angular-Kickstart
  • Komponenten & Direktiven
  • Pipes, Services, Dependency-Injection
  • Angular-CLI
  • Modularisierung
  • Formulare
  • HTTP-Anbindung
  • Echtzeitunterstützung
  • Internationalisierung
  • Animationen
  • Performance-Optimierung
  • ECMAScript, TypeScript, RxJS
  • Material Design
  • NPM-Libraries und Mono-Repos
  • WebComponents
  • Server-Side Rendering


Die Fachpresse zur Vorauflage:

iX - Magazin für professionelle Informationstechnik: »Das Buch bietet Expertenwissen in einer fast unglaublichen Tiefe.«



Inhalt



Geleitwort des Fachgutachters zur zweiten Auflage ... 25


Einleitung ... 27


1. Angular-Kickstart: Ihre erste Angular-Webapplikation ... 29


1.1 ... Installation der benötigen Software ... 29

1.2 ... Hallo Angular ... 31

1.3 ... Die Blogging-Anwendung ... 41

1.4 ... Zusammenfassung und Ausblick ... 56



2. Das Angular-CLI: professionelle Projektorganisation für Angular-Projekte ... 59


2.1 ... Das Angular-CLI installieren ... 60

2.2 ... ng new: ein Grundgerüst für die Applikation erstellen ... 60

2.3 ... ng serve: die Anwendung starten ... 67

2.4 ... npm start: Start über die lokale CLI-Version ... 71

2.5 ... ng generate: Komponenten generieren ... 72

2.6 ... ng update: Angular und weitere Abhängigkeiten auf die neueste Version updaten ... 76

2.7 ... ng lint: Linting und der Angular-Style-Guide ... 78

2.8 ... Komponenten- und Ende-zu-Ende-Tests ausführen ... 80

2.9 ... CSS-Präprozessoren verwenden ... 83

2.10 ... Drittanbieter-Bibliotheken einbinden ... 84

2.11 ... ng add: Angular-spezifische Abhängigkeiten zu Ihrer Anwendung hinzufügen ... 86

2.12 ... ng build: deploybare Builds erstellen ... 88

2.13 ... Configurations: Konfiguration unterschiedlicher Build- und Ausführungsumgebungen ... 90

2.14 ... Der AOT-Modus ... 96

2.15 ... Zusammenfassung und Ausblick ... 97



3. Komponenten und Templating: der Angular-Sprachkern ... 99


3.1 ... Etwas Theorie: der Angular-Komponentenbaum ... 99

3.2 ... Selektoren: vom DOM-Element zur Angular-Komponente ... 103

3.3 ... Die Templating-Syntax: Verbindung zwischen Applikationslogik und Darstellung ... 106

3.4 ... Komponentenschnittstellen definieren: von der einzelnen Komponente zur vollständigen Applikation ... 126

3.5 ... ViewChildren: Zugriff auf Kind-Elemente aus der Komponentenklasse ... 137

3.6 ... Content-Insertion: dynamische Komponentenhierarchien erstellen ... 140

3.7 ... Der Lebenszyklus einer Komponente ... 150

3.8 ... Zusammenfassung und Ausblick ... 161



4. Direktiven: Komponenten ohne eigenes Template ... 163


4.1 ... ElementRef und Renderer2: Manipulation von DOM-Eigenschaften eines Elements ... 164

4.2 ... HostBinding und HostListener: Auslesen und Verändern von Host-Eigenschaften und -Events ... 168

4.3 ... Anwendungsfall: Einbinden von Drittanbieter-Bibliotheken ... 171

4.4 ... Anwendungsfall: Accordion-Direktive - mehrere Kind-Komponenten steuern ... 176

4.5 ... exportAs: Zugriff auf die Schnittstelle einer Direktive ... 179

4.6 ... Zusammenfassung und Ausblick ... 181



5. Fortgeschrittene Komponentenkonzepte ... 183


5.1 ... Styling von Angular-Komponenten ... 183

5.2 ... TemplateRef und NgTemplateOutlet: dynamisches Austauschen von Komponenten-Templates ... 195

5.3 ... ViewContainerRef und ComponentFactory: Komponenten zur Laufzeit hinzufügen ... 202

5.4 ... NgComponentOutlet: dynamisch erzeugte Komponenten noch einfacher verwalten ... 213

5.5 ... ChangeDetection-Strategien: Performance-Boost für Ihre Applikation ... 218

5.6 ... Zusammenfassung und Ausblick ... 230



6. Standarddirektiven und Pipes: wissen, was das Framework an Bord hat ... 233


6.1 ... Standarddirektiven ... 234

6.2 ... Pipes: Werte vor dem Rendern transformieren ... 247

6.3 ... Zusammenfassung und Ausblick ... 271



7. Services und Dependency-Injection: lose Kopplung für Ihre Business-Logik ... 273


7.1 ... Grundlagen der Dependency-Injection ... 274

7.2 ... Services in Angular-Applikationen ... 276

7.3 ... Das Angular-Dependency-Injection-Framework ... 277

7.4 ... Injection by Type: Vereinfachungen für TypeScript-Nutzer ... 281

7.5 ... Weitere Provider-Formen ... 284

7.6 ... Der hierarchische Injector-Baum: volle Flexibilität bei der Definition Ihrer Abhängigkeiten ... 288

7.7 ... Treeshakable-Providers: der DI-Mechanimus auf den Kopf gestellt ... 297

7.8 ... Sichtbarkeit und Lookup von Dependencys ... 298

7.9 ... Zusammenfassung und Ausblick ... 305



8. Template-driven Forms: einfache Formulare auf Basis von HTML ... 307


8.1 ... Grundlagen zu Formularen: template-driven oder reaktiv? ... 308

8.2 ... Das erste Formular: Übersicht über die Forms-API ... 309

8.3 ... NgModel im Detail: Two-Way-Data-Binding oder nicht? ... 315

8.4 ... Kurzexkurs: Verwendung von Interfaces für die Definition des Applikationsmodells ... 319

8.5 ... Weitere Eingabeelemente ... 322

8.6 ... Verschachtelte Eigenschaften definieren ... 328

8.7 ... Validierungen ... 330

8.8 ... Implementierung der Tags-Liste: wiederholbare Strukturen mit Template-driven Forms ... 346

8.9 ... updateOn: steuern, wann Änderungen übernommen werden ... 350

8.10 ... Zusammenfassung und Ausblick ... 351



9. Reactive Forms: Formulare dynamisch in der Applikationslogik definieren ... 353


9.1 ... Aktivierung von Reactive Forms für Ihre Applikation ... 354

9.2 ... Das Task-Formular im reaktiven Ansatz ... 354

9.3 ... Formulare und Kontrollelemente auf Änderungen überwachen ... 376

9.4 ... Fallbeispiel: Umfragebogen - Formulare komplett dynamisch definieren ... 377

9.5 ... ControlValueAccessor: eigene Eingabeelemente für die Forms-API implementieren ... 384

9.6 ... Die Forms-API im Überblick ... 390

9.7 ... Zusammenfassung und Ausblick ... 394



10. Routing: Navigation innerhalb der Anwendung ... 397


10.1 ... Project-Manager: die Beispielanwendung ... 398

10.2 ... Die erste Routenkonfiguration: das Routing-Framework einrichten ... 399

10.3 ... Location-Strategien: »schöne URLs« vs. »Routing ohne Server-Konfiguration« ... 404

10.4 ... ChildRoutes: verschachtelte Routenkonfigurationen erstellen ... 407

10.5 ... RouterLinkActive: Styling des aktiven Links ... 413

10.6 ... Routing-Parameter: dynamische Adresszeilenparameter auswerten ... 415

10.7 ... Aus der Anwendungslogik heraus navigieren ... 426

10.8 ... Routing-Guards: Routen absichern und die Navigation generisch beeinflussen ... 428

10.9 ... Redirects und Wildcard-URLs ... 434

10.10 ... Data: statische Metadaten an Routen hinterlegen ... 436

10.11 ... Resolve: dynamische Daten über den Router injizieren ... 437

10.12 ... Der Title-Service: den Seitentitel verändern ... 441

10.13 ... Router-Tree und Router-Events: generisch auf Seitenwechsel reagieren ... 442

10.14 ... Location: direkte Interaktion mit der Adresszeile des Browsers ... 445

10.15 ... Mehrere RouterOutlets: maximale Flexibilität beim Routing ... 448

10.16 ... Zusammenfassung und Ausblick ... 454



11. HTTP: Anbindung von Angular-Applikationen an einen Webserver ... 455


11.1 ... Die Server-Applikation ... 456

11.2 ... Das Angular-HTTP-Modul verwenden ... 460

11.3 ... Der erste GET-Request: Grundlagen zur HTTP-API ... 460

11.4 ... Asynchrone Service-Schnittstellen modellieren: Anpassung des TaskService ... 464

11.5 ... Die AsyncPipe: noch eleganter mit asynchronen Daten arbeiten ... 466

11.6 ... HttpParams: elegant dynamische Suchen definieren ... 467

11.7 ... Die observe-Eigenschaft: die komplette HttpResponse auswerten ... 470

11.8 ... POST, PUT, DELETE, PATCH und HEAD: Verwendung der weiteren HTTP-Methoden ... 471

11.9 ... JSONP ... 479

11.10 ... Zusammenfassung und Ausblick ... 483



12. Reaktive Architekturen mit RxJS ... 485


12.1 ... Kurzeinführung in RxJS ... 486

12.2 ... Implementierung einer Typeahead-Suche ... 493

12.3 ... Reaktive Datenarchitekturen in Angular-Applikationen ... 502

12.4 ... Anbindung von Websockets zur Implementierung einer Echtzeitanwendung ... 519

12.5 ... ChangeDetectionStrategy.OnPush: Performance-Schub durch die reaktive Architektur ... 525

12.6 ... Zusammenfassung und Ausblick ... 526



13. Komponenten- und Unit-Tests: das Angular-Testing-Framework ... 529


13.1 ... Karma und Jasmine: Grundlagen zu Unit- und Komponententests in Angular-Anwendungen ... 530

13.2 ... Der erste Unit-Test: einfache Klassen und Funktionen testen ... 534

13.3 ... Isolierte Komponenten testen: Grundlagen zu Komponententests mit dem Angular-Testing-Framework ... 539

13.4 ... Mocks und Spies: Komponenten mit Abhängigkeiten testen ... 544

13.5 ... Services und HTTP-Backends testen ... 552

13.6 ... Formulare testen ... 557

13.7 ... Direktiven und ngContent-Komponenten testen ... 563

13.8 ... async und fakeAsync: mehr Kontrolle über asynchrone Tests ... 566

13.9 ... Routing-Funktionalität testen ... 568

13.10 ... Zusammenfassung und Ausblick ... 572



14. Integrationstests mit Protractor ... 575


14.1 ... Start der Tests und Konfiguration von Protractor ... 576

14.2 ... Anpassung der Applikationskonfiguration über die angular.json ... 578

14.3 ... Das browser-Objekt und Locators: Übersicht über die Kernbestandteile von Protractor ... 581

14.4 ... Page-Objects: Trennung von Testlogik und technischen Details ... 587

14.5 ... Formulare und Alert-Boxen testen: der Edit-Task-Test ... 590

14.6 ... Seitenübergreifende Workflows testen ... 593

14.7 ... Debugging von Protractor-Tests ... 597

14.8 ... Screenshots anfertigen ... 599

14.9 ... Zusammenfassung ... 602



15. NgModule und Lazy-Loading: Modularisierung Ihrer Anwendungen ... 605


15.1 ... Feature-Modules: Teilbereiche der Applikation kapseln ... 606

15.2 ... Shared-Modules: gemeinsam genutzte Funktionalität kapseln ... 614

15.3 ... Services und Modularisierung ... 618

15.4 ... Lazy-Loading von Applikationsbestandteilen ... 622

15.5 ... entryComponents: dynamisch geladene Komponenten registrieren ... 626

15.6 ... Zusammenfassung und Ausblick ... 627



16. Der Angular-Template-Compiler, Ahead-of-time Compilation und Tree-Shaking ... 629


16.1 ... Grundlagen zum Angular-Template-Compiler ... 630

16.2 ... Der Ahead-of-time-Compilation-Modus: Leistungsschub für Ihre Anwendung ... 632

16.3 ... Tree-Shaking der Anwendung mit Rollup ... 634

16.4 ... Implementierungsregeln beim Einsatz von AOT ... 637

16.5 ... Zusammenfassung und Ausblick ... 640



17. Internationalisierung: mehrsprachige Angular-Anwendungen implementieren ... 643


17.1 ... Die Grundlagen des i18n-Frameworks ... 644

17.2 ... ng-xi18n: automatische Generierung der Message-Datei ... 648

17.3 ... Description und Meaning: Metadaten für Übersetzer übergeben ... 652

17.4 ... Weitere Übersetzungstechniken ... 653

17.5 ... Pluralisierung und geschlechterspezifische Texte ... 655

17.6 ... Statisch übersetzte Applikationen im AOT-Modus generieren ... 662

17.7 ... Zusammenfassung und Ausblick ... 666



18. Das Animation-Framework: Angular-Anwendungen animieren ... 669


18.1 ... Die erste Animation: Grundlagen zum Animation-Framework ... 670

18.2 ... void und *: spezielle States zum Hinzufügen und Entfernen von DOM-Elementen ... 674

18.3 ... Animationen in Verbindung mit automatisch berechneten Eigenschaften ... 677

18.4 ... Animation-Lifecycles: auf den Start und das Ende von Animationen reagieren ... 679

18.5 ... Keyframes: Definition von komplexen, mehrstufigen Animationen ... 680

18.6 ... Styling von Komponenten, die in Animationen verwendet werden ... 682

18.7 ... Groups und Sequences: mehrere Animationen kombinieren ... 683

18.8 ... Querying: komplexe Komponenten animieren ... 686

18.9 ... Staggering: ausgefeilte Listenanimationen definieren ... 690

18.10 ... Animation von Routing-Vorgängen ... 692

18.11 ... Zusammenfassung und Ausblick ... 697



19. Vollendet in Form und Funktion: Material Design und Angular Material ... 699


19.1 ... Material Design ... 700

19.2 ... Angular Material ... 716

19.3 ... Zusammenfassung ... 762



20. NPM-Libraries und Mono-Repos: Funktionalität in Bibliotheken auslagern und per NPM veröffentlichen ... 765


20.1 ... Das Angular-CLI Projekt einrichten ... 766

20.2 ... Die generierte Bibliothek im Detail ... 769

20.3 ... Die Bibliothek kompilieren und im Demo-Projekt einbinden ... 773

20.4 ... Der Mono-Repo-Ansatz für die Entwicklung von mehreren Webapplikationen ... 776

20.5 ... Die Bibliothek über npm veröffentlichen ... 780

20.6 ... Best Practices für die Implementierung von stylebaren Komponenten ... 787

20.7 ... Zusammenfassung und Ausblick ... 792



21. Angular-Elements: Angular-Komponenten als WebComponent bereitstellen ... 795


21.1 ... Einführung in Custom-Elements und Angular-Elements ... 796

21.2 ... Angular-Komponenten als WebComponents bereitstellen ... 797

21.3 ... Zoneless-Applications: Angular-Anwendungen unabhängig von Zone.js machen ... 806

21.4 ... Den Build für die WebComponent-Auslieferung optimieren ... 808

21.5 ... Die WebComponent in einem Angular-Projekt verwenden ... 810

21.6 ... Die WebComponent in einem Vue-Projekt verwenden ... 812

21.7 ... Zusammenfassung und Ausblick ... 816



22. Server-Side Rendering: Angular-Anwendungen auf dem Server rendern ... 819


22.1 ... Einführung in Server-Side Rendering (SSR): Grundlagen und Vorteile ... 819

22.2 ... Das Angular-Projekt für das Server-Side Rendering vorbereiten ... 822

22.3 ... isPlatformServer und isPlatformBrowser: Wo bin ich gerade? ... 833

22.4 ... Die State-Transfer-API: geladene Daten vom Server auf den Client transferieren ... 834

22.5 ... Title-Service und Meta-Service: Suchmaschinen-Optimierung und Einbindung in Social-Media-Seiten leicht gemacht ... 838

22.6 ... Notwendige Anpassungen am Project-Manager-Code: Stolperfallen und alternative Lösungsansätze beim Server-Side Rendering ... 842

22.7 ... Die Anwendung in der Cloud deployen ... 846

22.8 ... Zusammenfassung ... 856

22.9 ... Schlusswort ... 857



Anhang ... 859


A ... ECMAScript 2015 (and beyond) ... 859

B ... Typsicheres JavaScript mit TypeScript ... 917



Index ... 967

Produktinformationen

Titel: Angular
Untertitel: Das große Handbuch zum JavaScript-Framework. Einführung und fortgeschrittene TypeScript-Techniken, Inkl. Angular Material
Autor:
EAN: 9783836262934
ISBN: 978-3-8362-6293-4
Format: Fester Einband
Herausgeber: Rheinwerk
Genre: Internet
Anzahl Seiten: 977
Gewicht: 1887g
Größe: H246mm x B179mm x T60mm
Jahr: 2019
Auflage: 2. A.
Land: DE