Freigeben über


Schnellstart: Erstellen und Bereitstellen einer Python Web-App aus GitHub Codespaces zum Azure mithilfe einer Azure Developer CLI-Vorlage

Diese Schnellstartanleitung führt Sie durch die einfachste und schnellste Methode zum Erstellen und Bereitstellen einer Python Web- und Datenbanklösung für Azure. Befolgen Sie die Anweisungen in dieser Schnellstartanleitung:

  • Wählen Sie eine Azure Developer CLIvorlage (azd) basierend auf dem Python Webframework, Azure Datenbankplattform und Azure Webhostingplattform aus, auf der Sie aufbauen möchten.
  • Erstellen Sie einen neuen GitHub Codespace, der Code enthält, der aus der ausgewählten azd-Vorlage generiert wurde.
  • Verwenden Sie GitHub Codespaces und das Bash-Terminal des Online-Visual Studio Code. Mit dem Terminal können Sie Azure Developer CLI-Befehle verwenden, um eine azd-Vorlage auszuführen, um eine Beispiel-Web-App und -Datenbank zu erstellen und zu konfigurieren und die erforderlichen Azure Ressourcen zu erstellen und zu konfigurieren, und stellen Sie dann die Beispielweb-App für Azure bereit.
  • Bearbeiten Sie die Web-App in einem GitHub Codespace und verwenden Sie einen azd Befehl, um die App erneut bereitzustellen.
  • Verwenden Sie einen Befehl azd, um Azure Ressourcen zu bereinigen.
  • Schließen Sie ihren GitHub Codespace, und öffnen Sie es erneut.
  • Veröffentlichen Sie Ihren neuen Code in einem GitHub Repository.

Es sollte weniger als 25 Minuten dauern, bis dieses Lernprogramm abgeschlossen ist. Nach Abschluss können Sie mit dem Ändern des neuen Projekts mit Ihrem benutzerdefinierten Code beginnen.

Weitere Informationen zu diesen azd-Vorlagen für Python Web App-Entwicklung finden Sie unter:

Voraussetzungen

Von Bedeutung

Sowohl GitHub Codespaces als auch Azure sind kostenpflichtige Abonnementdienste. Nach einigen kostenlosen Zuteilungen werden Ihnen möglicherweise die Nutzung dieser Dienste in Rechnung gestellt. Wenn Sie diesen Schnellstart befolgen, könnte dies Auswirkungen auf die Zuteilungen oder die Abrechnung haben. Wenn möglich, verwenden die azd Vorlagen die am wenigsten teueren Optionen, aber einige sind möglicherweise nicht kostenlos. Verwenden Sie den Azure Preisrechner, um die Kosten besser zu verstehen. Weitere Informationen finden Sie in den GitHub Codespaces Preisinformationen.

Wählen Sie eine Vorlage aus, und erstellen Sie einen Codespace.

Wählen Sie eine Vorlageazd basierend auf dem Python-Webframework, der Azure-Webhostingplattform und der Azure-Datenbankplattform, die Sie verwenden möchten, aus.

  1. Wählen Sie in der folgenden Liste der Vorlagen eine Vorlage aus, die die Technologien verwendet, die Sie in Ihrer neuen Webanwendung verwenden möchten.

    Schablone WebFramework Datenbank Hostingplattform Neuer Codespace
    azure-django-postgres-flexible-aca Django PostgreSQL Flexible Server Azure Container Apps Neuer Codespace
    azure-django-postgres-flexible-appservice Django PostgreSQL Flexible Server Azure App Service Neuer Codespace
    azure-django-cosmos-postgres-aca Django Cosmos DB (PostgreSQL Adapter) Azure Container Apps Neuer Codespace
    Azure-Django-Cosmos-Postgres-AppService Django Cosmos DB (PostgreSQL Adapter) Azure App Service Neuer Codespace
    azure-django-postgres-addon-aca Django Azure Container Apps PostgreSQL-Erweiterung Azure Container Apps Neuer Codespace

  1. Aus Gründen der Einfachheit enthält die letzte Spalte jeder Tabelle einen Link, der ein neues Codespace erstellt und die vorlage azd in Ihrem GitHub-Konto initialisiert. Klicken Sie mit der rechten Maustaste auf den Link "Neuer Codespace " neben dem ausgewählten Vorlagennamen, und wählen Sie "In neuer Registerkarte öffnen" aus, um den Setupvorgang zu initiieren.

    Während dieses Vorgangs werden Sie möglicherweise aufgefordert, sich bei Ihrem GitHub Konto anzumelden. Außerdem werden Sie aufgefordert, zu bestätigen, dass Sie den Codespace erstellen möchten. Wählen Sie die Schaltfläche " Codespace erstellen " aus, um die Seite " Codespace einrichten " anzuzeigen.

  2. Nach ein paar Minuten lädt eine webbasierte Version von Visual Studio Code in einer neuen Browserregisterkarte, wobei das Python-Web-Template als Arbeitsbereich in der Explorer-Ansicht geladen wird.

