Meine erste Website

Wie veröffentlicht man eine Website im Netz? Hier möchte ich – Schritt für Schritt – anhand einer minimalen Website und des im letzten Blogbeitrags vorgestellten Hosters Uberspace zeigen, wie das geht.

Zunächst müssen wir uns bei Uberspace registrieren. Dazu gehen wir auf deren Homepage und klicken rechts oben auf UBERNAUTIN WERDEN. Wir wählen einen Benutzernamen – ich habe world genommen -, geben ihn ein, lesen und bestätigen die Hausordnung und klicken auf ab geht's!. Auf der folgenden Seite gibt man seine Email-Adresse (optional) ein und wählt ein sicheres Passwort. Anschließend muss man noch einen monatlichen Preis nach dem Solidarprinzip auswählen. Zunächst stehen 5, 10 oder 15 Euro zur Auswahl. Später kann man diesen Betrag beginnend bei einem Euro nochmal anpassen. Aber keine Sorge. Der erste Monat ist kostenlos. Möchte man danach mit dem Projekt nicht weitermachen, löscht man einfach seinen Uberspace oder lässt ihn auslaufen. Nun klickt man noch auf Make it so! – und schon hat man seinen Webspace erstellt.

Dieser Webspace ist ein kleiner, dir zugeordneter Bereich auf einem Uberspace-Rechner. In diesem Bereich kannst du Dateien speichern und Programme ausführen. In etwa so wie auf deinem Rechner vor dir. Es gibt jedoch einen Unterschied: Dateien, die man in einem bestimmten Verzeichnis ablegt, sind im Netz verfügbar. In diesem Verzeichnis möchten wir nun unsere Website erstellen.

Bei vielen Hostern kann man seinen gehosteten Bereich direkt über ein Webinterface erreichen. Nicht so bei Uberspace. Hier kann man sich nur per SSH auf seinem Webspace einloggen. Dies klingt erstmal komplizierter, eröffnet einem aber – gerade als Entwickler*in – mehr Möglichkeiten. Um uns per SSH einzuloggen, müssen wir noch ein SSH-Passwort vergeben. Dazu gehen wir auf den Tab Zugänge. In der Spalte links können wir unser zuvor ausgewähltes Passwort für das Webinterface ändern. In der mittleren Spalte unter SSH-ZUGANG ZUM UBERSPACE sind wir richtig. Hier tragen wir das SSH-Passwort ein. Gerne kann man dasselbe Passwort wie das zum Webinterface wählen. Ein Klick auf go und schon ist das SSH-Passwort gesetzt.

SSH steht für Secure Shell. Es ist zunächst ein Protokoll zum sicheren Betrieb von Netzwerkdiensten. Genutzt wird es meist, um von einem lokalen Rechner (Client) Kommandozeilen-Befehle auf einem entfernten Rechner (Host) auszuführen. Dazu muss auf dem lokalen Rechner ein SSH-Client und auf dem Host ein SSH-Server zur Verfügung stehen. Den SSH-Server hat Uberspace für uns eingerichtet. Und ein SSH-Client, nämlich OpenSSH, ist bei Linux, macOS und Windows 10 (ab 2017) im jeweiligen Terminal integriert.

Um sich mit SSH mit einem entfernten Rechner zu verbinden, benötigt man den Benutzernamen, das Benutzerpasswort und den Hostnamen. Den Benutzernamen – in meinem Fall world – und das SSH-Passwort haben wir schon festgelegt. Fehlt nur noch der Hostname. Dieser findet sich im Tab Datenblatt unter Auf diesem Server liegt dein Uberspace. Im meinem Fall ist es horologium.uberspace.de.

Jetzt öffnen wir ein Terminal (Windows 10: „Eingabeaufforderung“ oder „PowerShell“) und geben einen Befehl nach folgendem Muster ein:

ssh <username>@<hostname>

In meinem Fall ist es

ssh world@horologium.uberspace.de

Nach Abschicken der Eingabe durch Enter bekommt man einen sogenannten SHA256 Fingerprint angezeigt und die Frage, ob man weitermachen machen möchte. Dieser Fingerprint findet sich auch auf dem Tab Datenblatt unter SSH-Host-Keys. Bitte prüfe, ob der Key im Terminal mit einem der beiden Keys auf dem Datenblatt übereinstimmt. Nur so bist du sicher, dass du dich auf dem richtigen Host anmeldest. Andernfalls – kein Tippfehler vorausgesetzt – liegt ein ernsthafter Fehler (Virus, Man-in-the-Middle-Angriff, Konfigurationsfehler bei Uberspace usw.) vor. Kontaktiere in diesem Fall den Uberspace-Support. Stimmen die Keys überein, bestätige das mit yes. OpenSSH merkt sich nun den Key und gleicht ihn bei weiteren Anmeldungen automatisch ab. Jetzt muss man nur noch das SSH-Passwort eingeben und man landet auf dem Host-Rechner. Das erkennt man an dem neuen Prompt (bei mir [world@horologium ~]$).

Die Uberspace-Host-Rechner laufen unter Linux. Auch wenn man ein Windows-Terminal benutzt, kann man ab jetzt nur noch Linux-Befehle absetzen. Möchten man zum Beispiel wissen, auf welchem Linux-System man unterwegs ist, kann man hostnamectl eingeben. Man sieht, dass man sich auf einer Virtuellen Maschine mit dem Betriebssystem CentOS befindet.

Mit ls (ls steht für list) zeigen wir nun die Dateien und Unterverzeichnisse des Ordners an, in dem wir uns befinden. Wir bekommen einige Verzeichnisse angezeigt. Uns interessiert das Verzeichnis html. Das ist das Root-Verzeichnis unseres Webservers. In dieses Verzeichnis wechseln wir mit cd html (cd steht für change directory). Im Prompt sollte man jetzt den Verzeichnisnamen sehen. Bei mir ist es[world@horologium html]$. Es weiteres ls in diesem Verzeichnis listet die Datei nocontent.html auf. Diese Datei wird im Netz angezeigt, solange man nicht eigene Inhalte erstellt hat. Das möchten wir jetzt tun. Dazu geben wir

nano index.html

im Terminal ein. nano ist eine kleiner, einfacher Texteditor. index.html ist die Datei, die nano öffnen soll. Existiert keine Datei mit diesem Namen, legt nano diese beim Speichern an. Der Name index.html ist kein Zufall. So muss (bei normaler Konfiguration) die Startseite eines Webauftritts heißen. Nach Abschicken der Eingabe öffnet sich im Terminal der Editor. Hier geben wir Hello World! ein. Anschließend speichern wir die Datei mit Strg O bzw. Crtl O. Unten im Editor erscheint die Meldung Dateiname zum Speichern: index.html. Diese Meldung bestätigen wir mit Enter. Nun verlassen wir mit Strg X den Editor. Wir sehen wieder unseren Prompt. Mit ls zeigen wir uns nochmal den Verzeichnisinhalt an. Neben nocontent.html sehen wir jetzt auch die eben erzeugte Datei index.html.

Wo finden wir nun unsere Website? Dazu müssen wir nur <username>.uber.space (in meinem Fall world.uber.space) in einem Browser eingeben. Voilà!

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.