Basic Camp
Angular Camp
Das 360°-Intensivtraining mit Angular-Koryphäe Manfred Steyer
Präsentiert von Entwickler.de Akademie
Angular Camp für Einsteiger
Das Angular Camp eignet sich perfekt für Entwickler, die ein neues Projekt mit Angular starten oder schon dabei sind, aber mehr über die Hintergründe erfahren möchten. Grundlegende Erfahrungen mit clientseitigen Web-Technologien sind hilfreich.
Ziel des Angular Camps ist es, Ihnen einen strukturierten Überblick und Hintergrundwissen über die Konzepte und Building Blocks in Angular zu geben. Während der drei Tage wechselt sich eine durchgehende Fallstudie gepaart mit Live-Coding und Best Practices mit kurzen Theorieblöcken ab. Trainer ist Manfred Steyer, eine Koryphäe und einer der ersten Stunde.
DAS ERWARTET SIE: IHRE TRAININGS-INHALTE
MONTAG – MITTWOCH
Tag 1: Konzepte in TypeScript
TypeScript ist die Sprache, die Angular zugrunde liegt. Es handelt sich dabei um eine Übermenge von JavaScript und wird nach JavaScript kompiliert (transpiliert).
Als Teilnehmer des Angular Camps benötigen Sie bereits Erfahrung mit einer Programmiersprache. Der Fokus liegt hier deswegen auf den Unterschieden zu bekannten Mainstream-Sprachen wie C# oder JAVA sowie auf Fallstricke:
- Asynchrone Programmierung
- Objektorientierte Konzepte
- Funktionale Konzepte
- Unterschiede zu anderen Sprachen wie C# oder JAVA
- Fallstricke
Tag 1: Die ersten Schritte mit Angular
Tag 1: Services Dependency Injection (DI)
Um die Anwendung während des Angular Camps zu verbessern, führen Sie mit dem Trainer Services ein und nutzen Dependency Injection zur Erhöhung der Testbarkeit.
- Ideen hinter DI verstehen
- Wiederverwendbare Geschäftslogik per Services zur Verfügung stellen
- Token und Provider
- Arten von Providern
- Hierarchisches DI und Scopes
- Tree-shakable Provider
Tag 1: Angular-Module
Angular-Module erlauben es, unsere große Anwendung in überschaubare Teile zu gliedern. In diesem Abschnitt betrachten Sie die Ideen hinter Modulen, deren Implementierung und eine in Angular-Anwendungen üblicherweise vorherrschende Modul-Kategorisierung.
In diesem Part werden Sie die Wartbarkeit Ihrer Anwendung ausbauen, indem Sie sie mit Manfred Steyer in Module untergliedern. Das stellt auch sicher, dass die Anwendung “wachsen kann”:.
- Das Angular-Modulsystem verstehen
- Root-Module
- Feature-Module
- Shared Module
- Core Module
- Module und Dependency Injection
Tag 2: Komponenten
Im Anschluss betrachten Sie die vielen Details von Komponenten und erfahren, wie die Datenbindung bei Komponenten wirklich funktioniert.
Das gewonnene Wissen wird genutzt, um weitere Komponenten, die miteinander kommunizieren, zu erstellen. Somit wird Ihre Anwendung modular und besser wartbar:
- Templates
- Kommunikation zwischen Komponenten
- Property-Bindings
- Event-Bindings
- Two-Way-Bindings
- Funktionsweise von Datenbindung in Angular
- Zyklen und andere Fallen
- Lifecycle-Hook
Tag 2: Formulare
Angular ist besonders stark beim Umgang mit Formularen. Hierfür gibt es sogar zwei Objektmodelle: Template-driven Forms und Reactive Forms.
Im 360°- Intensivtraining für Angular werden diese beiden Varianten betrachtet und Sie finden heraus, wann welche Option die bessere ist. Gleichzeitig schauen Sie sich mit Manfred Steyer die vielen verschiedenen Arten der Validierung an:
- Template-Driven Forms nutzen
- Reaktive (Imperative) Forms nutzen
- Eingaben mit vordefinierten Validatoren prüfen
- Eigene Validatoren schreiben
- Asynchrone Validatoren
- Multifield-Validatoren
Tag 3: Routing
Der Router ist der Dreh-und-Angelpunkt der meisten Angular-Anwendungen. Er simuliert Seiten innerhalb einer Single-Page-Application und erlaubt Deep-Linking:
- Navigationsstrukturen mit Routing schaffen
- Den Router konfigurieren
- Routing-Parameter übergeben und auslesen
- Performance-Optimierung mit Lazy Loading
Tag 3: Testing
Ein weiteres tolles Merkmal von Angular ist die integrierte Unterstützung für automatisierte Tests. Dabei handelt es sich zum einen um isolierte Unit-Tests und zum anderen um Integrations- bzw. End-2-End-Tests:
- Unit-Tests mit Jasmine und Karma
- End-2-End-Tests mit Jasmine und Protractor
- Nutzung von Dependency-Injection, Mocks und Spies zur Erhöhung der Testbarkeit
- Integrierte Hilfskonstrukte fürs Testing
- Testabdeckung
ANFORDERUNGEN
• NodeJS in aktueller (LTS-)Version
• Angular CLI (npm I -g @angular/cli)
• Visual Studio Code (frei) oder IntelliJ/WebStorm/ PhpStorm (kommerziell)
• Git