Skip to content
softleb.de
DE
Choose accent colour

Colophon

How this site is built

The full stack — from the language in the content to the server that delivers it.

This site is deliberately small and fast: no page builder, no tracking sprawl, no megabytes of framework. What follows is the entire stack, layer by layer — for anyone who likes to see it broken down.

The stack, layer by layer

Read top to bottom: at the top, what the visitor touches in the browser — at the bottom, the server that delivers it all. Each layer carries the one above it.

What the visitor touches

  1. Content & i18n

    All copy lives in typed dictionaries. German and English share one interface — a missing translation fails the build, not production.

  2. Framework

    Astro renders every page to static HTML at build time. No framework ships to the browser — only what the page genuinely needs.

  3. Interactivity

    Exactly one React island: the hand-written terminal with its virtual filesystem. It hydrates on client:load — everything around it stays static.

  4. Design system

    Tailwind v4 through Vite, on top of semantic OKLCH tokens. Theme and accent colour switch at runtime — with no flash before first paint.

  5. Type & media

    Variable fonts (Martian Mono, IBM Plex) are self-hosted, subset and preloaded. Social cards are rendered once at build time with Sharp.

  6. Tooling

    A strict TypeScript check, Biome for lint and format, pnpm for packages. Few dependencies, clear rules.

  7. Build & delivery

    GitLab CI builds on Node, rsync ships dist/ over SSH, Caddy handles the reverse proxy, compression and language routing — Cloudflare the edge cache.

  8. Measure, don't track

    Matomo runs self-hosted, cookieless and honours Do Not Track — no consent banner, no third-party scripts. Each deploy pings IndexNow for the search engines.

… down to the server

By the numbers

0
third-party scripts in the browser
1
React island — the rest is static
DE · EN
type-checked translation parity
OKLCH
one colour axis drives the whole theme

Principles

Static-first

HTML is generated at build time. The browser downloads finished pages — not a framework that has to assemble itself first.

One island only

JavaScript runs only where it earns its place — in exactly one component. Everything else does without.

Own the stack

Fonts, analytics and hosting all run on our own infrastructure. No third party sits on the critical path.

Type-safe to deploy

Content, configuration and even the Caddy config come from typed TypeScript. Anything that doesn't line up fails the build.

This page is part of the website it describes — same stack, same tokens, same build. Questions about any of it? Get in touch. [email protected]