Authentifizieren bei Azure und Bereitstellen der azd-Vorlage

Nachdem Sie nun über einen GitHub Codespace verfügen, der den neu generierten Code enthält, verwenden Sie das Hilfsprogramm azd aus dem Codespace, um den Code in Azure zu veröffentlichen.

  1. Im webbasierten Visual Studio Code ist das Terminal standardmäßig geöffnet. Wenn dies nicht der Grund ist, verwenden Sie die Tilde-Taste ~ , um das Terminal zu öffnen. Standardmäßig ist das Terminal ein Bash-Terminal. Wenn dies nicht der Fall ist, wechseln Sie im oberen rechten Bereich des Terminal-Fensters zu Bash.

  2. Geben Sie im Bash-Terminal den folgenden Befehl ein:

    azd auth login
    

    azd auth login beginnt mit der Authentifizierung Ihres Codespaces für Ihr Azure-Konto.

    Start by copying the next code: XXXXXXXXX
    Then press enter and continue to log in from your browser...
    
    Waiting for you to complete authentication in the browser...
    
  3. Folgen Sie den Anweisungen, die Folgendes enthalten:

    • Kopieren eines generierten Codes
    • Zur Auswahl von Enter, um eine neue Browserregisterkarte zu öffnen, und zum Einfügen des Codes in das Textfeld.
    • Auswählen Ihres Azure Kontos aus einer Liste
    • Bestätigen, dass Sie sich bei Microsoft Azure CLI anmelden möchten
  4. Bei erfolgreicher Ausführung wird die folgende Meldung wieder auf der Registerkarte "Codespaces" am Terminal angezeigt:

    Device code authentication completed.
    Logged in to Azure.
    
  5. Stellen Sie Ihre neue Anwendung für Azure bereit, indem Sie den folgenden Befehl eingeben:

    azd up
    

    Während dieses Vorgangs werden Sie aufgefordert:

    • Geben Sie einen neuen Umgebungsnamen ein.
    • Wählen Sie ein Azure-Abonnement aus, das Sie verwenden möchten [Verwenden Sie die Pfeiltasten zum Bewegen, tippen Sie zum Filtern]
    • Wählen Sie einen Azure-Standort aus, der verwendet werden soll: [Verwenden Sie die Pfeiltasten, um zu navigieren, geben Sie ein, um zu filtern]

    Sobald Sie diese Fragen beantwortet haben, zeigt die Ausgabe von azd an, dass die Bereitstellung im Gange ist.

    Von Bedeutung

    Sobald azd up erfolgreich abgeschlossen ist, ist die Beispielweb-App im öffentlichen Internet verfügbar, und Ihr Azure-Abonnement beginnt mit der Fälligkeit von Gebühren für alle Ressourcen, die erstellt werden. Die Ersteller der azd Vorlagen wählten absichtlich preiswerte Stufen, aber nicht unbedingt kostenlose Stufen, da kostenlose Stufen oft eingeschränkte Verfügbarkeit haben. Wenn Sie mit der Arbeit mit der Beispielweb-App fertig sind, verwenden Sie diese Option azd down , um alle erstellten Dienste azd up zu entfernen.

    Folgen Sie den Anweisungen, wenn Sie aufgefordert werden, Azure Abonnement für die Zahlung zu verwenden, und wählen Sie dann einen Azure Speicherort aus, der verwendet werden soll. Wählen Sie eine Region aus, die ihnen geografisch nahe liegt.

    Das Ausführen von azd up kann mehrere Minuten dauern, da mehrere Azure-Dienste bereitgestellt und eingesetzt werden. Achten Sie bei der Anzeige des Fortschritts auf Fehler. Wenn Fehler angezeigt werden, lesen Sie den Abschnitt "Problembehandlung " unten in diesem Dokument.

  6. Wenn azd up erfolgreich abgeschlossen wurde, wird eine ähnliche Ausgabe auf dem Bildschirm angezeigt:

    (✓) Done: Deploying service web
    - Endpoint: https://xxxxx-xxxxxxxxxxxxx-ca.example-xxxxxxxx.westus.azurecontainerapps.io/
    
    SUCCESS: Your application was provisioned and deployed to Azure in 11 minutes 44 seconds.
    You can view the resources created under the resource group xxxxx-rg in Azure portal:
    https://portal.azure.com/#@/resource/subscriptions/xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx/resourceGroups/xxxxx-rg/overview
    

    Wenn ein Standardbildschirm oder ein Fehlerbildschirm angezeigt wird, wird die App möglicherweise gestartet. Warten Sie 5 bis 10 Minuten, um festzustellen, ob sich das Problem von selbst löst, bevor Sie mit der Problembehandlung beginnen.

    1. Strg+ klicken Sie auf die erste URL nach dem Wort - Endpoint:, um das Beispiel-Web-App-Projekt anzuzeigen, das in Azure ausgeführt wird.
  7. Klicken Sie mit Strg + auf die zweite URL im vorherigen Schritt, um die bereitgestellten Ressourcen im Azure-Portal anzuzeigen.

