Frontend

23 Apr 2026, BST · 4 min read

OpenGraph, Twitter Cards, and article metadata in Astro

Canonical URLs, OG images, article:published_time, and why it all lives in BaseLayout

How this blog handles social sharing metadata — OpenGraph tags, Twitter Card markup, canonical URLs, and article-specific fields like published_time and tags — all centralised in a single BaseLayout component with typed props.

22 Apr 2026, BST · 12 min read

Playwright E2E testing AI skills: JavaScript London talk

Using Playwright and the playwright-explore-website skill to test real user journeys

Companion post for my JavaScript London talk at NewDay on 29 April 2026, covering how Playwright and the playwright-explore-website skill support E2E testing, exploratory QA, and browser debugging.

16 Apr 2026, BST · 13 min read

Designing the blog card and post hero

Reading time, cover assets, and the shared contract from card to hero

How the blog listing card and post hero share reading time, cover assets, metadata, and a single visual system from the grid to the full article page.

14 Apr 2026, BST · 6 min read

Building a dark/light theme toggle in Astro

CSS custom properties, localStorage persistence, and no flash of wrong theme

How this blog's theme toggle works — a data-theme attribute on the root element, CSS custom properties for every colour, an icon-triggered dropdown for System/Light/Dark selection, and a synchronous inline script to prevent the flash of wrong theme on load.

1 Apr 2026, BST · 5 min read

Typed content collections in Astro

Zod schemas, build-time validation, and what the draft flag actually does

How this blog uses Astro content collections with a Zod schema to validate every piece of frontmatter at build time — including typed images, optional fields, and the draft flag pattern that keeps work-in-progress posts off the live site.