Angular Komplettkurs
Classroom Schulung | Deutsch | Anspruch
Schulungsdauer: 3 Tage Durchführung gesichert
Ziele
In diesem Kurs lernen Sie die Erstellung einer Single-Page-Application, TypeScript, Angular-Systemsprache und die Vorteile der komplexeren Funktionen des Frameworks kennen.
Zielgruppe
Web-Entwickler, Web-Programmierer mit Erfahrung mit HTML, CSS, JavaScript
Voraussetzungen
Gute JavaScript-Kenntnisse
Agenda
Einführung Typescript
- Überblick und Einordnung zu ECMA Script
- Basisdatentypen
- Konstanten und Variablen (let und var)
- Getter und Setter
- Klassen
- Interfaces
- Operatoren und Funktionen
- Dekoratoren
Angular- CLI - Projektorganisation
- ng-new - Ein Applikationsgrundgerüst
- ng-init – Projektupdate
- ng-serve – Anwendungsstart über Proxy
- ng-start – Anwendungsstart über cli
- ng-lint – Angular Style Guide
Drittanbieter Bibliotheken Einbindung
- CSS Präprozessor verenden
- Bootstrap verwenden
- Semantic UI einbinden
Angular - Komponenten
- Grundbausteine einer Anwendung
- Selektoren
- Property Binding – mit Komponenten kommunizieren
- Event Binding – Reaktion auf Ereignisse
- Komponentenschnittstellen definieren (Input-, Output-, Two-Way-Data- Bindings)
- Lebenszyklus einer Komponente
Angular - Direktiven (Html erweitern)
- Manipulation von DOM- Eigenschaften
- ElementRef
- HostListener
- Strukturdirektiven (*ngFor, *ngIf, [ngSwitch])
- Standarddirektiven
- Pipes
Angular – Services
- Dependency Injection – Code in Services auslagern
- Abhängigkeiten anfordern
- Eingebaute Abhängigkeiten
- Bereitstellung von Abhängigkeiten
Angular – Routing
- Routen konfigurieren
- Routing- Parameter
- Routing in Module einbauen
- Routen verlinken
- Routen verschachteln
- Weiterleitung
Angular - Http
- Einfache Requests mit http
- Benutzerdefinierte Anfragen über die Request-Klasse
- Request erweitern mit zusätzlichen Header
- JSONP
Angular – Reaktive Programmierung (RxJS)
- Observables
- Operatoren
Angular – Formulare
- Template Driven Forms
- Reactive Forms
- Eigene Validatoren
Angular – Module
- Modulkonzept
- Aufteilung in Module
- Shared Module
- Lazy Loading von Modulen
- Routen absichern
- Asynchrone Daten vorladen
- Modulloader (Webpack und SystemJS)
Einführung Softwaretest
- Tests mit Karma
- Test mit Protractor
- Tests mit Jasmine
Projekt Deployment
- ng-build – deploybare Builds erstellen
- Applicationstatus verwalten mit Redux – Übersicht
- AOT – Modus
Ziele
In diesem Kurs lernen Sie die Erstellung einer Single-Page-Application, TypeScript, Angular-Systemsprache und die Vorteile der komplexeren Funktionen des Frameworks kennen.
Zielgruppe
Web-Entwickler, Web-Programmierer mit Erfahrung mit HTML, CSS, JavaScript
Voraussetzungen
Gute JavaScript-Kenntnisse
Agenda
Einführung Typescript
- Überblick und Einordnung zu ECMA Script
- Basisdatentypen
- Konstanten und Variablen (let und var)
- Getter und Setter
- Klassen
- Interfaces
- Operatoren und Funktionen
- Dekoratoren
Angular- CLI - Projektorganisation
- ng-new - Ein Applikationsgrundgerüst
- ng-init – Projektupdate
- ng-serve – Anwendungsstart über Proxy
- ng-start – Anwendungsstart über cli
- ng-lint – Angular Style Guide
Drittanbieter Bibliotheken Einbindung
- CSS Präprozessor verenden
- Bootstrap verwenden
- Semantic UI einbinden
Angular - Komponenten
- Grundbausteine einer Anwendung
- Selektoren
- Property Binding – mit Komponenten kommunizieren
- Event Binding – Reaktion auf Ereignisse
- Komponentenschnittstellen definieren (Input-, Output-, Two-Way-Data- Bindings)
- Lebenszyklus einer Komponente
Angular - Direktiven (Html erweitern)
- Manipulation von DOM- Eigenschaften
- ElementRef
- HostListener
- Strukturdirektiven (*ngFor, *ngIf, [ngSwitch])
- Standarddirektiven
- Pipes
Angular – Services
- Dependency Injection – Code in Services auslagern
- Abhängigkeiten anfordern
- Eingebaute Abhängigkeiten
- Bereitstellung von Abhängigkeiten
Angular – Routing
- Routen konfigurieren
- Routing- Parameter
- Routing in Module einbauen
- Routen verlinken
- Routen verschachteln
- Weiterleitung
Angular - Http
- Einfache Requests mit http
- Benutzerdefinierte Anfragen über die Request-Klasse
- Request erweitern mit zusätzlichen Header
- JSONP
Angular – Reaktive Programmierung (RxJS)
- Observables
- Operatoren
Angular – Formulare
- Template Driven Forms
- Reactive Forms
- Eigene Validatoren
Angular – Module
- Modulkonzept
- Aufteilung in Module
- Shared Module
- Lazy Loading von Modulen
- Routen absichern
- Asynchrone Daten vorladen
- Modulloader (Webpack und SystemJS)
Einführung Softwaretest
- Tests mit Karma
- Test mit Protractor
- Tests mit Jasmine
Projekt Deployment
- ng-build – deploybare Builds erstellen
- Applicationstatus verwalten mit Redux – Übersicht
- AOT – Modus