Bearbeiten und erneutes Bereitstellen

Nehmen Sie als Nächstes eine kleine Änderung an der Web-App vor, und stellen Sie sie dann erneut bereit.

  1. Wechseln Sie zurück zu dem Browser-Tab, der Visual Studio Code enthält. Verwenden Sie die Explorer-Ansicht von Visual Studio Code, um zum Ordner src/templates zu wechseln. Öffnen Sie die Datei index.html. Suchen Sie die folgende Codezeile:

    <h1 id="page-title">Welcome to ReleCloud</h1>
    

    Ändern sie den Text innerhalb von H1:

    <h1 id="page-title">Welcome to ReleCloud - UPDATED</h1>
    

    Ihr Code wird während der Eingabe gespeichert.

  2. Um die App mit Ihrer Änderung erneut bereitzustellen, führen Sie den folgenden Befehl im Terminal aus:

    azd deploy
    
  3. Wenn der Befehl abgeschlossen ist, aktualisieren Sie den Browser-Tab mit der ReleCloud-Website, um die Aktualisierung zu sehen. Je nach verwendeter Webhostingplattform kann es mehrere Minuten dauern, bis Ihre Änderungen sichtbar sind.

    Jetzt können Sie Dateien in der Vorlage bearbeiten und löschen. Weitere Informationen finden Sie unter Was kann ich in der Vorlage bearbeiten oder löschen?

Bereinigen von Ressourcen

Bereinigen Sie die Ressourcen, die die Vorlage erstellt hat, indem Sie den Befehl "azd down " ausführen.

azd down

Der Befehl azd down löscht die Azure Ressourcen und den GitHub Actions Workflow. Wenn Sie dazu aufgefordert werden, stimmen Sie dem Löschen aller Ressourcen zu, die der Ressourcengruppe zugeordnet sind.

Optional: Finden Sie Ihren Codespace

