GitHub Actions mit der Checkout-Aktion

Einführung

In diesem Lab lernen Sie die Verwendung der Aktion actions/checkout kennen, einem der wichtigsten Schritte in jedem GitHub Actions Workflow. Standardmäßig startet ein GitHub Actions Runner in einem leeren Verzeichnis. Um Ihren Code zu bauen, zu testen oder bereitzustellen, müssen Sie zuerst das Repository in den Workspace des Runners auschecken.

Sie werden eine Workflow-Datei erstellen, diese so konfigurieren, dass sie Ihren Code auscheckt, und dann überprüfen, ob die Dateien zugänglich sind, indem Sie sie in den Logs auflisten. Dieser Prozess simuliert eine Standard-Einrichtung einer Continuous Integration (CI) Pipeline.

Dieses Lab baut auf dem Repository auf, das Sie in den vorherigen Labs erstellt haben. Sie werden das github-actions-demo Repository klonen und einen neuen Workflow erstellen, der die Checkout-Aktion verwendet.

Schritt hinzufügen, um actions/checkout@v4 im Workflow zu verwenden

In diesem Schritt klonen Sie das Repository und erstellen einen Workflow, der die actions/checkout-Aktion verwendet. Diese Aktion checkt Ihr Repository unter $GITHUB_WORKSPACE aus, sodass Ihr Workflow darauf zugreifen kann.

1. Klicken Sie auf der GitHub-Repository-Seite für github-actions-demo auf die grüne Schaltfläche Code.
2. Stellen Sie sicher, dass der Reiter HTTPS ausgewählt ist, und kopieren Sie die URL. Sie sollte etwa so aussehen: https://github.com/your-username/github-actions-demo.git.
3. Öffnen Sie das Terminal in der LabEx-Umgebung. Der Standardpfad ist ~/project.
4. Verwenden Sie den Befehl git clone, um das Repository herunterzuladen. Ersetzen Sie your-username durch Ihren tatsächlichen GitHub-Benutzernamen.

cd ~/project
git clone https://github.com/your-username/github-actions-demo.git

5. Navigieren Sie in das geklonte Repository:

cd ~/project/github-actions-demo

6. Erstellen Sie eine neue Workflow-Datei namens ci.yml im Verzeichnis .github/workflows:

touch .github/workflows/ci.yml

7. Öffnen Sie .github/workflows/ci.yml im WebIDE-Editor und fügen Sie den folgenden Inhalt hinzu. Diese Konfiguration definiert einen Workflow namens „CI“, der bei jedem Push-Ereignis ausgeführt wird. Er enthält einen einzelnen Job namens build, der auf ubuntu-latest läuft, mit einem Schritt zum Auschecken des Codes.

name: CI

on: [push]

jobs:
  build:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout code
        uses: actions/checkout@v4

Diese Zeile uses: actions/checkout@v4 weist GitHub Actions an, die v4-Version der offiziellen Checkout-Aktion herunterzuladen und auszuführen.

Schritt hinzufügen, um Dateien mit dem Befehl ls -la aufzulisten

In diesem Schritt fügen Sie Ihrem Workflow einen zweiten Schritt hinzu, um zu überprüfen, ob die Checkout-Aktion Ihre Dateien erfolgreich abgerufen hat. Sie verwenden einen Standard-Shell-Befehl, um die Dateien im aktuellen Verzeichnis aufzulisten.

Öffnen Sie .github/workflows/ci.yml und fügen Sie den folgenden Schritt zur steps-Liste hinzu. Stellen Sie sicher, dass die Einrückung korrekt mit dem vorherigen Schritt übereinstimmt.

- name: List files
  run: ls -la

Ihre vollständige .github/workflows/ci.yml-Datei sollte nun wie folgt aussehen:

name: CI

on: [push]

jobs:
  build:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout code
        uses: actions/checkout@v4

      - name: List files
        run: ls -la

Das Schlüsselwort run ermöglicht die Ausführung von Befehlszeilenprogrammen. Hier listet ls -la alle Dateien, einschließlich versteckter Dateien, im Stammverzeichnis des Repositorys auf.

Erstellen einer Beispieldatei namens index.js im Repository

In diesem Schritt erstellen Sie eine Beispieldatei in Ihrem Repository. Diese Datei dient als Nachweis dafür, dass die Aktion actions/checkout korrekt funktioniert, wenn wir sie in den Workflow-Protokollen aufgeführt sehen.

1. Stellen Sie sicher, dass Sie sich im Repository-Verzeichnis befinden:

cd ~/project/github-actions-demo

2. Erstellen Sie eine einfache JavaScript-Datei namens index.js im Stammverzeichnis Ihres Repositorys:

echo "console.log('Hello, GitHub Actions!');" > index.js

3. Sie können die Dateierstellung überprüfen, indem Sie Folgendes ausführen:

ls -l index.js

Diese Datei repräsentiert den Quellcode Ihrer Anwendung, den die CI-Pipeline normalerweise bauen oder testen würde.

Commit und Push der Beispieldatei und Workflow-Aktualisierungen

In diesem Schritt committen Sie Ihre Änderungen und pushen sie auf GitHub. Das Pushen dieses Commits löst den Workflow aus, den wir aufgrund der Konfiguration on: [push] definiert haben.

1. Stellen Sie sicher, dass Sie sich im Repository-Verzeichnis befinden:

cd ~/project/github-actions-demo

2. Überprüfen Sie den Status Ihres Repositorys, um die nicht verfolgten Dateien zu sehen:

