pablo.focke
CV

home / projects

Modernizing Website with AI

2026 · Astro · TypeScript · Playwright

Live site

Rebuilt my old DokuWiki portfolio as a modern, dark-themed static site — and let an AI coding assistant do most of the heavy lifting.

This website used to be a DokuWiki instance that I first set up in 2022. It worked, but it was dated: a default wiki template, all pages hand-written in wiki markup, and roughly 46 MB of media — including some brutally heavy GIFs. I wanted a modern, fast, easy-to-maintain portfolio, so I rebuilt it from scratch, with an AI coding assistant helping at every step.

The goal

  • A modern, dark “developer” aesthetic that matches the content.
  • Blazing fast static pages — no PHP, no database.
  • Easy to maintain: adding a page means dropping one Markdown file into a folder.
  • Keep every piece of content, the playable Ultimate Tic Tac Toe app, and all media.

The process

  1. Rebuild, not migrate. The old DokuWiki content was exported page by page and rewritten as Markdown files with structured frontmatter (title, date, summary, tech, links, gallery). Each project file drives its own card, listing, and detail page automatically.

  2. A static site generator. Astro was a natural fit: Markdown-driven content collections, zero client-side JavaScript by default, and a single dist/ folder to deploy.

  3. Media surgery. The GIFs were converted to MP4/WebM with poster images — a 29.6 MB animation dropped to ~1 MB — and PDFs got generated first-page thumbnails, cutting total media size from 46 MB to 16 MB.

  4. The AI pairing. The whole redesign was done interactively with an AI coding assistant (opencode): designing the component structure, the content schema, the theme, the migration scripts, and even capturing the before/after screenshots on this page with Playwright.

Before / after

The comparisons above show the same pages on the old DokuWiki (left) and the new site (right): the home page, and the Ultimate Tic Tac Toe, Eye Tracker and 3D Graphics project pages.

The result is a site that loads almost instantly, is pleasant to look at, and is maintained by editing Markdown — a huge step up from maintaining a wiki.

Before — DokuWiki home page
Before — DokuWiki home page
After — Astro home page
After — Astro home page
Before — Ultimate Tic Tac Toe project page
Before — Ultimate Tic Tac Toe project page
After — Ultimate Tic Tac Toe project page
After — Ultimate Tic Tac Toe project page
Before — Eye Tracker internship page
Before — Eye Tracker internship page
After — Eye Tracker project page
After — Eye Tracker project page
Before — 3D Graphics project page
Before — 3D Graphics project page
After — 3D Graphics project page
After — 3D Graphics project page