Konfigurieren Ihrer lokalen JavaScript-Entwicklungsumgebung für Azure

Beim Erstellen von Cloudanwendungen ziehen es Entwickler in der Regel vor, Code auf Ihren lokalen Arbeitsstationen zu testen, bevor sie diesen Code in einer Cloudumgebung wie Azure bereitstellen. Die lokale Entwicklung bietet Ihnen den Vorteil einer größeren Vielfalt an Tools und einer vertrauten Umgebung.

Dieser Artikel enthält die Einrichtungsanweisungen zum Erstellen und Überprüfen einer lokalen Entwicklungsumgebung, die für JavaScript mit Azure geeignet ist.

Einmalige Abonnementerstellung

Azure-Ressourcen werden innerhalb eines Abonnements und einer Ressourcengruppe erstellt.

type BESCHREIBUNG
Abonnement für die Testversion Erstellen Sie ein freetrial-Abonnement.
Bestehendes Abonnement Wenn Sie bereits über ein Abonnement verfügen, greifen Sie im Azure-Portal, über die Azure CLI oder die Azure SDKs für JavaScript auf das vorhandene Abonnement zu.
Mehrere Abonnements Wenn Sie mehrere Abonnements verwalten müssen, lesen Sie hier, wie Sie eine Verwaltungsgruppe mit JavaScript erstellen.

Einmalige Softwareinstallation

Für die Azure-Entwicklung mit JavaScript auf Ihrer lokalen Arbeitsstation wird die Installation der folgenden Komponenten empfohlen:

Name/Installationsprogramm Beschreibung
Node.js LTS Installieren Sie die aktuelle Laufzeitumgebung mit langfristigem Support (Long-Term Support, LTS) für die Entwicklung auf lokalen Arbeitsstationen.
Visual Studio Code Visual Studio Code bietet eine großartige JavaScript-Integrationsumgebung und -Codierungsumgebung, ist aber nicht erforderlich. Sie können einen beliebigen Code-Editor verwenden.

Azure-Hostingruntime

Wenn Sie eine Azure-Ressource als Hostingumgebung für Ihre Anwendung verwenden möchten, z. B. eine Azure-Web-App oder eine Azure Functions-Instanz, sollten Sie überprüfen, ob die Node.js-Runtimeversion Ihrer lokalen Node.js-Entwicklungsumgebung der Azure-Ressourcenruntime entspricht, die Sie verwenden möchten.

Die folgenden allgemeinen Installationen lokaler Arbeitsstationen werden empfohlen, um Sie bei den lokalen Entwicklungsaufgaben zu unterstützen.

Name BESCHREIBUNG
Azure-Befehlszeilenschnittstelle Lokale oder cloudbasierte CLI zum Erstellen und Verwenden von Azure-Ressourcen
Visual Studio Code-Erweiterungen für Azure VS Code-Erweiterungen für die IDE
Git oder Git für Windows Befehlszeilentools für die Quellcodeverwaltung. Wenn Sie es vorziehen, können Sie ein anderes Quellcodeverwaltungstool verwenden.

Einmalkonfiguration für die Authentifizierung

Wenn Sie den gleichen Authentifizierungscode in der lokalen Entwicklung und in der Azure-Remotehostingumgebung nutzen möchten, verwenden Sie DefaultAzureCredential.

So verwenden Sie denselben Code in allen Umgebungen:

  • Sie müssen für die lokale Entwicklungeinen Dienstprinzipal erstellen, um Azure-Ressourcen ohne persönliches Konto erstellen und verwalten zu können.
  • Im Falle des Azure-Hostings finden Sie hier weitere Informationen.

Arbeiten mit Azure und den Azure SDK-Clientbibliotheken

Die Azure SDK-Bibliotheken werden für jeden Dienst einzeln bereitgestellt. Sie installieren jede Bibliothek basierend auf dem Azure-Dienst, den Sie verwenden müssen.

Für jedes neue Projekt mit Azure müssen folgende Aktionen ausgeführt werden:

  • Erstellen Sie Azure-Ressourcen, und speichern Sie zugehörige Schlüssel oder die Konfiguration an einem sicheren Speicherort.
  • Installieren von Azure SDK-Bibliotheken aus npm oder Yarn.
  • Verwenden Sie die lokalen Anmeldeinformationen des Dienstprinzipals für die Authentifizierung beim Azure SDK, und verwenden Sie anschließend Konfigurationsinformationen für den Zugriff auf bestimmte Dienste.

Schützen von Konfigurationsinformationen

