I Yack About My Blog

I used to use WordPress, but I got tired of it. I had to keep updating it, it had lots of overhead for features I wasn't using, the codebase inside is not my favorite, and I really thought it would be much cooler if I wrote and used my own blogging software.

I was inspired by Jekyll and a couple blog posts I read about it to use Markdown and generate static pages. This was inline with my own goals in three ways:

First, my very first website was hosted at a place that did not allow server-side code, so my way around it was to put all the header/footer code in a Javascript file to insert it (document.write FTW!) client-side. I even had a site search done in Javascript using a (manually created) JS array of meta data to search.
Second, I like making things as performant as possible (by design, not by optimization because I'm no optimization expert), so have long wanted to make a site building platform that handles static content without running PHP/Ruby/Python to rebuild it every time.
Third, even with WordPress I would still write all my posts as RTF files in TextEdit, then copy-paste them into WP.

So the idea of writing all posts in Markdown then generating them into static files and loading all dynamic widgets via Javascript just all made sense to me.

Building a Blog

I use git for the whole project. There's an article directory for the markdown files. The public directory (the only one that is web-accessible) has a front controller, resources, and sub-folders where the generated html articles go. The html should be static, with all changes done either in the sytle.css or in blog-widgets.js.

I was able to easily convert several articles from my RTF files to Markdown. No need to dig through WordPress's database format. I chose a few that search engines keep trying to index and a couple more that I liked. I dumped tons of junk posts, mostly ones that were mandated by class assignments from college. A script generates the HTML from the Markdown, and stores meta data about the articles in a database. A PHP backend hosts the index pages and sitemap files. The landing page redirects to the most recent article.

Since the list of categories might change, that too is loaded in blog-widgets.js. The menu is there, it just has no content initially.

Everyone else is doing it, so I chose to use Bootstrap via Initializr for the layout. It's clean and simple with some nice shades. I used the greens, oranges, yellows, and blues from my main site's design in the Less templates and it turned out looking OK. You can probably tell that I'm no design expert, but I try (perhaps to my shame). In theory, Bootstrap should make sure that non-designers like me are able to make non-ugly web sites.

For the backend code I'm using PHP. I learned web programming on PHP (after the days of copy-paste-modify Javascript and HTML), so I like it and it's easy to set up. But I don't like CodeIgniter at all. I always have to make a ton of modifications. So my front controller is one I built myself, evolved from a minimal dispatch page to include a few helpers. It's organized like Rails, with controllers, models, views, etc. I also have data base helpers including a base class for ORM models that work as magically as those in Ruby on Rails. I'm quite proud of it, but largely because I wrote it myself. Oh, I even made a console for PHP, ./scripts/console, since Rails' console is just so useful.

Social Media

Gotta have social media these days. I considered doing the floating bar on the side, but decided it's nicer-looking and less annoying to have the social media links on the bottom. I also didn't want to bother people who don't want to be tracked, so I gave the option of turning those links off, which remembers in a cookie to not load the Facebook and Twitter scripts at all in future visits. I'm using RequireJS for (almost) all script loading, so that's easy to do.

I might add Disqus for comments, but I didn't want to bother monitoring those just yet. I'll satisfy myself with Facebook and Twitter. Later I'll decide if I want to add comments and/or other social media links.

Ultralinks

A friend of mine is working on an idea for enhancing hyperlinks on a page, allowing every word in the page to be a link. He calls this "ultralinks". The idea is that a content writer wouldn't have to decide whether to define a term, which would help newbies but irritate experts, since a seamless ultralink would be available to look the word up in Google, Wikipedia, or link to other related pages.

These are made to be more subtle than those double-underscore ads that always get in your face. Ultralinks similarly appear when hovering over a word, but they go away when you move the mouse. They also are not for ads, though conceivably could be.

If you want to see all the ultralinks on the page, hold down option (on a Mac) or alt (on Windows).

He's still working out the kinks, improving the API, and thinking up ways to improve it, but I thought I might as well play with it on my blog.