Colophon

The idea

The site is a terminal window. Every page is the output of a command, and the next commands appear at the end of every page as links, so you can navigate without typing anything. With JavaScript, the last prompt of every page becomes a real terminal, and Ctrl+K (⌘K on a Mac) opens a command palette with the pages and the actions. The three ways in come from the same content source, and everything reads without JavaScript: the terminal and the palette are another way in, never the only one.

Stack

• Astro 7 generates static HTML; Preact is kept for the interactive parts.
• Strict TypeScript everywhere, with the content validated by schema at build time.
• One server function, the contact form’s, sending through Resend.
• Hosted on Vercel, deployed only after the whole CI passes: lint, types, unit and integration tests, the build, and browser tests with and without JavaScript, accessibility included.

Colors and type

The window follows macOS Terminal: a near-black background, a green prompt, directories and links in blue, errors in red and, in the security section, purple, the color of the purple team, which brings attack and defense together. That dark theme is the default for everyone, whatever the system setting. The light theme, in the style of Terminal’s “Basic” profile, applies only when you choose it: with the “theme” button in the status bar, with theme papel in the terminal or from the palette. A test reads the colors from the code itself and checks the WCAG AA contrast of every text color against every window background, in both themes.

The text is set in IBM Plex Mono. The title bar uses the system’s interface font, with IBM Plex Sans as the fallback, and the printed CV is set in IBM Plex Sans. Both are served by the site itself, with no third-party requests.

The rain

The code rain in the background is made of real data: the hash of the build you are looking at, the terminal’s command names and the file paths. It never runs under the text, and it starts fast. For people who ask their system for less motion it starts off, and they can turn it on if they want; with the forced colors of high-contrast mode it always stays off. The “rain” button in the status bar pauses and resumes it, and in the terminal rain on|fast|calm|off picks fast (on and fast are the same), calm or off. It stops when the tab is hidden, pauses after five minutes without activity and comes back when you use the page, and turns calm on a low battery.

The site’s own security

• Hash-based CSP on every page and frame-ancestors 'none', plus HSTS, nosniff, Referrer-Policy and Permissions-Policy.
• No HTML built from strings: a lint rule rejects innerHTML and similar APIs.
• A contact form validated on the server, with a honeypot, a time token, rate limiting and a daily sending budget.
• Secret scanning in CI and a privacy guard that keeps client names and private repositories out of every commit.
• Reporting rules.

Process

Decisions recorded with context, pros and cons; automated tests for the shell core, the commands, the form and the rain; browser tests for every page, with and without JavaScript; and nothing goes to production without a green CI.