Übung: Veröffentlichen der API mit GitHub Actions

  • 4 Minuten

Ihre Web-App und die API werden lokal ausgeführt. Nun ist es an der Zeit, die Web-App und die API in Azure Static Web Apps zu veröffentlichen.

Übertragen der Änderungen mittels Push an GitHub

In der vorherigen Übung haben Sie Änderungen an Ihrer API vorgenommen. Jetzt ist es an der Zeit, diese Änderungen an den api-Branch zu committen und sie auf GitHub zu pushen.

Erstellen eines Pull Request

Sie haben Ihren api-Branch per Pull an GitHub übertragen. Nun soll die GitHub-Aktion Ihre Web-App und die API in einer Vorschau-URL veröffentlichen. Der nächste Schritt ist also das Erstellen eines Pull Requests für den main-Branch.

  1. Öffnen Sie einen Browser.

  2. Rufen Sie Ihr Repository auf:

    https://github.com/<YOUR_GITHUB_USERNAME>/my-static-blazor-app

  3. Wählen Sie den Link Pull Requests aus.

  4. Wählen Sie New pull request aus.

  5. Wählen Sie den Branch main aus der Dropdownliste base aus.

  6. Wählen Sie den Branch api aus der Dropdownliste compare aus.

  7. Klicken Sie auf Pull Request erstellen.

  8. Wählen Sie noch einmal Create pull request aus.

Ihre GitHub-Aktion wird jetzt ausgelöst.

Verfolgen des Erstellens und Veröffentlichens durch die GitHub-Aktion

Sie können im Browser weiterhin Ihr Repository anzeigen lassen und den Fortschritt der GitHub-Aktion verfolgen. Führen Sie die folgenden Schritte aus, um den Fortschritt zu verfolgen:

  1. Wählen Sie das Menü Actions aus.

  2. Wählen Sie im Menü „Workflows“ den Workflow Azure Static Web Apps CI/CD aus.

  3. Wählen Sie den aktuellen (obersten) Link in den Action-Ausführungen rechts aus.

  4. Wählen Sie den Link Build and Deploy Job aus.

Sie können den Status Ihrer GitHub-Aktion verfolgen, während diese Ihre Web-App und die API erstellt und veröffentlicht.

Navigieren zur Vorschau-URL

Nachdem die GitHub-Aktion erfolgreich abgeschlossen wurde, können Sie Ihre ausgeführte App im Browser aufrufen.

  1. Wählen Sie das Menü Pull Requests aus.

  2. Wählen Sie Ihren Pull Request aus.

  3. Wählen Sie den Link nach der Meldung Azure Static Web Apps: Your stage site is ready! Visit it here aus.

Beachten Sie, dass die Vorschau-URL einen Bindestrich enthält, auf den eine Zahl folgt. Die Zahl entspricht der Pull Request-Nummer für den von Ihnen erstellten Pull Request. Für jeden erstellten Pull Request erhalten Sie eine eindeutige und wiederholbare Vorschau-URL. In der Region wird die Vorschau-URL zudem formatiert.

Nächste Schritte

Herzlichen Glückwunsch! Sie haben ihre erste Azure Static Web Apps-Instanz mit einer Web-App und einer API erstellt. Wenn Sie den erstellten Pull Request zusammenführen, stellt Azure Static Web Apps die Änderungen automatisch in Ihrer Produktions-App bereit.