This commit is contained in:
Andras Schmelczer 2026-07-10 10:58:59 -04:00
parent 0e78c506a4
commit c86d8052c5

View file

@ -1,21 +1,16 @@
--- ---
title: A Photo Site That Generated Itself From a Folder description: 'Simple slideshow of my photos'
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 date: 2026-04-27
period: '2016 onwards' period: '2016 onwards'
thumbnail: thumbnail:
src: ./_assets/photos.jpg src: ./_assets/photos.jpg
alt: Screenshot of a generated photography site. alt: Screenshot of a generated photography site.
article:
tags: ['web', 'tools']
stack: ['Webpack', 'Vite', 'TypeScript', 'Image processing']
outcome: A photography site that updates itself when I drop new images into a folder
project: project:
title: Photo Site Generator title: Photo Site Generator
--- ---
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. I bought my first camera, a proper DSLR (a Nikon D3200) from my first summer job's salary at 15. I've been taking photos of everything that captures my imagination, or sparks aesthetic joy in me ever since. I wanted to have a simple but personal way of sharing these photos while avoiding going through social media, so this was the perfect excuse to build a photo portfolio website.
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. It started off with PHP running on a Raspberry PI in my room but, to keep maintenance simple, has since evolved into a simple Vite script generating a static HTML and variously sized photos from a folder.
The same walks later produced a [colour grader](/articles/photo-colour-grader/) for the same shots. The only rule for good tech is it has to give me more value than the effort it takes to use it. Given that part of photography I enjoy is taking photos, the website gives me little value, thus, committing a JPEG into a Git repo and pushing it is the right amount of effort to expect of me. It's still one more step than what I had to do with PHP version but I have taste in tech too, not just photography.