Oefening: een Azure Functions-app maken en de code herstructureren

  • 5 minuten

In deze oefening maakt u een serverloze Azure Functions-toepassing die de API's uitvoert in plaats van de Express-toepassing. Vervolgens migreert u de toepassingslogica van de Node.js Express-toepassing naar de Functions-toepassing. U hoeft de code niet opnieuw te schrijven. U hebt slechts enkele kleine codewijzigingen nodig om de overgang te maken.

Een nieuwe Azure Functions-app maken

Zorg ervoor dat de Visual Studio Code-extensie voor Azure Functions is geïnstalleerd.

  1. In Visual Studio Code opent u het opdrachtenpalet door op F1 te drukken

  2. Typ en selecteer Azure Functions: Nieuw project maken.

    Screenshot of Visual Studio Code creating a new function app.

  3. Selecteer de hoofdmap van de opslagplaats als de locatie voor het nieuwe project.

  4. Voer de volgende waarden in wanneer u daarom wordt gevraagd.

    Naam Weergegeven als
    Taal TypeScript
    Een TypeScript-programmeermodel selecteren Model V4
    Template HTTP-trigger
    Naam getVacations

De Functions-app wordt nu gemaakt voor de API-eindpunten van de toepassing. In de volgende les maakt u de functies die vakanties toevoegen, bijwerken en verwijderen.

Notitie

U hebt de Functions-app gemaakt in een functiemap , die deze scheidt van de Angular-app. U kunt bepalen hoe u uw toepassingen structureren, maar voor leerdoeleinden kunt u beide apps op één plek zien.

De routehandlercode kopiëren en herstructureren

Alle Node.js Express-logica die gegevens retourneert, bevindt zich in de map server/services . U kunt deze code van de Node.js Express-toepassing naar de Functions-toepassing kopiëren en vervolgens een kleine herstructurering uitvoeren om de code te laten werken met Functions in plaats van Node.js Express.

De volgende tabel bevat de belangrijkste verschillen tussen de Node.js Express-toepassing en de Functions-toepassing:

Onderdeel Node.js Express Functions
Geïmporteerd npm-pakket voor de toepassing express @azure/functions
Aanvraag- en antwoordobjecten req en res request en context

Eerst herstructureer u de code om het juiste NPM-pakket te importeren. Vervolgens herstructureert u de verschillen tussen hoe Express en Functions de aanvraag- en antwoordobjecten doorgeven.

Kopiëren van bestaande code uit Express-project

Kopieer in Visual Studio Code de volgende submappen uit de servermap in de Express-toepassing en plak deze in de functies/ map:

  • gegevens
  • modellen
  • services

U hoeft de map routes niet te kopiëren omdat u nieuwe functies gaat maken voor elke route in de Azure Functions-app.

Ga door naar de volgende eenheid om de functies te maken en de eindpunten en routes te herstructureren.