Wie verwende ich GitHub Pages?

Inhalte veröffentlichen

GitHub ist eine sehr wichtige und nützliche Gemeinschaft, an der man sich beteiligen kann, und Git/GitHub ist ein sehr beliebtes Versionskontrollsystem – die meisten Technologieunternehmen verwenden es mittlerweile in ihrem Arbeitsablauf. GitHub bietet eine sehr nützliche Funktion namens GitHub Pages, die es Ihnen ermöglicht, Website-Code live im Web zu veröffentlichen.

Grundlegende GitHub-Einrichtung

1. Installieren Sie zunächst Git auf Ihrem Rechner. Das ist die zugrundeliegende Versionskontrollsystem-Software, auf der GitHub basiert.
2. Melden Sie sich als Nächstes für ein GitHub-Konto an. Es ist einfach und unkompliziert.
3. Sobald Sie sich angemeldet haben, loggen Sie sich mit Ihrem Benutzernamen und Passwort bei github.com ein.

Ihren Code für den Upload vorbereiten

Sie können jeden beliebigen Code in einem GitHub-Repository speichern, aber um die GitHub Pages-Funktion voll auszunutzen, sollte Ihr Code als typische Website strukturiert sein, zum Beispiel mit dem primären Einstiegspunkt als HTML-Datei namens index.html.

Das andere, was Sie tun müssen, bevor Sie weitermachen, ist, Ihr Codeverzeichnis als Git-Repository zu initialisieren. Dafür:

1. Navigieren Sie mit der Befehlszeile in Ihr test-site Verzeichnis (oder wie auch immer Sie das Verzeichnis genannt haben, das Ihre Website enthält). Verwenden Sie dazu den cd Befehl (d.h. "change directory"). Hier ist ein Beispiel dafür, wie Sie es eingeben würden, wenn Sie Ihre Website in einem Verzeichnis namens test-site auf Ihrem Desktop abgelegt haben:

   bash

   cd Desktop/test-site
   

2. Wenn die Befehlszeile sich in Ihrem Website-Verzeichnis befindet, geben Sie den folgenden Befehl ein, der das git-Tool anweist, das Verzeichnis in ein Git-Repository zu verwandeln:

   bash

   git init
   

Ein Exkurs zu Befehlszeilenschnittstellen

Der beste Weg, Ihren Code auf GitHub hochzuladen, ist über die Befehlszeile – das ist ein Fenster, in dem Sie Befehle eingeben, um Dinge zu tun wie Dateien erstellen und Programme ausführen, anstatt innerhalb einer Benutzeroberfläche zu klicken. Es wird ungefähr so aussehen:

Jedes Betriebssystem kommt mit einem Befehlszeilentool:

• Windows: Der Kommandozeilen Eingabeaufforderung kann durch Drücken der Windows-Taste aufgerufen werden, indem Sie Command Prompt eingeben und es aus der erscheinenden Liste auswählen. Beachten Sie, dass Windows seine eigenen Befehlskonventionen hat, die sich von Linux und macOS unterscheiden, daher können die Befehle unten auf Ihrem Computer variieren.
• macOS: Das Terminal finden Sie unter Programme > Dienstprogramme.
• Linux: Sie können normalerweise ein Terminal mit Strg + Alt + T öffnen. Wenn das nicht funktioniert, suchen Sie nach Terminal in einer App-Leiste oder einem Menü.

Dies mag anfangs etwas beängstigend sein, aber keine Sorge — Sie werden schnell die Grundlagen beherrschen. Sie sagen dem Computer im Terminal, dass er etwas tun soll, indem Sie einen Befehl eingeben und die Eingabetaste drücken, wie oben gezeigt.

Ein Repository für Ihren Code erstellen

1. Als Nächstes müssen Sie ein neues Repository für Ihre Dateien erstellen. Klicken Sie oben rechts auf der GitHub-Startseite auf Plus (+) und wählen Sie Neues Repository.
2. Auf dieser Seite geben Sie im Feld Repository-Name einen Namen für Ihr Code-Repository ein, zum Beispiel mein-repository.
3. Fügen Sie auch eine Beschreibung hinzu, um zu sagen, was Ihr Repository enthalten wird. Ihr Bildschirm sollte so aussehen:
4. Klicken Sie auf Repository erstellen; dies sollte Sie zur folgenden Seite bringen:

Ihre Dateien zu GitHub hochladen

1. Auf der aktuellen Seite interessiert Sie der Abschnitt …oder ein bestehendes Repository von der Befehlszeile pushen. Sie sollten zwei Zeilen Code in diesem Abschnitt sehen. Kopieren Sie die gesamte erste Zeile, fügen Sie sie in die Befehlszeile ein und drücken Sie Enter. Der Befehl sollte ungefähr so aussehen:

   bash

   git remote add origin https://github.com/chrisdavidmills/my-repository.git
   

2. Geben Sie als nächstes die folgenden zwei Befehle ein, und drücken Sie nach jedem Enter. Diese bereiten den Code für das Hochladen auf GitHub vor und bitten Git, diese Dateien zu verwalten.

   bash

   git add --all
   git commit -m 'adding my files to my repository'
   

3. Schließlich pushen Sie den Code zu GitHub, indem Sie auf der GitHub-Webseite, auf der Sie sich befinden, den zweiten der beiden Befehle eingeben, die wir im Abschnitt …oder ein bestehendes Repository von der Befehlszeile pushen gesehen haben:

   bash

   git push -u origin main
   

4. Jetzt müssen Sie GitHub Pages für Ihr Repository aktivieren. Um dies zu tun, wählen Sie auf der Startseite Ihres Repositories Einstellungen, dann wählen Sie Pages aus der Seitenleiste auf der linken Seite. Unter Source wählen Sie den "main" Branch. Die Seite sollte sich aktualisieren.

5. Gehen Sie erneut zum GitHub Pages-Abschnitt, und Sie sollten eine Zeile in der Form "Ihre Seite kann unter https://xxxxxx veröffentlicht werden" sehen.

6. Wenn Sie auf diese URL klicken, sollten Sie zu einer Live-Version Ihres Beispiels gelangen, sofern die Startseite index.html genannt wird – sie geht standardmäßig zu diesem Einstiegspunkt. Wenn der Einstiegspunkt Ihrer Website anders genannt wird, z. B. myPage.html, müssen Sie zu https://xxxxxx/myPage.html gehen.

Weiterführende GitHub-Kenntnisse

Wenn Sie mehr Änderungen an Ihrer Testseite vornehmen und diese bei GitHub hochladen möchten, müssen Sie die Änderungen an Ihren Dateien genauso vornehmen wie zuvor. Dann müssen Sie die folgenden Befehle eingeben (nach jedem Enter drücken), um diese Änderungen zu GitHub zu pushen:

git add --all
git commit -m 'another commit'
git push

Sie können another commit durch eine passende Nachricht ersetzen, die beschreibt, welche Änderung Sie gerade vorgenommen haben.

Wir haben hier nur an der Oberfläche von Git gekratzt. Um mehr zu lernen, schauen Sie sich unsere Git und GitHub Seite an.