Angular – Moderne Webprogrammierung

Angular ist ein leistungsfähiges OpenSource-Framework zur Entwicklung moderner und komplexer Web-Anwendungen. Es ist der Nachfolger des Frameworks AngularJS und basiert auf der Sprache TypeScript. Wir benutzten im folgenden Beispiel Angular Version 7.

In diesem Tutorial werden zunächst einige Konfigurationen vorgenommen um anschließend ein neues Angular Projekt zu erstellen und zu starten.

Entwicklungsumgebung konfigurieren

Um eine Angular-App zu erstellen benötigst du die Angular CLI (Command Line Interface). Mit Hilfe dieser kannst du Anwendungen über einfache Terminalbefehle erstelllen. Die Angular CLI benötigt wiederum eine aktuelle Node.js Version. Node.js ist eine Laufzeit Umgebung (RTE - runtime environment) um JavaScript Code außerhalb eines Webbrowsers auszuführen.

Besorge dir also zunächst eine aktuelle Node.js Version:
https://nodejs.org/en/

um anschließend über ein Terminal die Angular CLI zu installieren:

npm install -g @angular/cli

Neues Projekt erstellen und Starten

Angular Projekt erstellen

ng new first-angular-application

Während der Erstellung einer neuen Angular Anwendung aktivierst du das Angular Routing, indem du die Frage „Would you like to add Angular Routing?“ mit Ja beantwortest. Außerdem muss angegeben werden welches Sylesheetformat benutzt werden soll. In unserem Beispiel wählen wir SCSS.

Folgende Ordnerstruktur wird erstellt: