I’ve moved my Jekyll site into a Rails app, and I’ve done just enough work to have every post render without errors and added just enough style to make things readable. Some of the site still looks pretty bad, and none of it looks good yet. But that’s ok, because my plan is to rebuild and redesign the site in the open. I’d love to hear your feedback as I go - I haven’t built out the comments feature yet, so for now please feel free to email me or reach out/follow on Mastodon! The first post in the Rebuild in the Open series, CSS-only Submenu Navigation with Post Tags is also up. It looks at how I use the front matter tags in my posts to generate the new top nav automatically, with a HTML- and CSS-only accessible menu with submenus to display the nav.
Why move to Rails?
I originally chose Jekyll because I could deploy it for free on GitHub Pages. When I started this site in 2013, it included a few “blog posts” I’d written around the Internet, and I was excited about an idea for a new post on writing READMEs. It was a fun, week-long project to build out, and since then I’ve tinkered with it over the years, eventually moving it onto Heroku so that I could run some custom plugins, which GitHub didn’t support.
I can’t remember where I heard it, but I’ve always heard that building a blog in Rails, despite being the focus of the “Rails blog in 15 minutes video, isn’t a great idea. Things like “there’s no good off-the-shelf Rails blog” and “Rails is overkill for a blog”. In my opinion, neither of those are true, and I think that the multiple Rails blogging engines available would agree. I’ve also heard that Wordpress or Medium are better options. That might be true for those without time or skill to build a site, but I think that given the opportunity, a web developer or designer having a space where they can show their skill and personality is a boon. Why did I pick Ruby and Rails instead of some other option? Simply, it’s the language and framework I’m most comfortable with and it offers a lot of flexibility and speed. Of course, I didn’t consider that it would take me weeks to figure out how to integrate rendering of Jekyll-style Liquid, Markdown, and yaml front matter into a Rails app, but as Kent Beck said, “first make the change easy (warning: this might be hard), then make the easy change.”
Goals
- Use existing markdown with frontmatter files for posts. I didn’t want to have to manually move these files into some other format. This means that I needed to figure out how to extract the front matter from posts, render the rest of the page, and use not only Liquid but Jekyll’s particular flavor of liquid which includes some changes, notably to the include tag. There’ll be at least one post on how I did that, but for now I have open-sourced an early version of a gem to extract the front matter named Frontmatter.
- Don’t break existing post links. My site isn’t super heavily trafficked, but I do get about 300 hits per day, many from links from other blogs, Twitter, forums, and Slack. When I moved from calebthompson.io to calebhearth.com this year, I did as much as I could to reach out to these places to update their links (though there is a redirect in place for now), and I don’t want to miss out on these visits or need to go through that process again.
- Use semantic markup and don’t do something in JavaScript that HTML and CSS can handle. This is maybe a little silly, but it’s a thing I’ve tried to do for a long time, and if nothing else it’s an entertaining constraint that helps me to learn.
- Make it (nearly?) as fast as the static pages I had before. Performance matters, and it shouldn’t need to be a tradeoff I make to move from a static site to Rails. I think it’s likely that with both in-app and eventually edge caching, this iteration can be faster than the old one.
- Write up the interesting bits of the design and development as I go. What’s the point of having a blog if it doesn’t get used? Here is a spark chart of number of posts by year since 2013, old to new: █▂▁▁▂▃▁▄. I have plenty of ideas for things to write, and having this goal will hopefully give me a chance to increase the right side of that chart.
- Make sure that the D&D Ancestries and D&D Classes pages look good. These pages account for the majority of the traffic on my site. It’s mostly organic search traffic, so I don’t want the Google bot to decide the page is unusable and lower my page rank. While for most content it doesn’t matter as much that it looks good today (it should in the future of course), I don’t think the overlap of interest in Programming and D&D content is very large, so the latter community (who would more likely be seeing these posts) should look at least as good as they did on the old site.
- Build the tooling in a way that it could be open sourced Whether or not this happens, I can’t promise, but building things to be open source means that you give them more consideration, and if they are released at some point, that’s even better. As I mentioned, [Frontmatter][extract the frontmatter] has already been released in an early form. See below for more ideas on this goal.
- Responsive My previous site had usability and readability issues on mobile. I’m hoping that with a fresh start on styles, I can avoid that issue this time around.
- Provide separate Programming and D&D feeds My content is starting to diversify from mostly programming to a mix of programming and D&D. I should provide landing pages and RSS feeds for different tags so that people can opt into what they’re interested in.
Possible open source extractions
These are features I intend to build out for the blog, and which Jekyll wouldn’t have been very friendly to building. As I build these out, I’ll do it in a way that could be extracted and released for others to use.
- Have webmention-based commenting system. I think open standards are important, as is owning your own content (another reason I don’t want to use Medium). Webmention is a really interesting idea where when you comment/like/link to another site, you send a notice to that site with a link to your content and a link to the content you’re referencing. The original site can then do whatever with that info, including posting your comment for others to view. I’m working on a gem to bring Webmention functionality into Rails for any page.
- A gem to fetch my Book and Film reviews from elsewhere I pull my Goodreads and Letterboxed data into books and films pages that show my star ratings and reviews. While these were present on the old site, I don’t think anyone ever looked at them and they weren’t updated very frequently because that was necessarily a part of the build process, which was only run as often as I updated the site.
- Jekyll-style frontmatter/markdown/liquid rendering I have a couple classes currently doing this, and while it’s currently too entangled with the assumptions of my app, I’d like to clean them up and release them for others.
- Bundle it all up A Rails engine that will bring these other gems together into a similar blogging “platform” to this one. It will include instructions and/or tools to make migration from Jekyll into Rails easier, should others be interested in making that jump.
I hope to hear from you what you think, whether you’d use any of these gems, and what you’re interested in hearing about in redesigning a site from scratch or building a Rails blog. Once again, you can email me or find me on Twitter.