Sebastian Forster, Gymnasium Kirchenfeld
Mit Markdown und Vue und einem Static Site Generator interaktive Skripte kreieren und veröffentlichen. Am Beispiel von Vitepress vorgeführt.
Vor ca. 5 Jahren wollte ich weg von meinem Word-Skript welches ich jeweils als PDF verteilt hatte.
Dokuwiki
Bereits vorher hatten wir DokuWiki im Unterricht eingesetzt und mir gefiel die einfache Wiki-Syntax.
Als Skript eignet sich ein Wiki nur bedingt. Ein Wiki hat andere Vorteile. Deshalb hielt ich Ausschau nach einem passenden CMS. Mit meinen PHP-Kenntnissen bin ich dann auf Grav gestossen.
Grav
Während einigen Jahren habe ich dann meine Skripte mit Grav betrieben.
Grav
CMS-System basierend auf PHP und Markdown (flat-file-system auf dem Server, keine DB)
Markdown fand ich toll, ebenso dass die Inhalte hierarchisch in einem Dateisystem abgespeichert werden. So konnte ich alles lokal vorbereiten – ohne eine DB. Jedoch ergaben sich trotzdem einige Bedenken:
- Lokal muss ein Webserver und PHP installiert sein
- Die Server-Admin-Seite war überflüssig (weil ich lokal im Markdown-Editor am Inhalt schrieb)
- Sicherheitsbedenken wegen PHP auf dem Server und Zugriff aufs Dateisystem
- Aufwand beim Aufsetzen und bei Wartungsaufgaben des Servers
Zudem brauchte ich jetzt nicht mehr nur fürs EF Unterlagen, sondern auch fürs OF. Ich habe mir gedacht, es wäre toll, wenn ich pro Klasse eine separate Seite machen könnte. Dann hätten die Schüler*Innen Zugriff auf ihr Skript bis zur Matur, ohne die Gefahr, dass plötzlich Inhalte ändern oder verschwinden.
Vuepress
Da ich mich bereits etwas mit Vue befasst habe, bin ich dann schlussendlich auf Vuepress gestossen. Vuepress verwendet Vue.js, Markdown und Webpack und ist ein statischer Seitengenerator. Die Webseite wird lokal mit Hilfe eines Node-Servers entwickelt. Vor der Veröffentlichung wird ein Build gemacht. Die daraus entstandenen HTML- und js-Dateien sind optimiert und müssen nur noch auf einen Webserver raufgeladen werden. Der Webserver benötigt keine serverseitige Skriptsprache und keine Datenbank.
Vuepress
Static-site-generator basierend auf Vue 2 (Vue 3 in Beta), Markdown und Webpack.
Vitepress
Letztes Jahr habe ich das erste Mal mit Vitepress gearbeitet. Vitepress gilt als der kleine Bruder von Vuepress und setzt dabei bereits auf Vue 3. Zudem verwendet es Vite an Stelle von Webpack. Vitepress ist zwar weniger weit verbreitet, dafür aber wesentlich schneller als Vuepress.
Vitepress
Static-site-generator basierend auf Vue 3, Markdown und Vite. Momentan noch in 0.x-Status.