Statisch zuerst
HTML entsteht zur Build-Zeit. Der Browser lädt fertige Seiten — kein Framework, das sich erst im Browser zusammenbauen muss.
Kolophon
Wie diese Seite gebaut ist
Der vollständige Stack — von der Sprache im Inhalt bis zum Server, der ihn ausliefert.
Diese Seite ist bewusst schlicht und schnell: kein Baukasten, kein Tracking-Wust, keine Framework-Megabytes. Was folgt, ist der gesamte Stack, Schicht für Schicht — für alle, die so etwas gern aufgeschlüsselt sehen.
Der Stack, Schicht für Schicht
Von oben nach unten gelesen: ganz oben das, was der Besucher im Browser berührt — ganz unten der Server, der alles ausliefert. Jede Schicht trägt die darüber.
Inhalt & Sprache
Sämtlicher Text lebt in typisierten Wörterbüchern. Deutsch und Englisch teilen sich ein Interface — fehlt eine Übersetzung, schlägt der Build fehl, nicht die Produktion.
- TypeScript
- Typisiertes i18n
- DE · EN
Interaktivität
Genau eine React-Insel: das handgeschriebene Terminal mit virtuellem Dateisystem. Es lädt per client:load — alles drumherum bleibt statisch.
- React 19
- client:load
- Virtuelles FS
Designsystem
Tailwind v4 über Vite, dazu semantische OKLCH-Tokens. Theme und Akzentfarbe lassen sich zur Laufzeit umschalten — ohne Flackern vor dem ersten Paint.
- Tailwind v4
- OKLCH-Tokens
- Laufzeit-Theming
Typografie & Medien
Variable Schriften (Martian Mono, IBM Plex) werden selbst gehostet, subgesetzt und vorgeladen. Die Social-Cards rendert Sharp einmalig zur Build-Zeit.
- Eigenes woff2
- Fontsource
- Sharp / OG
Werkzeuge
Ein strikter TypeScript-Check, Biome für Lint und Format, pnpm als Paketmanager. Wenige Abhängigkeiten, klare Regeln.
Build & Auslieferung
GitLab CI baut auf Node, rsync schiebt das dist/ per SSH auf den Server, Caddy übernimmt Reverse-Proxy, Kompression und Sprach-Routing — Cloudflare den Edge-Cache.
In Zahlen
- 1
- Drittanbieter-Skript: der Bot-Schutz im Formular
- 1
- React-Insel — der Rest ist statisch
- DE · EN
- typgeprüfte Übersetzungs-Parität
- OKLCH
- eine Farbachse für das ganze Theme
Leitlinien
Eine einzige Insel
React läuft in genau einer Komponente. Alles andere ist statisches HTML mit ein paar kleinen Inline-Skripten.
Eigene Infrastruktur
Schriften, Analytics und Hosting laufen auf eigener Infrastruktur. Von außen kommen nur der Edge-Cache von Cloudflare und der Bot-Schutz im Formular.
Typsicher bis zum Deploy
Inhalt, Konfiguration und sogar die Caddy-Konfiguration stammen aus typisiertem TypeScript. Was nicht zusammenpasst, fällt beim Build auf.
Diese Seite ist Teil der Webseite, die sie beschreibt — gebaut mit demselben Stack, denselben Tokens, demselben Build. Fragen zur Technik? Schreiben Sie gern. [email protected]