In diesem Abschnitt wird veranschaulicht, wie Ihr Code vorübergehend ausgeführt und in einem Codespace dauerhaft beibehalten wird. Wenn Sie beabsichtigen, die Arbeit am Code fortzusetzen, veröffentlichen Sie den Code in einem neuen Repository.

  1. Schließen Sie alle Registerkarten, die sich auf diesen Schnellstartartikel beziehen, oder beenden Sie Ihren Webbrowser vollständig.

  2. Öffnen Sie Ihren Webbrowser und eine neue Registerkarte, und wechseln Sie zu https://github.com/codespaces.

  3. Unten sehen Sie eine Liste der zuletzt verwendeten Codespaces. Suchen Sie in einem Abschnitt mit dem Titel "Owned by Azure-Samples" nach dem, den Sie erstellt haben.

  4. Wählen Sie die Auslassungspunkte rechts neben diesem Codespace, um ein Kontextmenü anzuzeigen. Von hier aus können Sie den Codespace umbenennen, in einem neuen Repository veröffentlichen, den Computertyp ändern, den Codespace beenden und vieles mehr.

Optional: Veröffentlichen eines GitHub Repositorys aus Codespaces

An diesem Punkt verfügen Sie über einen Codespace, der ein Container ist, der von GitHub ausgeführt wird, in der Ihre Visual Studio Code Entwicklungsumgebung mit Ihrem neuen Code ausgeführt wird, der aus einer azd-Vorlage generiert wurde. Der Code wird jedoch nicht in einem GitHub Repository gespeichert. Wenn Sie beabsichtigen, den Code weiterhin zu bearbeiten, priorisieren Sie die Speicherung in einem Repository.

  1. Wählen Sie im Kontextmenü für den Codespace die Option "In einem neuen Repository veröffentlichen" aus.
  2. Benennen Sie im Dialogfeld "In einem neuen Repository veröffentlichen " Ihr neues Repository um, und wählen Sie aus, ob es sich um ein öffentliches oder privates Repository handelt. Wählen Sie "Repository erstellen" aus.
  3. Nach ein paar Momenten wird das Repository erstellt, und der Code, den Sie zuvor in dieser Schnellstartanleitung generiert haben, wird an das neue Repository übertragen. Wählen Sie die Schaltfläche " Repository anzeigen " aus, um zum neuen Repository zu wechseln.
  4. Um den Bearbeitungscode erneut zu öffnen und den Bearbeitungscode fortzusetzen, wählen Sie die grüne Dropdownliste "<> Code" aus, wechseln Sie zur Registerkarte "Codespaces ", und wählen Sie den Namen des Codespaces aus, an dem Sie zuvor gearbeitet haben. Sie kehren zur Codespace-Visual Studio Code Entwicklungsumgebung zurück.
  5. Verwenden Sie den Bereich Versionsverwaltung, um neue Branches zu erstellen und neue Änderungen an Ihrem Code zu committen.

Problembehandlung

Wenn Fehler während azd up angezeigt werden, versuchen Sie die folgenden Schritte:

  • Führen Sie den azd down Befehl aus, um alle vom Befehl erstellten Ressourcen zu entfernen. Alternativ können Sie die Im Azure Portal erstellte Ressourcengruppe löschen.
  • Wechseln Sie zur Seite "Codespaces" für Ihr GitHub-Konto, suchen Sie den Codespace, der während dieser Schnellstart-Anleitung erstellt wurde, wählen Sie die drei Punkte rechts aus, und wählen Sie Löschen aus dem Kontextmenü.
  • Suchen Sie im Azure-Portal nach Key Vaults. Wählen Sie "Gelöschte Tresore verwalten", wählen Sie Ihr Abonnement aus, wählen Sie alle Schlüsseltresor aus, die den Namen azdtest oder den Namen Ihrer Umgebung enthalten, und wählen Sie "Löschen" aus.
  • Wiederholen Sie die Schritte in dieser Schnellstartanleitung. Wählen Sie in diesem Fall, wenn Sie dazu aufgefordert werden, einen einfacheren Namen für Ihre Umgebung aus. Versuchen Sie einen kurzen Namen, Kleinbuchstaben, keine Zahlen, keine Großbuchstaben und keine Sonderzeichen.
  • Wenn Sie die Schnellstartschritte wiederholen, wählen Sie einen anderen Speicherort aus.

Eine umfassendere Liste möglicher Probleme und Lösungen finden Sie in den häufig gestellten Fragen.For a more comprehensive list of possible issues and solutions, see the FAQ.