Schwarzcode

Nachschlagewerk zur Ergänzung des Unterrichts in Frontend Development – und für mich. Sehr subjektiv gefärbt und ohne Anspruch auf Vollständigkeit.


Lokaler Webserver

Wozu?

Ich möchte die Fähigkeit eines Webservers nutzen, die Startseite eines Verzeichnisses zu erkennen. So kann ich meine Links eleganter gestalten. So würde statt href="kontakt/index.html" auch href="kontakt" funktionieren, denn wenn keine Dateiendung vorhanden ist, wird angenommen, es handle sich um einen Ordner, der so heisst, was ja hoffentlich auch stimmt. Wenn Links so gesetzt werden, sieht die Adresszeile einer geladenen Seite ebenfalls so aus.

Eine absolute URL auf eine Unterseite meiner Website könnte dann so aussehen: meinportfolio.ch/fotos statt meinportfolio.ch/fotos.html. Im Ordner «fotos» liegt einfach wieder eine Datei die index.html heisst. Klarer Nachteil für Chaoten: Das funktioniert eben nur mit Dateien, die index.html oder index.php heissen, was zwangsläufig dazu führt, dass man mit mehreren Dateien arbeitet, die gleich heissen.

Das ist lediglich eine kleine kosmetische Angelegenheit. Der grosse Vorteil eines lokalen Webservers erkennst du weiter unten.

Nun hat OSX eigentlich schon einen Webserver an Board. Der ist aber nicht ganz so komfortabel zu bedienen. Einfacher gehts mit MAMP oder MAMP Pro (Mac Apache, MySQL, PHP). Die Pro-Version (ca. CHF 40.–) unterscheidet sich von der Freeware dadurch, dass man mit ihr mehrere lokale Domains einrichten kann. Mit MAMP kann man nur über http://localhost:8888 auf seinem lokalen Webserver surfen, während man mit MAMP Pro lokale Adressen à la http://projekt-a:8888 einrichten kann. Ersteres genügt aber für den Anfang bei weitem.

Installation unter OSX

Nach dem Download der freien Version MAMP und deren Installation findest du im Programme-Ordner «MAMP» und darin «htdocs». Dieses htdocs-Verzeichnis ist das Root-Verzeichnis deines Servers. Wenn du eine Datei mit dem Namen index.html darin speicherst und im Browser http://localhost:8888 eingibst, wird sie angezeigt. Liegt kein File mit diesem Namen im Root-Verzeichnis, so wird einfach eine Übersicht aller Dateien und Ordner angezeigt (Screenshot). So kriegst du via Browser einen einfachen Zugriff auf all deine Webprojekte.

index

Ich empfehle aber, besagten Ordner «htdocs» an einem andern Ort zu versorgen. Z.B. bei deinen anderen Jobs. (So geht er eher nicht verloren bei einem Umzug auf einen neuen Rechner.) Dazu musst du nach dem Verschieben unter MAMP/Einstellungen/Webserver den «Document Root» neu auswählen und den Server neu starten.


Verantwortlich:
Jürgen Wössner
E-Mail

Schwarzcode

Nachschlagewerk zur Ergänzung des Unterrichts in Frontend Development – und für mich. Sehr subjektiv gefärbt und ohne Anspruch auf Vollständigkeit.

Aber mit so einem kleinen Bildschirm hier ist das ganze echt nutzlos. Geh mal rüber an einen grösseren Bildschirm.