Herzlich Willkommen zum Workshop – schön, dass du dabei bist! In diesem Workshop wollen wir eine bestehende modulbasierte Angular-Anwendung zu Standalone Components migrieren! Bitte installiere dir das Beispielprojekt vor dem Workshop.
- Aufbau der Anwendung
- Modulstruktur
- vorhandene Komponenten und ihre Aufgaben
- Routing (Lazy Loading und direkte Einbindung)
- Services, Guard und Interceptor
Wir werden diese Anwendung gemeinsam auf Standalone Components umbauen. Es ist deshalb sehr hilfreich, wenn du den Aufbau bereits gut kennst.
Wenn du schon alle benötigte Software installiert hast, musst Du nur noch das Projekt installieren und starten. Klone dazu dieses GitHub-Repository. Danach im Projektverzeichnis:
npm install
npm start
⚠️ Bitte führe die Vorbereitung rechtzeitig VOR dem Workshop aus, damit wir ohne Zeitverlust loslegen können.
- Node.js 16 oder 18 (jeweils die aktuelle Nebenversionsnummer): https://nodejs.org
- (Mac-User sollten ggf. Homebrew verwenden, siehe Anleitung.)
- Google Chrome: https://www.google.com/chrome/
- Visual Studio Code: https://code.visualstudio.com
- Angular Language Service für VS Code: Angular Language Service (
Angular.ng-template)- Installiere die Extension über den Extensions Browser direkt im Editor.
Bitte klone dieses Repo oder lade den Code als ZIP herunter.
Anschließend kannst Du das Angular-Projekt auf deinem Rechner installieren:
cd 2023-05-angular-standalone-duesseldorf
npm installDie Installation kann bei langsamer Internetverbindung sehr lange dauern.
Warte das npm install mit Geduld ab!
Anschließend kannst du das Projekt starten:
npm start
# oder
ng serveAuf http://localhost:4200 sollte nun die Anwendung "Book Rating" erscheinen. Den laufenden Webserver kannst Du danach mit Strg + C beenden.
Wenn bei allen Teilnehmenden das Grundgerüst steht, können wir ohne Zeitverlust loslegen.
Sollte es zu einem Fehler kommen, melde dich einfach per Mail bei uns unter team@angular.schule.
Wir werden schnell eine Lösung finden.