Sie haben mehrere Optionen zum Speichern von Konfigurationsinformationen:

  • Azure Key Vault zum Erstellen und Verwalten von Schlüsseln für den Zugriff auf und die Verschlüsselung von Cloudressourcen, Apps und Lösungen
  • Dotenv ist ein beliebtes npm-Paket zum Lesen von Umgebungsvariablen aus einer Datei vom Typ .env. Hinzufügen der .env-Datei zur .gitignore-Datei, damit die .env-Datei nicht in die Quellcodeverwaltung eingecheckt wird. Hier erfahren Sie mehr über Umgebungsvariablen in Web-Apps für Azure.

Erstellen von Umgebungsvariablen für die Azure-Bibliotheken

Zum Verwenden der Azure-Einstellungen, die von den Azure SDK-Bibliotheken für den Zugriff auf die Azure-Cloud benötigt werden, legen Sie die gängigsten Werte auf Umgebungsvariablen fest. Mit den folgenden Befehlen werden die Umgebungsvariablen für die lokale Arbeitsstation festgelegt.

In den folgenden Beispielen ist die Client-ID die Dienstprinzipal-ID und das Dienstprinzipalgeheimnis.

AZURE_SUBSCRIPTION_ID="aa11bb33-cc77-dd88-ee99-0918273645aa"
AZURE_TENANT_ID="00112233-7777-8888-9999-aabbccddeeff"
AZURE_CLIENT_ID="12345678-1111-2222-3333-1234567890ab"
AZURE_CLIENT_SECRET="abcdef00-4444-5555-6666-1234567890ab"

Ersetzen Sie die in diesen Befehlen angezeigten Werte durch die Werte Ihres spezifischen Dienstprinzipals.

Erstellen einer Datei vom Typ .env

Ein weiterer gebräuchlicher Mechanismus ist die Verwendung des NPM-Pakets DOTENV, um eine .env-Datei für diese Einstellungen zu erstellen. Wenn Sie eine .env-Datei verwenden möchten, achten Sie darauf, die Datei nicht in die Quellcodeverwaltung einzuchecken. Das Hinzufügen der .env-Datei zur .ignore-Datei von Git ist die Standardmethode, um sicherzustellen, dass diese Einstellungen in die Quellcodeverwaltung eingecheckt werden.

NPM-Pakete installieren

Wir empfehlen, für jedes Projekt immer einen separaten Order und eine eigene package.json-Datei zu erstellen. Dazu gehen Sie folgendermaßen vor:

  1. Öffnen Sie ein Terminal, eine Eingabeaufforderung oder eine Bash-Shell, und erstellen Sie einen neuen Ordner für das Projekt. Wechseln Sie dann in den neuen Ordner.

    mkdir MY-NEW-PROJECT && cd MY-NEW-PROJECT
    
  2. Initialisieren Sie die Paketdatei:

    npm init -y
    

    Dadurch wird die Datei „package.js“ erstellt, und die Mindesteigenschaften werden initialisiert.

  3. Installieren Sie die benötigten Azure SDK-Bibliotheken wie im folgenden Beispiel:

    npm install @azure/ai-text-analytics@5.0.0
    

Verwenden der Quellcodeverwaltung mit Visual Studio Code

Wir empfehlen, sich anzugewöhnen, bei jedem Start eines Projekts ein Quellcodeverwaltungs-Repository zu erstellen. Dieser Schritt kann über Visual Studio Code ausgeführt werden.

  1. Klicken Sie in Visual Studio Code auf das Symbol für die Quellcodeverwaltung, um den Explorer für die Quellcodeverwaltung zu öffnen. Klicken Sie anschließend auf Repository initialisieren, um ein lokales Git-Repository zu initialisieren:

    Initialize git repository

  2. Wenn Sie das Repository initialisiert haben und Dateien zum Speichern in der Quellcodeverwaltung besitzen, geben Sie die Meldung Initial commit ein, und wählen Sie das Häkchen aus, um den ersten Commit Ihrer Quelldateien zu erstellen.

    Complete an initial commit to the repository

  3. Erstellen Sie ein neues Repository auf GitHub oder in Azure DevOps, und kopieren Sie die Repository-URL für den nächsten Schritt.

  4. Verwenden Sie im integrierten Visual Studio-Terminal den folgenden Git-Befehl, um Ihr Remoterepository ihrem lokalen Repository hinzuzufügen. Ersetzen Sie YOUR-ALIAS und YOUR-REPOSITORY durch Ihre eigenen Werte.

    git remote add origin https://github.com/YOUR-ALIAS/YOUR-REPOSITORY
    

Visual Studio Code umfasst eine Reihe integrierter Git-Features. Weitere Informationen finden Sie unter Verwenden der Versionskontrolle in VS Code.

Nächste Schritte