DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

Bryce Wray
Bryce Wray

Posted on • Updated on • Originally published at brycewray.com

Webmentions yes, JavaScript no

Note: Since writing the original post here, I have decided to revert to a non-webmentions approach; however, I will leave this here for the sake of anyone who may find it useful.

I tried yesterday to get my website back on the IndieWeb with at least some form of webmentions. However, within a few hours, it became clear that the third-party JavaScript code I’d used in 2020 wasn’t going to cut it now, for reasons which remain unclear at this writing. Accordingly, I resigned myself to having to dope out what changes I’d have to make in the borrowed code; and, while I worked on that, I reverted the site to its previous, non-webmentions form.

In the interim, I found myself pondering why every webmentions-on-Hugo solution I’d ever found up to now used JavaScript, rather than trying to do it purely in Hugo. After all, Hugo sports plenty of data-grabbing horsepower. For example: in my own experience to date, I’ve found Hugo's getJSON feature just as useful as the node-fetch on which the aforementioned JS relied to grab data from webmention.io.

In a short time, I’d ditched the idea of patching up the 2020 solution and, instead, started building a completely new one of my own which would use getJSON to work with the webmention.io API.1

Thus, after spending a long night and most of this day figuring it out, I present to you what I originally thought could be the world’s only Hugo-based site which displays webmentions without requiring a single line of JavaScript, although I later learned otherwise from fellow Hugo user Kaushal Modi. Also, I will confess to some pleasure in getting to trash all those node_modules folders I’d had to add just yesterday due to the dependencies on which the earlier, JS-based method relied. I’m no JS-hating purist but, hey, when you don’t need all the extra weight, why keep it in the repo?

When I have the code somewhat DRY-er, I’ll write about it.2 In the meantime, I’ve left the following comment within the webmentions-rx (formerly webmentions-pipes) partial template I’m using to suck all this into each applicable post, just in case the curious happen to find that partial on the site repo:

{{/*
  Apologies for the ugliness of the following.
  First, I'll make it work; then I'll **try**,
  at least within the limits of Go and Hugo,
  to make it a bit DRY-er at the very least.
  Fortunately, both Go and Hugo are so fast,
  I don't pay a (real) penalty for this spaghetti.
  But I **do** want to do better. Trust me, friends.
  And, yes, there are some unused vars in here.
  Some are for testing only; some are yet to be used.
*/}}
Enter fullscreen mode Exit fullscreen mode

For now, I’ll just feel fortunate if I don’t end up being the subject of one of those Jurassic Park memes about being so preoccupied with whether I could do this, I failed to consider whether I shouldβ€”but, truth be known, right now I do feel pretty good about it all. Any time I can get Hugo’s funky templating to do something a little out of the ordinary, I consider it a victory. I can only hope it doesn’t end up being the Pyrrhic kind.

Oh, and if you do happen to check out that code in my repo: I repeat that it’s very much a work in progress, and request that you not judge it too harshly.


  1. It would be funny if certain guys from my final workplaceβ€”who, three years ago, laboriously helped me through my first-ever attempts at using JS to extract data from remote sitesβ€”should happen to read this. I just hope they’re not eating or drinking anything when they do; I’d hate to be responsible for a choking incident or, at the very least, a splattered phone screen. ↩

  2. Although the code still needs work, I did write an explainer post about it. ↩

Top comments (0)

🌚 Browsing with dark mode makes you a better developer by a factor of exactly 40.

It's a scientific fact.