The Comments Rabbit Hole

This past Saturday I was fighting the comments embed on this site, trying to adjust it for some changes and make it look like it belonged with the rest of what I have going on here. At some point I looked at the giant list of overrides I was maintaining just to make it feel somewhat integrated and realized it didn't make much sense.

I had two options:

1. Stop fighting it and leave the embed as-is, sticking out like a sore thumb and ignoring the dark/light mode setting
2. Remove it completely

The email form

After trying the first of my options, it was a no-no. Not only did it look bad and out of place, but it broke the overall experience and pacing of the website. I'm going for a calm ambience, and this was a lot of things, but calm wasn't one of them.

I thought for a while. Maybe instead of a comments section I should have only an email form. Comments on static websites are complicated. They require jumping through a lot of hoops that I don't know how to jump. Contact forms I know. Contact forms are easy. That was when I made this post.

Then I went to the web to investigate who was already doing that and looking at examples and how they were doing it, but really looking for validation. Then I stumbled upon this post by Sam Storino, where he details his own way of having a commenting system on the exact stack I'm using (11ty, GitHub, Netlify). With total control, and in a somewhat simple way.

And of course I got oh-so-excited.

"Hold my beer"

I read through the whole thing. Look, am I a developer? Yes. Would a lot of people contest that description? also Yes.

I do a lot of HTML and CSS. I know that stuff, and I know how to make good decisions when user interfaces are involved, when user experience is at stake, when maintainability is a priority, and so on. I understand technical concepts, and I can discuss them at a high level.

This thing involved Netlify CLI, Netlify functions, programmatically creating pull requests, adapting to my repository's file structure, debugging things I hadn't worked with before, TypeScript, among other scary things.

I decided to think about it and went out for a beer (or five).

On Sunday my mind was made up: I would try this thing.

I followed the tutorial by Sam step by step, and for the first hour everything went smoothly. Everything was going according to plan.

Just when my confidence was growing, I realized I needed to make some changes to the main function: my file structure is different, and my file naming convention is also more complicated.

Without going into much detail: Sam's post filenames are post-name.md, mine are YYYY-MM-DD-post-name.md. The former can be inferred from the resulting post URL, mine can't, because the URL doesn't know the post date.

I could've asked an AI agent to fix that for me, but then I would never be able to maintain that code or make further changes in the future without depending on AI, and that kind of black box makes me uncomfortable. I decided to dive into TypeScript and make the modifications.

It works!

At the end of Sunday, but really at the beginning of Monday, I was finished. I worked through this at different points during the day: between meal prepping, watching TV with my partner, going out to record my podcast. It was a busy day, but a successful one.

Late at night I migrated the few comments I had from the old comenting system, and pulled the plug. Comments were live!

If you're into that kind of thing, here's how it works:

1. You fill out and submit the comment form
2. Netlify handles the form as a contact form, creates a payload with the form contents, and passes it to a custom function
3. The custom function makes some checks to see if everything's peachy, determines wether the comment comes from a blog post or a stream post and creates a pull request on my GitHub repository, either creating or adding to the corresponding file
4. The pull request waits for me to merge it
5. Once merged to my main branch, Netlify detects the change, gets the new versions of the files, and rebuilds the whole site.

Thanks!

Sam Storino, if you read this, thank you very much for the easy-to-follow post and for sharing your code. If you come by Hermosillo sometime, I'll buy you a beer (or five).

For the rest of you, thanks for reading through this looooong blog post that was supposed to be a short note.

Can I ask you a tiny extra favor? Please leave a comment :)