Wie ich meine eigene Website baue

In diesem Text werde ich festhalten, wie ich als Web-Dev Newbie beim bauen meiner Website vorgehe. Nette Dokumentation für mich, evtl. kann auch jemand aus meinen Problemen und Erfahrungen was lernen für ein ähnliches Projekt.

Motivation: Website als Selbstzweck

Eine Website wollte ich schon recht lange aufsetzen und hosten lernen. Aber dazu braucht es doch eine Idee, ein Konzept für eine Website oder? Etwas, das andere interessiert? Dachte ich auch lange, hab sogar bei Gelegenheit andere Leute bequatscht, dass ich für ihre Ideen doch Websites hosten könnte. Hat allerdings nicht geklappt, würde ich aber nicht ausschliessen... Anyway: Nach einer Weile dann habe ich mich entschieden: Egal! Ich baue jetzt eine Website und mach einfach, worauf ich Lust habe. Gerne chaotisch, gerne inkonsistent und divers in Gestaltung und Inhalten, idealerweise lesbar und benutzbar. Und ohne intended audience.

Domain

Eine Domain mieten ist recht einfach; ich habe cyon.ch genutzt. Die "Miete" ist jedes Jahr wieder fällig. Der Name war mir erstmal relativ egal, aber weil ich auch Bock habe, eine Terminal-Oberfläche irgendwann einzubauen, habe ich mich für ctrl-shift-c.ch entschieden. Die Domain kostet 14.95 CHF pro Jahr.

Hosting

Was den Server betrifft, auf dem die Website laufen soll, habe ich das Glück, dass mir privat eine VM zur Verfügung gestellt wurde. Allerdings ist die Website momentan (3.9.25) nur über IPv6 erreichbar. Das ist das ok für den Moment. Nur etwas doof, dass ich selber auf dem Handy über meinen Provider keinen Zugriff habe.

Als HTTP Webserver verwende ich nginx. Die Einrichtung von nginx ist nicht unbedingt kompliziert, aber man muss verschiedene config files anpassen und die richtigen Pfade angeben. nginx muss auch bei jedem Update neu gestartet (reload) werden.

Software Setup

Für Webdesign, wenn man auch wirklich im Code selber rumbasteln will, braucht es mindestens Grundkentnisse von HTML und CSS. Soll es nicht nur eine statische Website sein auch JavaScript. Dabei ist JavaScript sicher die komplexeste "Baustelle" der drei Webdesign Grundlagen. Entsprechend mache ich nebenbei auch noch einen JS-Kurs online. Bin noch nicht durch, aber nur schon das Prinzip des DOM-Trees (Document Object Model) hilft enorm im Verständnis. Da ich zwar selber dran rumschrauben will, aber auch die gängigen und State of the Art Libraries verwenden möchte, habe ich Bootstrap Templates verwendet. Erstmal die für Blogs, da ich schätze, dass Blogs da relativ statisch keine zu grosse Einstiegshürde darstellen. Ausserdem habe ich ein paar Ideen für Blogposts. Bootstrap ist zudem darauf ausgelegt, dass Websites auf Geräten verschiedener Grösse (Desktops, Tablets, Mobile) passend angezeigt werden.

Alternativ gäbe es ja auch Hugo, ein open source static website generator. Sicher toll, wenn man einiges der Arbeit abgenommen haben will; will ich hier aber nicht. Als Version Control System verwende ich obvsly Git, keine Vorstellung nötig 😉.

Einrichtung von TLS / SSL

Hier geht es darum, dass die Website via das URI-Schema https und nicht http aufrufbar ist. So können Daten durch das Verschlüsselungsprotokoll sicher gesendet und empfangen werden.