Moving house: from Netlify to Cloudflare, and a lively map of Turin

This site has lived on Netlify since 2020, built on a Gatsby starter. It felt like time for a fresh start, so I rebuilt it and moved it to Cloudflare.

The site is now a small React Router app, built to plain static files and served by Cloudflare Pages. The blog posts are still Markdown, turned into pages at build time, together with the RSS feed and the sitemap. The old Gatsby service worker gets a tiny replacement whose only job is to retire itself, so whoever visited the old site gets the new one instead of a cached ghost.

While I was at it, I polished. The frame is quieter now: ink on off-white, a pixel "N" with some of the styles of some of the things I love, I wonder who'd catch the references.

The map behind the page

The thing I'm happiest about is the background. Behind everything there's a map of Turin, the city I live in for the time being, drawn like a transit diagram: the Po and the Dora, the M1, the trams, a few buses, and the landmarks in the same thin ink line (the Mole of course, but also Gran Madre, Porta Palazzo, the Museo Egizio with its little pyramid).

It's not made up. The lines come from GTT's open data, the GTFS feed every transit app reads, simplified into a diagram by a small script. And when you open the map, every tram, bus and metro train is where GTT's timetable puts it, for an ordinary weekday, at the time it is in Turin right now. At 8 in the morning there are around two hundred of them. At midnight the metro is asleep and a handful of night owls are still going round.

A few details I spent too much time on:

• There's a clock at the bottom. Drag it and the cars fade out, hold still and they show up faded at the new hour, let go and they set off. You can watch in real time, or at 10× or 60× if you're impatient.
• The little icon next to the time is the sun rising over the horizon, climbing, setting, and turning into a moon. The light on the map follows the real sun over Turin for today's date, from a night grey to a warm day cream, so five in the afternoon in November is dusk, not the middle of the night.
• Cars actually stop at stops. They brake in, wait, and pull away, and the stop on the map gives a small pulse when someone leaves it. Buses let out a few puffs as they pull away, trams don't, because they're electric. Trams and metro trains have a rounded nose and a windscreen, so you can tell which way they're going.
• Click a tram, a bus or a metro train and the camera follows it across the city. Click another and it glides over to that one instead.
• At rest the map stays faint so it doesn't fight with the text, and zooming out takes the detail away: no buses, no stop names, just the rails.

I like that the page you're reading has a city ticking away behind it, on the same schedule as the one outside my window.