git status

Sie sollten .github/workflows/ci.yml und index.js als nicht verfolgt sehen.

3. Fügen Sie alle Änderungen zum Staging-Bereich hinzu:

git add .

4. Comitten Sie die Änderungen mit einer aussagekräftigen Nachricht:

git commit -m "Add CI workflow and index.js"

Beispielausgabe:

[main ... ] Add CI workflow and index.js
 2 files changed, 14 insertions(+), 0 deletions(-)
 create mode 100644 .github/workflows/ci.yml
 create mode 100644 index.js

5. Pushen Sie die Änderungen in das Remote-Repository auf GitHub:

git push

Hinweis zur Authentifizierung:
Wenn Sie git push ausführen, fordert die WebIDE Sie automatisch zur Authentifizierung auf. Befolgen Sie diese detaillierten Schritte:

1. Ein Popup erscheint mit der Meldung: "The extension 'GitHub' wants to sign in using GitHub." Klicken Sie auf Allow.
2. Eine neue Benachrichtigung erscheint. Klicken Sie auf "Copy&Continue to GitHub", dann im nächsten Dialog auf "Open".
3. Melden Sie sich in dem sich öffnenden Browserfenster bei Ihrem GitHub-Konto an und geben Sie den kopierten Autorisierungscode ein. Nach Bestätigung der Autorisierung schließt sich die Seite automatisch.
4. Warten Sie einige Sekunden, und Sie werden sehen, wie das Terminal den Push-Vorgang erfolgreich abschließt.

Datenschutzhinweis: Die WebIDE wird zu Authentifizierungszwecken vollen Zugriff auf Ihr GitHub-Konto anfordern. Sie müssen sich keine Sorgen um Datenschutzbedenken machen – die LabEx VM wird sofort zerstört, nachdem Sie das aktuelle Lab abgeschlossen haben, und Ihre Anmelde- und Autorisierungsinformationen werden nicht gespeichert.

Dieser Authentifizierungsprozess erfordert keine manuelle Konfiguration von Benutzername oder Personal Access Token.

Beispielausgabe:

Enumerating objects: 6, done.
Counting objects: 100% (6/6), done.
Delta compression using up to 4 threads
Compressing objects: 100% (4/4), done.
Writing objects: 100% (4/4), 512 bytes | 512.00 KiB/s, done.
Total 4 (delta 1), reused 0 (delta 0), pack-reused 0
To https://github.com/your-username/github-actions-demo.git
   1234567..abcdef1  main -> main

Dieser Push löst den Workflow auf GitHub aus.

Workflow-Lauf überprüfen, um die Dateiauflistung in den Logs zu verifizieren

Nach dem Pushen Ihres Codes wird der Workflow automatisch auf GitHub ausgelöst. Sie können die Workflow-Laufprotokolle (Logs) einsehen, um zu überprüfen, ob die checkout-Aktion Ihre Dateien erfolgreich abgerufen hat.

1. Besuchen Sie Ihr Repository auf GitHub in einem Webbrowser: https://github.com/your-username/github-actions-demo
2. Klicken Sie oben auf der Repository-Seite auf den Tab Actions.
3. Sie sollten einen Workflow-Lauf aufgelistet sehen, wahrscheinlich benannt als "Add CI workflow and index.js" oder "CI".

Hinweis: Wenn Sie Code pushen, können mehrere Actions ausgelöst werden, falls Sie mehrere Workflow-Dateien in Ihrem Repository haben. Bitte identifizieren Sie den korrekten Workflow-Lauf, indem Sie den Workflow-Namen in der linken Seitenleiste überprüfen oder die Liste der Workflow-Läufe auf der rechten Seite verwenden.

4. Klicken Sie auf den Titel des Workflow-Laufs und dann auf den Job build.
5. Erweitern Sie den Schritt List files, um die Ausgabe zu sehen.

Sie sollten die Ausgabe des ls -la-Befehls sehen, die index.js und andere Dateien aus Ihrem Repository enthält:

Run ls -la
  ls -la
  shell: /usr/bin/bash -e {0}
total XX
drwxr-xr-x  X runner ... .
drwxr-xr-x  X runner ... ..
drwxr-xr-x  X runner ... .git
drwxr-xr-x  X runner ... .github
-rw-r--r--  X runner ... index.js
...

Dies bestätigt, dass der Schritt actions/checkout Ihr Repository erfolgreich ausgecheckt hat. Ohne den Checkout-Schritt würde der Befehl ls -la nur ein leeres Verzeichnis anzeigen. Dies verdeutlicht, warum die Checkout-Aktion unerlässlich ist – sie stellt die Dateien Ihres Repositorys dem Workflow-Runner zur Verfügung.

Zusammenfassung

In diesem Lab haben Sie erfolgreich einen GitHub Actions Workflow erstellt, der die Aktion actions/checkout verwendet. Sie haben gelernt, wie man:

1. Die Verzeichnisstruktur .github/workflows einrichtet.
2. Einen Workflow definiert, der bei Push-Ereignissen ausgelöst wird.
3. actions/checkout@v4 verwendet, um Ihr Repository in den Runner zu klonen.
4. Einen Schritt hinzufügt, um die Anwesenheit von Dateien mithilfe von ls -la zu überprüfen.

Dies ist der grundlegende Schritt für fast alle CI/CD-Pipelines und ermöglicht es nachfolgenden Schritten, Ihren Anwendungscode zu bauen, zu testen und bereitzustellen.