Ob Sie Ihre eigene Website erstellen oder Ihre statischen Seiten hosten möchten, Github Pages ist der perfekte Ausgangspunkt. Es ist ein kostenloser Hosting-Service von Github, mit dem Sie Ihre Websites oder Seiten einfach direkt auf Github hosten können.
In diesem vollständigen Tutorial werden wir uns ansehen, wie Sie Github Pages von Grund auf neu verwenden können. Wir zeigen Ihnen, wie Sie ein Repository einrichten, statische Seiten erstellen und hosten, eine benutzerdefinierte Domäne einrichten und Jekyll zum Erstellen dynamischer Inhalte verwenden.
Sie werden lernen:
- Wie erstelle ich ein Repository für Github Pages
- Erstellen und Platzieren statischer Seiten
- Wie verwende ich Jekyll, um dynamischen Inhalt zu erstellen
- So richten Sie eine benutzerdefinierte Domain für Ihre Github-Seiten ein
Wir werden Ihnen auch Codebeispiele und detaillierte Anweisungen zur Verfügung stellen, damit Sie jedem Schritt des Prozesses leicht folgen können. Am Ende dieses Artikels können Sie mit der Verwendung von Github Pages beginnen und schöne und funktionale Webseiten erstellen.
Was sind Github-Seiten
Mit Github Pages können Sie Ihre HTML-Seiten, CSS-Stile, JavaScript-Skripte und Bilder direkt auf Github hosten und sie an der Ansichtsadresse anzeigen lassen: имя-пользователя.github.io/имя-репозитория.
Es ist wichtig zu beachten, dass alle Websites, die auf Github Pages gehostet werden, statisch sind, was bedeutet, dass keine serverseitige CGI- oder Datenbankverarbeitung vorhanden ist. Sie können jedoch weiterhin clientseitige Skripts wie JavaScript verwenden, um die Seite zu interagieren und dynamisch zu aktualisieren.
Die Verwendung von Github Pages bietet viele Vorteile, darunter:
- Einfache Bereitstellung - Sie können eine Website in nur wenigen Minuten erstellen und hosten.
- Sicherheit - Github schützt Ihre Dateien und Daten.
- Änderungsnachverfolgung - Sie können das Versionskontrollsystem von Git verwenden, um Änderungen an Ihren Seiten zu verfolgen.
- Möglichkeit, als Team zu arbeiten - Sie können anderen Benutzern erlauben, Änderungen an Ihrem Projekt vorzunehmen und Zugriffsberechtigungen zu verwalten.
- Kostenlos - Github bietet das Hosting von Github Pages kostenlos an, obwohl es auch eine kostenpflichtige Option mit erweiterten Funktionen gibt.
Mit diesen Vorteilen ist Github Pages zu einer beliebten Wahl für viele Entwickler, Arbeitsgruppen und Communities geworden, die ihre Projekte oder Dokumentation mit anderen Personen teilen möchten.
Anleitung zur Verwendung von Github Pages
Um mit Github Pages zu beginnen, müssen Sie ein Repository auf der GitHub-Plattform erstellen. Sie können ein vorhandenes Repository verwenden oder ein neues erstellen. Wenn Sie ein neues Repository erstellen, ist es wichtig, die Option "Initialize this repository with a README" auszuwählen, um die Datei zu erstellen README.md , die verwendet wird, um Ihre Website anzuzeigen.
Nachdem Sie das Repository erstellt haben, gehen Sie zu den Projekteinstellungen. Scrollen Sie zum Abschnitt "GitHub Pages" und wählen Sie den Quellzweig aus, den Sie zum Bereitstellen Ihrer Website verwenden möchten. Normalerweise wird der Zweig "main" oder "master" verwendet. Wenn Sie einen Zweig auswählen, startet GitHub automatisch den Bereitstellungsprozess für Ihre Website.
Ihre Website ist jetzt verfügbar unter https://yourusername .github.io/repositoryname, wobei "yourusername" Ihr GitHub-Login ist und "repositoryname" der Name Ihres Repositorys ist.
Wenn Sie eine benutzerdefinierte Domain für Ihre Website verwenden möchten, verwenden Sie die Option "Benutzerdefinierte Domain" in den Projekteinstellungen. Dazu müssen Sie Ihren eigenen Domain-Namen registrieren und DNS-Einträge einrichten, die auf GitHub-Server verweisen. Ausführliche Anweisungen zum Einrichten Ihrer eigenen Domain auf GitHub Pages finden Sie in der GitHub-Dokumentation.
Um Inhalte zu Ihrer Website hinzuzufügen, fügen Sie die Dateien zu Ihrem GitHub-Repository hinzu. Sie können HTML-Dateien, CSS-Dateien, Bilder und andere Ressourcen hinzufügen. GitHub Pages kompiliert und zeigt Ihre Website basierend auf diesen Dateien automatisch an.
Wenn Sie eine statische Website verwenden möchten, können Sie GitHub Pages verwenden, um die Dokumentation, den Blog oder andere Abschnitte Ihres Projekts zu speichern und anzuzeigen. Sie können auch Jekyll verwenden, einen statischen Site-Generator, der von GitHub unterstützt wird, um Ihrer Website zusätzliche Funktionen und Vorlagen hinzuzufügen.
Glückwunsch! Jetzt wissen Sie, wie Sie Github Pages zum Erstellen und Bereitstellen Ihrer Website verwenden. Dieses Tool eignet sich hervorragend für verschiedene Zwecke, sei es für die Präsentation Ihres Portfolios, die Präsentation von Projekten oder die Erstellung von Dokumentationen.
Bereitstellen eines Repositorys auf Github Pages
Mit GitHub Pages können Sie Ihr Repository auf einer speziellen Subdomain bereitstellen, um Ihr Projekt online mit anderen zu teilen. Befolgen Sie die folgenden Schritte, um Ihr Repository auf GitHub Pages bereitzustellen:
- Gehen Sie zu Github.com und wählen Sie Ihr Repository aus.
- Klicken Sie auf die Registerkarte "Settings" (Einstellungen) Ihres Repositorys.
- Scrollen Sie nach unten zum Abschnitt "GitHub Pages".
- Wählen Sie im Abschnitt "Quelle" den Zweig Ihres Repositorys aus, den Sie für die Bereitstellung verwenden möchten. Dies wird normalerweise ein "master" -Zweig sein.
- Wählen Sie den Ordner aus, in dem sich Ihr Projekt befindet. Wenn sich Ihr Projekt im Stammverzeichnis des Repositorys befindet, wählen Sie "/" als Pfad aus.
- Klicken Sie auf "Save" (Speichern).
Sobald diese Schritte abgeschlossen sind, wird Ihr Repository auf GitHub Pages bereitgestellt und ist unter der folgenden Adresse verfügbar https://ваше-имя-пользователя.github.io/ваш-репозиторий /. Sie können einen Link zu Ihrem Projekt mit anderen Personen teilen, damit sie Ihre Arbeit im Browser sehen können.
Konfigurieren einer benutzerdefinierten Domäne
GitHub Pages bietet die Möglichkeit, eine benutzerdefinierte Domain einzurichten, sodass Sie Ihre eigene Domain für Ihre Website verwenden können. Sie müssen einige Schritte ausführen, um eine benutzerdefinierte Domäne einzurichten:
- Registrieren Sie einen Domänennamen bei Ihrem Domänenregistrierer.
- Suchen Sie die DNS-Einstellungen (Domain Name System) in der Systemsteuerung Ihres Domain-Hostings oder bei Ihrem Domain-Registrar.
- Fügen Sie einen neuen CNAME-Eintrag für Ihre Domain mit dem Benutzernamen von GitHub Pages und dem Namen Ihres Repositorys hinzu. Wenn beispielsweise der Benutzername von GitHub Pages "username" lautet und der Name Ihres Repositorys "repositoryname" lautet, sollte der CNAME auf "username.github.io/repositoryname ".
- Bestätigen Sie die DNS-Einstellungen und warten Sie, bis sie aktiviert sind. Es kann bis zu mehreren Stunden dauern, bis die Änderungen angewendet werden.
- Rufen Sie die Einstellungsseite Ihres Repositorys auf GitHub auf. Scrollen Sie nach unten zum Abschnitt "GitHub-Seiten" und suchen Sie nach dem Feld "Benutzerdefinierte Domäne". Geben Sie Ihre benutzerdefinierte Domain in dieses Feld ein.
- Klicken Sie auf "Save", um die Einstellungen zu speichern.
Danach wird Ihre Website über eine benutzerdefinierte Domain verfügbar. Seien Sie beim Ändern der DNS-Einstellungen vorsichtig, da eine falsche Konfiguration zu einer Funktionsstörung Ihrer Website oder zu einem 404-Fehler führen kann.
Jetzt wissen Sie, wie Sie eine benutzerdefinierte Domain für Ihre Website auf GitHub Pages einrichten. Genießen Sie die Nutzung Ihrer eigenen Domain und teilen Sie Ihr Projekt mit anderen!
Beispiele für die Verwendung von Github Pages
Hier sind einige Beispiele, wie Sie Github Pages verwenden können:
| Ein Beispiel | Die Beschreibung |
|---|---|
| 1 | Erstellen eines persönlichen Portfolios |
| 2 | Veröffentlichen der Projektdokumentation |
| 3 | Veröffentlichen eines statischen Blogs oder Magazins |
| 4 | Bereitstellen von Informationen und Ressourcen für ein Team oder eine Community |
| 5 | Demonstration von Prototypen oder Ausführung von Testaufgaben |
Die obigen Beispiele zeigen nur einen Bruchteil der Funktionen von Github Pages. Mit diesem Tool können Sie Ihre Projekte erstellen und veröffentlichen, Informationen austauschen und Feedback erhalten.
