Freitag, 09:00 Uhr

Zukunftsfähige Clientarchitekturen mit Angular Elements, Web Components und Micro Apps

Heutzutage erhalten wir neue Webtechnologien und -Frameworks am laufenden Band. Das ist aufregend, aber auch überwältigend. Framework-unabhängige Web Components und Micro Apps bieten Abhilfe für dieses Dilemma.

Hier erfährst Du, wie Du mit Angular Elements auf einfache Art und Weise Web Components erstellen kannst. Wir befassen uns mit Shadow DOM, dynamischen Laden, dem Umgang mit zone.js sowie Strategien zum effektiven Bundling mit und ohne ngIvy. Am Ende setzen wir alles zusammen, um Micro Apps zu implementieren, kleine und flexible Clients, die der Idee von Microservices folgen und unabhängig von autarken Teams entwickelt werden können.

Vorkenntnisse:
* Angular-Grundlagen

Lernziele:
* Web Components mit Angular Elements entwickeln können
* Micro Apps auf der Basis von Angular Elements entwickeln können

Technische Anforderungen:
Die Teilnehmer sollten bitte vorinstallieren:

• NodeJS in aktueller Version


• Editor: Visual Studio Code (frei) oder IntelliJ/WebStorm/PhpStorm


• Angular CLI: npm i -g @angular/cli


• Git-Client

Agenda:

ab 08.00 Registrierung und Begrüßungskaffee

09.00: Beginn

• Überblick über Web Components


• Custom Elements und Shadow DOM mit Browser APIs


• Externe Custom Elements mit Angular nutzen


• Übung

10.30 - 10.45: Kaffeepause

• Web Components mit Angular Elements


• Lazy Loading von Angular Elements


• Übung

12.15 - 13.15: Mittagspause

• Externe Angular Elements


• Optimierte Bundles mit ngIvy


• Teilen von Abhängigkeiten


• Differential Loading


• Übung

14.30 - 14.45: Kaffeepause

• Content Projection mit Angular Elements


• Zoneless Change Detection


• Micro Apps auf der Basis aller bisher betrachteten Aspekte


• Übung

ca. 16.30 Uhr: Ende