Meine Filiale

Angular

Das große Handbuch zum JavaScript-Framework. Einführung und fortgeschrittene TypeScript-Techniken, Inkl. Angular Material

Christoph Höller

Buch (gebundene Ausgabe)
Buch (gebundene Ausgabe)
39,90
39,90
inkl. gesetzl. MwSt.
inkl. gesetzl. MwSt.
Sofort lieferbar Versandkostenfrei
Sofort lieferbar
Versandkostenfrei

Weitere Formate

gebundene Ausgabe

39,90 €

Accordion öffnen
  • Angular

    Rheinwerk

    Sofort lieferbar

    39,90 €

    Rheinwerk

eBook (ePUB)

35,90 €

Accordion öffnen

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.«

Die Fachpresse zur Vorauflage:

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

Produktdetails

Einband gebundene Ausgabe
Seitenzahl 977
Erscheinungsdatum 25.01.2019
Sprache Deutsch
ISBN 978-3-8362-6293-4
Reihe Rheinwerk Computing
Verlag Rheinwerk
Maße (L/B/H) 24,6/17,2/6,3 cm
Gewicht 1905 g
Auflage 2. Auflage
Verkaufsrang 33382

Kundenbewertungen

Es wurden noch keine Bewertungen geschrieben.

  • Artikelbild-0


  •   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