March 26, 2013
After going through the basic setup in my first post and some tweaks and optimizations in the second, all that I had left to do was set up the blog portion of the site.
I chose to go with Journo, a new static blog engine that Jeremy Ashkenas just released. I chose it for a few reasons. First, I like the concept of having static pages. It’s simple, and it means that I don’t have to make any changes at all on the server side. Second, it’s written in CoffeeScript, which is easy to modify if I need to (and I did). Finally, I’ve used both CoffeeScript and Backbone.js a good bit, and it’s been a pleasant experience. Both products are well documented and frequently updated. I expected Journo to turn out similarly.
Well, getting started with Journo was a bit of a hassle. It still definitely feels like a 0.0.1 release. The first attempt I made at getting it working ended in frustration. In retrospect, that was mainly due to an insufficient understanding of Underscore.js templates (also conveniently developed by Mr. Ashkenas). I ended up emailing Mr. Ashkenas with a few questions, not really expecting a response, and the next morning he had posted an updated and expanded setup guide in response to my questions. At that point, things started to click.
Even after the new instructions were posted, I still ran into some difficulties. The first was the result of a simple mistake in Journo, a missing wildcard. I sent in a pull request, and that got fixed right away. I also ran into some weird issues with Journo requiring that I have a public folder at journo/blog/public before it would build successfully, even though the folder would be empty afterwards. I think that may be a setup problem on my end though.
The biggest problem I ran into involved highlight, a code syntax highlighter that is built in to Journo. For some reason, it really didn’t like having divs built in to its templates. It would correctly build a single div for the first post, but the following posts would show up as formatted and highlighted code rather than rendered HTML. I ended up solving the problem by linking two elements using names rather than putting them in the same div. Performance-wise, it’s probably not great, but I have a long way to go before I get to the point where I have enough blog posts that it’s a problem.
After working through the problems I encountered, I still found that I was a bit limited by the options that Journo offered. I’m sure it’ll get a bit more customizable in the future, but I decided to go in and make a few changes myself.
First, I wanted my posts to show a nicely formatted date and time. I turned to moment.js for the task. At compile time, it will covert the formatted times from the manifest file into whatever format I need. That came in handy for putting a timestamp on the blog posts and a date on each post in the index.
Second, I had descriptions for each post showing on the index page. In
some of the descriptions, there were hyperlinks to other pages, which
just looked kind of bad. I ended up putting in a regex replace to filter
out <a> elements in descriptions.
entry.description = detectDescription(content, post).replace /<\/?a[^>]*>/g, ''Overall, I’m pretty happy with the results of my choice to use Journo. It’s still a very rough product, but it is also easy to customize. I really enjoyed the new litcoffee format of literate CoffeeScript. Definitely makes it easier to understand what’s going on. And writing in Markdown is also a pleasant experience. I look forward to what changes are going happen with Journo in the future.