Automatische Bereitstellung Ihrer Website

Ihr Feature wird zusammengeführt, sodass Sie es jetzt freigeben können. In diesem Tutorial richten Sie die automatische Bereitstellung so ein, dass jeder Push auf main Ihr Softwareprojekt auf einer Live-Website veröffentlicht.

Voraussetzungen

• Ein stargazers-log Repository mit Ihrem zusammengeführten Feature. Falls Sie es noch nicht zusammengeführt haben, siehe Überprüfen der vorgeschlagenen Änderungen.

Aktivieren von GitHub Pages

Richten Sie GitHub Pages ein, um Ihre Website zu hosten, und verwenden Sie GitHub Actions, um Ihre Website zu erstellen und zu veröffentlichen.

1. Navigieren Sie auf GitHub zu Ihrem stargazers-log Repository.
2. Klicken Sie unter Ihrem Repositorynamen auf "Einstellungen".
3. Klicken Sie in der Randleiste im Abschnitt "Code und Automatisierung" auf "Seiten".
4. Wählen Sie unter "Erstellen und Bereitstellen" im Dropdownmenü " Quelle " die Option GitHub Actions aus.

Behalten Sie die anderen Einstellungen bei ihren Standardeinstellungen bei. Als Nächstes erstellen Sie Ihren eigenen Workflow , um Ihre Website automatisch zu erstellen und bereitzustellen.

Erstellen eines Bereitstellungsworkflows

Ein Workflow ist eine Reihe automatisierter Schritte, die GitHub Actions für Sie ausführt. Fügen Sie eine hinzu, die Ihre Website erstellt und bereitstellt, wann immer Sie an main pushen.

1. Erstelle in deinem Repository eine Datei mit dem Namen .github/workflows/deploy.yml.

   1. Klicken Sie auf der Hauptseite Ihres stargazers-log-Repositorys oberhalb der Liste der Dateien auf , und klicken Sie dann auf Neue Datei erstellen.
   2. Gib in das Feld für den Dateinamen .github/workflows/deploy.yml ein.

2. Fügen Sie den folgenden Workflowinhalt hinzu.

   YAML

   name: Deploy to GitHub Pages
   
   on:
     push:
       branches:
         - main
   
   permissions:
     contents: read
     pages: write
     id-token: write
   
   jobs:
     deploy:
       runs-on: ubuntu-latest
       environment:
         name: github-pages
         url: ${{ steps.deployment.outputs.page_url }}
       steps:
         - name: Checkout
           uses: actions/checkout@v6
         - name: Setup Pages
           uses: actions/configure-pages@v5
         - name: Upload artifact
           uses: actions/upload-pages-artifact@v4
           with:
             path: '.'
         - name: Deploy to GitHub Pages
           id: deployment
           uses: actions/deploy-pages@v4
   

3. Übernehmen Sie die Datei direkt in die main Verzweigung.

Grundlegendes zum Workflow

Jeder Teil des Workflows hat einen Auftrag:

• on weist GitHub Actions an, den Workflow bei jedem Push an main auszuführen.
• permissions dem Workflow den Zugriff gewähren, den er benötigt, um in GitHub Pages zu veröffentlichen.
• environment stellt den Auftrag mit Ihrer GitHub Pages Website in Verbindung und macht die veröffentlichte URL als ${{ steps.deployment.outputs.page_url }}verfügbar.
• steps Checken Sie Ihren Code aus, bereiten Sie GitHub PagesIhre Dateien vor, laden Sie Ihre Dateien als Artefakt hoch und stellen Sie sie auf Ihrer Live-Website bereit.

Ihre Live-Website anzeigen

Nachdem Sie den Workflow committet haben, führt GitHub Actions ihn automatisch aus.

1. Klicken Sie in Ihrem Repository auf die Registerkarte "Aktionen ", um die Ausführung des Workflows zu überwachen.
2. Klicken Sie auf die neueste Workflowausführung, um eine Zusammenfassung der Auftragsdetails anzuzeigen.
3. Wenn die Ausführung abgeschlossen ist, öffnen Sie Ihre veröffentlichte Site unter https://YOUR-USERNAME.github.io/stargazers-log/. Ersetzen Sie YOUR-USERNAME durch Ihren Benutzernamen.
   • Wenn Ihr Kontobenutzername beispielsweise GitHub lautet, befindet sich Ihre Website unter octocat``https://octocat.github.io/stargazers-log/

Ab sofort stellt jeder Push auf main Ihre Website mit Ihren neuesten Änderungen erneut bereit.

Was Sie erstellt haben

In dieser Reihe haben Sie ein vollständiges Softwareprojekt erstellt und den GitHub Workflow praktiziert:

Stage	Was Sie gelernt haben
Erstellen Ihres Softwareprojekts	Repositorys, README-Dateien
Planen Ihrer Arbeit	Probleme, Projekte (Projektgremien)
Lokales Herstellen einer Verbindung
GitHub Desktop, Klonen
Schreiben und Speichern von Code	Verzweigungen, Commits, Pullanforderungen, Copilot
Überprüfen von Änderungen	Pull-Request-Überprüfungen, Copilot
Wird automatisch bereitgestellt
GitHub Actions, GitHub Pages

Nächste Schritte

• Erweitern Sie Ihr Verständnis von Git und GitHub. Weitere Informationen findest du unter Git und GitHub Lernressourcen.
• Erkunden Sie Copilot-Chat , um schneller zu lernen und Hilfe während des Codes zu erhalten. Weitere Informationen finden Sie in der Dokumentation.
• Gehen Sie tiefer mit KI und erfahren Sie, wie Agenten wie ein praktischer Codierungspartner agieren können, indem Sie Ideen in kleine umsetzbare Schritte umwandeln, Beispiele generieren und sich wiederholende Arbeit behandeln. Weitere Informationen finden Sie in der Dokumentation.
• Erfahren Sie mehr über die Automatisierung Ihrer Softwareprojekte mit GitHub Actions Workflows. Weitere Informationen findest du unter Grundlegendes zu GitHub Actions.
• Fügen Sie eine benutzerdefinierte Domäne hinzu, oder erkunden Sie weitere Möglichkeiten zum Veröffentlichen Ihrer Website mit GitHub Pages. Weitere Informationen findest du unter Erste Schritte mit GitHub Seiten.