lehrkraefte:blc:informatik:glf24:web:hello-html [https://fginfo.ksbg.ch Fachgruppe Informatik der KSBG]

This page is read only. You can view the source, but not change it. Ask your administrator if you think this is wrong.
====== Webseite lokal erstellen ======
  * Legen Sie an einem geeigneten Ort ein neues Verzeichnis mit Namen ''hello'' an (alles Kleinbuchstaben, keine Leerschläge oder Sonderzeichen).
  * Starten Sie VisualStudioCode und öffnen Sie das neue Verzeichnis (File -> Open Folder)
  * Legen Sie eine neue Datei mit Namen ''index.html'' an.
  * Schreiben Sie ein Ausrufezeichen ''!'' und akzeptieren Sie den Vorschlag ''Emmet Abbreviation''
  * Ändern Sie den Titel und fügen folgende HTML-Code zwischen den ''<body>'' Tags hinzu:
<code html>
    <h1>Hello</h1>
    Bla bla.
    <h2>World</h2>
    Und eine Liste
    <ul>
        <li>Foo</li>
        <li>Bar</li>
        <li>Baz</li>
    </ul>
</code>

Speichern Sie die Datei.

===== Kopieren der Seite auf den Webserver =====
Öffnen Sie in VisualStudioCode ein Terminal (Menu Terminal -> New Terminal). 

Das Terminal wird somit gleich im Verzeichnis ''hello'' geöffnet. Damit entfällt das Navigieren mit ''cd'' ins Verzeichnis.

==== Anlegen eines Verzeichnisses auf dem Server ====
Damit wir auf dem Server etwas Ordnung haben, erstellen wir auf dem Server erst einmal ein Verzeichnis ''hello'', indem wir erst mit ''ssh'' eine Kommandozeile auf dem Server öffnen und dort mit ''mkdir'' ein Verzeichnis anlegen. Mit ''pwd'' sehen Sie den vollen Pfad auf dem Server. Das letzte Verzeichnis (Ziffern und Buchstaben a-f) wird dann in der URL erscheinen. Danach die Verbindung wieder schliessen (''exit''):
<code bash>
ssh ofi
mkdir hello
pwd
exit
</code>
Das muss pro Verzeichnis natürlich nur ein einziges Mal erfolgen.

==== Kopieren der Datei index.html ====
Der Befehl ''scp'' dient zum kopieren von Dateien zum oder vom Server:
<code bash>
scp index.html ofi:hello/.
</code>

==== Testen ====
Öffnen Sie https://ofi.tech-lab.ch/2025/2aLS/ und navigieren Sie in Ihr Verzeichnis. Wenn Sie dieses nicht mehr kennen, geben Sie folgendes auf der Kommandozeile ein:

Das führt genau ein Kommando auf dem Webserver aus und beendet die Verbindung wieder.
<code bash>
ssh ofi pwd
</code>

Ändern Sie dann die Adress-Zeile im Browser ab, indem Sie noch ''hello/'' hinten anfügen. Damit sollte Ihre Webseite sichtbar werden.



==== Wer hat schon fertig? ====
<code bash>
ssh ofi "stat --printf '%y %U\n' /srv/www/ofi/2025/2aLS/*/hello/index.html | sort"
</code>
Erklärung:
  * stat ist ein «besseres ''ls''» was
      * Modifikationsdatum (%y) und zugehöriger Besitzer (%U) der Datei index.html in diesem Verzeichnis ausgegeben (plus ein Zeilenumbruch ''\n''). 
  * ''sort'' nach Modifikationsdatum (ist zwar alphabetisch, mit diesem Datumsformat funktioniert das aber).