---
title: A Photo Site That Generated Itself From a Folder
description: 'A folder of photos becomes a static site: five widths, three formats, hashed filenames. Started as a Webpack script in 2016; mostly an excuse to walk.'
date: 2026-04-27
period: '2016 onwards'
thumbnail:
  src: ./_assets/photos.jpg
  alt: Screenshot of a generated photography site.
article:
  tags: ['web', 'tools']
  role: Site generator author
  stack: ['Webpack', 'Vite', 'TypeScript', 'Image processing']
  outcome: A photography site that updates itself when I drop new images into a folder
  audience: general
project:
  title: Photo Site Generator
  description: Point a build script at a folder of photos, get a static site with responsive image variants. An excuse to walk with a camera.
---

I take walks with a camera. Most of what I shoot isn't good, but walking slowly with a frame to think about is the most reliable way I know to come back with an idea for whatever I'm actually working on. In the summer of 2016 I wanted somewhere to put the few frames that survived, and I wasn't going to run a CMS for it. So: a Webpack script. Point it at a directory of full-size photos, get a static site with responsive variants of each. Drop a photo in, build, deploy.

The site still exists and still works exactly that way, though almost none of the 2016 code survives. The current build renders every photo into five widths and three formats (AVIF, WebP, and a JPEG fallback), strips the EXIF, and bakes a content hash into each filename so a change to the encoder settings can never serve anyone a stale image (a lesson from the first iteration, learned the usual way). A catalogue file and the photo folder have to agree exactly, in both directions, or the build refuses to run. It's a lot of pipeline for a site whose whole job is showing pictures without a framework attached, but the pipeline is what keeps the habit cheap: photograph, drop in the folder, push.

The same walks later produced a [colour grader](/articles/photo-colour-grader/) for the same shots.
