wandy.dev

I’m very excited to announce that I’ve added two ways that you can interact with my blog posts! webmention and Mastodon replies! As I stated in my first post, I want this to be my home on the web. A part of that is being able to send and receive interactions from elsewhere on the web, while maintaining a record of those interactions here. As of writing, I can send, receive, and display interactions via webmentions from other sites on the IndieWeb (Although I still haven’t decided how to notify myself of those webmentions… HMU @wandy_dev if you have ideas to accomplish this) I can receive replies from Mastodon and display them below a blog post as well.

All of code for this implementation is in a replies.js file. I’m not trying to make a tutorial, but I can give you a quick overview of how I implemented this.

Workflow for Mastodon replies

I’ve built my site using Jekyll which lets you write your post in a markdown format, with optional metadata defined on the top of the markdown file in what Jekyll calls Front Matter For the Mastodon replies I first need a Mastodon post ID to include in the blog post’s frontmatter. The workflow goes like so:

1. Create a blog post
2. Create a Mastodon post that links to the blog post
3. Copy the Mastodon post ID and add it to the front matter metadata then redeploy

The ID of the post gets placed into the DOM, and then pulled by replies.js. The script will then make Mastodon API calls for retrieving replies. If we have no replies, it displays a call to action with a link back to the original Mastodon post. If we have no post id, that basically just means that comments are disabled and nothing shows up.

Cons to this implementation

• You have to deploy twice to actually enable the Mastodon replies. I suppose this could be a pro or a con, depending how you look at it.
• No cacheing. As Aral of the smallweb pointed out, popular posts with lots of replies have the potential to ddos their hosts. Fortunately I don’t have much of a following, so I doubt this will be an issue for me, but if you use my code as inspiration, just know that it fetches the posts every time the page loads.

I’d like to thank Ashley for her blog post that goes over the technical details of setting up webmentions. I used that as a starting place for my webmentions implementation.