Grundkurs

Angular Camp 2020
Das 360°-Intensivtraining mit Angular-Koryphäe Manfred Steyer
Präsentiert von Entwickler 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

DIENSTAG – DONNERSTAG

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

Bereits am Tag eins entwickeln Sie gemeinsam mit Angular-Experte Manfred Steyer eine erste funktionsfähige Anwendung.

  • Eine Angular-Anwendung mit der CLI erstellen
  • Projektstruktur und Konventionen
  • Eine erste Komponente
  • Datenbindung
  • HTTP-Zugriff
  • Observables und RxJS

 

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

Kommende Termine:

24. – 26. November 2020 | Remote

22. – 24. Februar 2021 | Remote