Root-Server Tutorial

ROOT-SERVER TUTORIAL

Automatische Bereitstellung einer Webanwendung mit GitHub Actions

Lerne, wie man den Bereitstellungsworkflow einer Webanwendung mit GitHub Actions automatisiert.

Autor:

Philipp Schütz

Letztes Update:

13.5.2023

Einführung

Dieses Tutorial führt dich durch den Prozess der automatischen Bereitstellung einer Webanwendung über FTP mithilfe von GitHub Actions. Durch das Befolgen dieser Schritte kannst du einen kontinuierlichen Bereitstellungsworkflow einrichten, der Webanwendungsdateien automatisch auf einen FTP-Server überträgt, sobald Änderungen im jeweiligen GitHub-Repository vorgenommen werden.

Anforderungen

  • GitHub Account
  • GitHub-Repository mit einer Webapp zum Bereitstellen
  • Server auf den per FTP zugegriffen werden kann

Ich habe Webhosting 2000 benutzt, aber jedes andere netcup Webhosting-Angebot sollte ebenfalls funktionieren.

Schritt 1 - FTP-Zugangsdaten erstellen und dem GitHub-Repository hinzufügen

Wenn du ein Webhosting-Paket von netcup bestellst, bekommst du zusätzlich Zugriff auf das Webhosting Control Panel.

  1. Gehe zu "Websites & Domains".
  2. Suche die Domain, auf der deine Seite gehostet werden soll.
  3. Unter "Dateien & Datenbanken", wähle "FTP-Zugang".
  4. Klicke auf den Button "FTP-Konto hinzufügen".
  5. Wähle Namen, Basisverzeichnis und Passwort für dein FTP-Konto. Merke dir deine Zugangsdaten für später.
  6. Klicke auf "OK".

Jetzt fügen wir die erstellten Zugangsdaten dem GitHub Repository hinzu.

  1. Melde dich in deinem GitHub Konto an, wähle das richtige Repository aus und gehe zum Tab "Settings".
  2. Wähle auf der linken Seitenleiste "Secrets and variables" aus und klicke auf "Actions".
  3. Klicke auf den Button "New repository secret".
  4. Gib dem "Secret" einen Namen (z.B. FTP_USERNAME) und gib den FTP-Benutzernamen, den du im Webhosting Control Panel gewählt hast, als "Secret" ein.
  5. Wiederhole Schritte 3 und 4, um ein weiteres "Secret" für das FTP-Passwort (z.B. FTP_PASSWORD) hinzuzufügen.

Schritt 2 - Bereitstellungsworkflow erstellen

  1. Gehe in deinem GitHub-Repository zum Tab "Actions".
  2. Klicke auf den Link "Set up a workflow yourself".
  3. Gib das folgende Codeschnipsel in das Textfeld ein:
name: FTP Deployment

on:
  push:
    branches:
      - main

jobs:
  deploy:
    runs-on: ubuntu-latest

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

      - name: Deploy over FTP
        uses: SamKirkland/FTP-Deploy-Action@3.2.0
        with:
          server: -server-
          username: ${{ secrets.FTP_USERNAME }}
          password: ${{ secrets.FTP_PASSWORD }}
          server-dir: /path/to/destination/folder
          local-dir: ./path/to/local/folder
  1. Ersetze "-server-" mit deiner Serveradresse (z.B. hostingxxxxxx.aexxx.netcup.net, hostingxxxxxx.meinserver.de).
  2. Ersetze "/path/to/destination/folder" mit dem Pfad zum Ordner auf deinem Server, in dem du deine Seite bereitstellen möchtest.
  3. Ersetze "./path/to/local/folder" mit dem lokalen Pfad des Ordners im Repository, der die Dateien der Webapp enthält.
  4. Klicke auf "Commit changes...", wähle eine "commit message" und klicke auf "Commit changes".

Schritt 3 - Erstellte GitHub Action testen

  1. "Push" Änderungen auf den "main" Branch deines Repository, um den erstellten Workflow zu testen.
  2. Gehe zum Tab "Actions" des Repositorys. Der Workflow sollte automatisch gestartet haben.
  3. Wenn der Workflow abgeschlossen ist, gehe zurück zur Oberfläche des Webhosting Control Panel und klicke in der Seitenleiste auf "Dateien".
  4. Gehe zum Pfad, den du im Workflow angegeben hast.
  5. Du solltest nun die Änderungen, die du in dem Repository gemacht hast, im richtigen Ordner sehen.

Fazit

Mit Hilfe dieses Tutorials hast du erfolgreich einen automatischen Bereitstellungsworkflow unter Verwendung von GitHub Actions erstellt. Von nun an werden alle Änderungen am "main branch" des Repositorys automatisch über eine FTP-Verbindung auf die Dateien auf deinem Server angewendet. Die Bereitstellung deiner Webapp ist ab jetzt sehr viel zeitsparender, da du dich nicht mehr jedes Mal anmelden und deine Dateien hochladen musst.

Licence

MIT

Copyright (c) 2021 netcup

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicence, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

Contributor's Certificate of Origin

By making a contribution to this project, I certify that:

  1. The contribution was created in whole or in part by me and I have the right to submit it under the licence indicated in the file; or

  2. The contribution is based upon previous work that, to the best of my knowledge, is covered under an appropriate licence and I have the right under that licence to submit that work with modifications, whether created in whole or in part by me, under the same licence (unless I am permitted to submit under a different licence), as indicated in the file; or

  3. The contribution was provided directly to me by some other person who certified (a), (b) or (c) and I have not modified it.

  4. I understand and agree that this project and the contribution are public and that a record of the contribution (including all personal information I submit with it, including my sign-off) is maintained indefinitely and may be redistributed consistent with this project or the licence(s) involved.

Veröffentlicht am 13.5.2023 von Philipp Schütz

Tutorial einreichen

Erhalte einen 60€ netcup Gutschein für jedes veröffentlichte Tutorial.