Tech Stack

How this site is built.

No framework, no build pipeline, no CMS, no analytics. Vanilla HTML, CSS, JavaScript. Hosted on OVH in France. Seventy-two pages, nine hundred kilobytes zipped, zero npm dependencies. Here are the choices behind it, and why.

— If you wonder why this page exists: because recruiters like to look under the hood. So do I.

01

The front

Semantic HTML5, modern CSS3, vanilla ES2020+ JavaScript. Zero framework — no React, no Vue, no Svelte, no Next. Seventy-two static pages hand-crafted, with a small JS template system for articles (one JS file per language, injecting content into a post.html template).

  • CSS: native custom properties (--bg, --accent, etc.), grid + flexbox, clamp() for fluid responsive, theme switching via data-attributes. A single styles.css file, 8 500 lines, carefully organized by sections.
  • JavaScript: one script.js handling nav, theme toggle, blog filters, quiz, dynamic Currently footer, cookie banner and scroll-reveal animations. Plus a few dedicated modules (chess.js, snake.js, metro.js, tags.js).
  • Fonts: Poppins (sans), Instrument Serif (editorial italic), JetBrains Mono (technical monospace), loaded via Google Fonts with preload + inline critical CSS to avoid FOIT.
  • Illustrations: 50 SVGs hand-drawn in the Direction B palette (navy + cream + bordeaux + ocher). One per article, one per section, plus a few editorial scenes.
02

The hosting

OVH France. Shared hosting. Twenty euros per year. My files, on servers in Roubaix. No Cloudflare, no Vercel, no AWS, no Netlify. Just HTTP/2 and an automatic Let's Encrypt certificate.

Deployment is old-school: I zip the portfolio/ folder, upload it via OVH's file manager, unzip, delete the old version. Three minutes. No CI/CD, no webhook. Simplicity has a comfort cost, but zero external failure points.

— OVH because it's French, I like companies from the North, and it costs me less than a coffee per month.

03

What isn't there

  • No JS framework. React + Next + Vercel would have doubled development time and tripled bundle size for an equivalent result.
  • No build pipeline. Webpack, Vite, esbuild, Rollup — none. The file you see is exactly the file I write. No transpilation, no minification.
  • No CMS. Article content lives in posts-fr.js and posts-en.js, two text files I edit with VS Code. No WordPress, no Contentful, no Sanity.
  • No package.json. Zero npm dependencies. The only "external" thing is Google Fonts (which loads font files, not code).
  • No tracking. No Google Analytics, no Facebook pixel, no Hotjar, no PostHog. I prefer not knowing who visits over surveilling visitors.
  • No external service except the contact form via Formspree (a simple SMTP proxy), and OpenStreetMap for the Travel map.
04

Why these choices

For longevity. In ten years, this site will still work as is. No major framework version breaking everything. No deprecated plugin. No third-party service shutting down.

For performance. First paint under 200 milliseconds on 4G. No Lighthouse at 60 because a framework loaded 3 MB of JavaScript to display three divs.

For control. I see and understand every line. Every pixel knows why it's there.

For pedagogy. A portfolio site built with React that loads in seven seconds won't convince anyone that we know how to build simple, robust, durable. The medium is the message.

05

Technical credits

A few tools helped along the way:

  • VS Code — main editor
  • Claude (Anthropic) — pair programming assistant for complex CSS and accessibility reviews
  • Figma — for initial mockups and the Direction B palette
  • Inkscape — for creating and editing illustration SVGs
  • BrowserStack — to test on Safari iOS and Edge Windows I don't have locally
  • Lighthouse + WAVE — for performance and accessibility audits

And then, as always for this kind of project: time, patience, and a lot of readjustments.

A question about the code?

The repository isn't public, but I can share bits privately if it interests you. What for?

LAST UPDATED · MAY 17, 2026