Übung: Erstellen einer Azure Functions-App und Umgestalten des Codes

Abgeschlossen

In dieser Übung erstellen Sie eine serverlose Azure Functions-Anwendung, mit der die APIs anstelle der Express-Anwendung ausgeführt werden. Anschließend migrieren Sie die Anwendungslogik von der Node.js Express-Anwendung zur Functions-Anwendung. Dazu müssen Sie den Code nicht neu schreiben. Für die Umgestaltung sind nur ein paar kleine Codeänderungen erforderlich.

Erstellen einer neuen Azure Functions-App

Vergewissern Sie sich, dass die Visual Studio Code-Erweiterung für Azure Functions installiert ist.

  1. Öffnen Sie in Visual Studio Code die Befehlspalette, indem Sie F1 drücken.

  2. Geben Sie Azure Functions: Neues Projekt erstellen ein, und wählen Sie die Option aus.

    Screenshot of Visual Studio Code creating a new function app.

  3. Wählen Sie den Stamm des Repositorys als den Speicherort für das neue Projekt aus.

  4. Geben Sie nach Aufforderung die folgenden Werte ein.

    Name Wert
    Sprache TypeScript
    Auswählen eines TypeScript-Programmiermodells Modell V4
    Vorlage HTTP-Trigger
    Name getVacations

Die Functions-App wird nun für die API-Endpunkte der Anwendung erstellt. In der nächsten Lerneinheit erstellen Sie die Funktionen, mit denen Urlaubsziele aufgelistet, hinzugefügt, aktualisiert und gelöscht werden.

Hinweis

Sie haben die Functions-App im Ordner functions erstellt, der sie von der Angular-App trennt. Sie können selbst entscheiden, wie Sie Ihre Anwendungen strukturieren. Zu Lernzwecken empfiehlt es sich jedoch, beide Apps an einem Ort zu speichern.

Kopieren und Umgestalten des Routenhandlercodes

Die gesamte Node.js Express-Logik zum Zurückgeben von Daten befindet sich im Ordner server/services. Sie können diesen Code aus der Node.js Express-Anwendung in die Functions-Anwendung kopieren und dann geringfügig umgestalten, sodass der Code mit Functions statt mit Node.js Express verwendet werden kann.

In der folgenden Tabelle sind die Hauptunterschiede zwischen der Node.js Express-Anwendung und der Functions-Anwendung aufgeführt:

Komponente Node.js Express Functions
Importiertes npm-Paket für die Anwendung express @azure/functions
Anforderungs- und Antwortobjekte req und res request und context

Zunächst gestalten Sie den Code so um, dass damit das entsprechende npm-Paket importiert wird. Anschließend gestalten Sie den Code so um, dass die Unterschiede zwischen Express und Functions bei der Übergabe der Anforderungs- und Antwortobjekte berücksichtigt werden.

Kopieren über den vorhandenen Code aus dem Express-Projekt

Kopieren Sie in Visual Studio Code die folgenden Unterordner aus dem Ordner server in der Express-Anwendung, und fügen Sie diese in den Ordner functions/ ein:

  • data
  • Modelle
  • services

Sie müssen den Ordner routes nicht kopieren, da Sie neue Funktionen für jede Route in der Azure Functions-App erstellen werden.

Fahren Sie mit der nächsten Lerneinheit fort, um die Funktionen zu erstellen und die Endpunkte und Routen umzugestalten.