After spending a week learning how to use JavaScript to animate frames of characters and control music, I realized the backend UI of my website was becoming a little inconsistent and lacking. Items like custom 404 pages and tag filtering for the posiel blog were missing altogether. And each blog article felt very lonely, no call to action or hyperlink to bring the audience to another page. I decided to spend an evening modernizing the backend.

I like in my projects page how the cards can be filtered by tags, and especially how each tag gets its own colour. Since I have moved to Middleman and now use Ruby on Rails to populate all of the data from my blog, it would feel natural that we can not only apply the same concept here, but extend it in a more general way where the code will look for all of the existing tags for a given blog and populate the buttons automatically. By marking the location where articles are populated with articles-wrapper and the filter buttons are populated with filters-container, I can use JavaScript to do the work in the same way it is done in the projects page. Middleman also offers an easy way to navigate between previous and next articles. With just three lines of Ruby we get styled hyperlinks to the chronological next and previous posts if they exist.

My CMS, Netlify, provides a simple 404 splash page which offers to send you back from whence you came. While it gets the job done, it does not match my style or keep the navbar for easier navigation. I had already made a simple 404 page from the pure html website, so I copied it over and updated the rules for Netlify so that any page not found errors are forwarded there.

These changes are not the end. To promote healthy development and make it easier to maintain, I would like to generalize several aspects of my site to be reusable. I currently have three formats to display a set of articles: The list view, the card view, and the map view. While each of these belong to a specific blog on my site, I could generalize them to be used on any blog or be interchanged. Secondly, I could like to abstract the filters from my projects and posiel pages to similarly filter any blog. Finally, to make my blog feel more connected, it could make sense for each project page to list the associated tag in a way where the audience can click on it and be taken to that filtered view. I find myself doing this often on others blogs.