Stef's Website 🦖


You can email me at or find me on LinkedIn, GitHub and Threads.

Writing ✍️

Chakra UI is still great in 2024

Using unsafe cast in TypeBox to convert strings to template string literals

Understanding React as a system - Part 1

Speedy builds with Docker Layer Caching

Talks 🗣

5 Things I Learned About Software Engineering From Watching Art Restoration Videos

Software Projects 🌱


Await an array of promises to be settled, then reject with an AggregateError upon failure, or resolve with an array of values upon success.




A simple React hook that provides state for async actions.




JavaScript modules for implementing W3C-standard responsive images.




Print GitHub Markdown to PDF using headless Chrome. 💌




Preserve whitespace surrounding expressions in a template string.

JavaScript Source

Rust Source

content migrations at Condé Nast

Flyway is a system for migrating content from an existing CMS into Condé Nast's CMS. Content can be defined as articles, authors, categories, galleries, videos and images.

We implemented a "self-service" model to allow engineers to migrate content into our CMS without any intervention from the core team.

This system was used to migrate Vogue and GQ websites managed by 10 different market teams onto our web platform managed in London.

Flyway Manual (archive)

design systems at Condé Nast

“A unified, scalable, digital design language for Condé Nast brands.”

Atelier is a React styled-components library created for Condé Nast's brand sites. The library supports multiple brand identities and is used by a handful of different web applications.

Atelier Storybook

British GQ

Vogue Paris Défilés

real-time shock wave simulation 💥

My research project in the final year of my degree was around simulating shock waves in real time using the Unity game engine. This project was largely considered to be a failure. You can read more about it in the Technical Report doc.

marketing websites at Feral Interactive