Building a Static Newsletter Archive

It’s definitely a labor of love. I’ve lost quite a bit of sleep on it over the years, but it’s important to me. It’s led to such cool connections between humans around the internet (Ten and David met this week after realizing they were both visiting Japan while answering the practice coding question!! How cool is that??), people getting jobs, authors getting amplified from their articles… I just really love this little space.

Anyway! I use Buttondown for hosting and sending the emails that I draft from Obsidian, and have been just linking to the Buttondown archive for previous issues.

My subscription page… has basically stayed the same since 2017. It was a plain ol’ HTML page for most of that time, until I ported my (open source!) to Astro in 2022. And even then, when porting it over, I just copied and pasted the HTML for the most part.

I’ve been procrastinating on rewriting the subscription page, because the main thing I’ve wanted to do if I rewrote it was to link to a static archive that I hosted myself.

Since each issue is written in markdown and rendered in HTML, I thought, in theory, that porting over all of my issues to my website would be easy. And then I tried it a few times, and failed every single time. It was just complex enough to do (even with the wonderful Buttondown API and some ideas I had around GitHub Actions) that I kept thinking, “eh, if it ain’t broke, don’t fix it,” and would give up when I would hit snags.

One of the things that might be kind of obvious to any reader here at this point would be like “Cassidy, why wouldn’t you use AI for this?”

I dragged my feet (and still kinda do) on ever letting any tool touch my website. I like that it’s mine and I know every line of code in it.

I acknowledge though that… at this point in time, AI would just make things faster.

This is generally the frontmatter format I’d like to work with:

And… this worked pretty dang well! Outside of adding the issue files themselves to my repo, it ended up with a relatively small amount of code changes. The GitHub Action is one that I was honestly really happy to not have to write myself:

async function* fetchSentEmails() { let url = ${API_BASE}/emails?ordering=-publish_date&status=sent&status=imported; while (url) { const page = await apiGet(url); for (const email of page.results) { if (!["sent", "imported"].includes(email.status)) continue; if (email.email_type === "private" || email.email_type === "premium") continue; yield email; } url = page.next; } }

(and then formatting the returned output for my requested Astro format)

and a script for my Netlify _redirects that lets me still have my normal hand-written redirects (like for my 404 page), but also redirects for normalizing the dates in my URLs, like so:

Once I had the logistical scripts running and working, I was able to do my fun side of the website like actually indeed rewriting and rearranging the subscription page, and formatting the CSS of the whole archive. I used almost all of my same styles for my blog, but slightly tweaked everything for the different metadata of each issue, and really enjoyed that trial-and-error process.

Timing-wise, it took me probably a month and a half (keep in mind I’m also parenting two children under the age of 4 and working full time, ha, so I was not consistently working on this) to get everything to where I wanted it from first prompt to merged code.

Now… it’s live! You can see again the subscription page and the whole archive, all the way back to 2017!

It’s not a huge, life-changing thing, but I’m just so glad to finally have these pages here on my own platform. Buttondown is awesome, don’t get me wrong, but now that I own the pages, I have some more ideas for how I want users to be able to surf through issues, filter sections, and also see the video versions I started recording this year!

It’s a process, and I’m really, really happy to get this part of it done.