Bei der Erstellung von Single-Page-Applikationen mit dem Web-Framework Angular generieren wir viele eigene UI-Komponenten. Um die Zeit und den Aufwand bei der Entwicklung zu sparen, werden oft externe Libraries (z.B. Angular Material), welche fertige Lösungen für wiederkehrende UI-Komponenten bereitstellen, in dem Projekt eingesetzt. Dabei kommt es oft dazu, dass die ein oder die andere Komponente nicht ganz den Anforderungen des Projektes entspricht. An dieser Stelle müssen die Entwickler eigene UI-Komponente bauen. Um das Erstellen eigener Komponente zu erleichtern, stellt das Angular-Team den Entwickler das Angular Component Dev Kit (Angular CDK) zur Verfügung. Angular CDK bietet uns zahlreiche Bausteine, um individuelle Komponenten zu erstellen.

In diesem Workshop schauen wir uns an, was alles in Angular CDK drin steckt und welche Möglichkeiten wir haben. Dabei werden wir neben den oft vorkommenden UI-Komponenten, wie z.B. Dropdown oder Dialogfenster, auch komplexere Komponenten, wie z.B. Drag&Drop-Komponente, selber mittels Angular CDK bauen.

Der Workshop ist an die Teilnehmer gerichtet, welche schon praktische Erfahrungen mit dem Web-Framework Angular gesammelt haben. Auf deinem Notebook solltest du NodeJS ab Version 10+ und Angular CLI in der Version 8 installiert haben.