The World of WordPress

About a year and a half ago I made the switch from Posterous to a WordPress for my blog. I figured that I might as well learn how to use the 800 pound gorilla in the room. For the most part, things went well considering that I wanted to run it on Windows under IIS and use SQL Server as the database. I added some plugins for the basics like commenting, syntax highlighting and the like. The import from Posterous was smooth with nothing lost.

And it was good.

I’m not sure if it was the WordPress upgrade or an update to one of the plugins. One day a few months ago I tried to create a new post only to have 90% of it just disappear upon hitting save. I hit the edit button and retyped a paragraph to see if that would save. It didn’t. Typed a little less then previewed the post this time. Gone. I did a few more experiments with creating new posts and editing them in various stages. They all seemed to auto-save early in the entry and then get locked forever.

A Ghost in the Darkness

I wasn’t sure what I wanted to do about my blog. I wasn’t in the mood to re-install WordPress. I looked at a few blogs written in .NET, but none of them really appealed to me since most are written using WebForms. Then I saw the KickStarter for Ghost popup on Twitter. It’s basically the start of a new platform designed to focus on blogs vs the CMS style product that WordPress has become. Its written in Node.js with SQLite as the default backend database. Markdown is used as the input language with a real-time preview as you create a post. It looks to leverage the best of HTML5 to make a state of the art blogging platform.

My initial reaction was probably the same as most developers when they see something cool on the web:

I can build that!

And so I did.

“I see you have constructed a new lightsaber.”

There’s a bit of me that feels writing your own blog is a rite of passage as a developer. I know most people use existing packages because why would you really want to waste time at creating something that has been created hundreds of times before. For me, this is a chance to not only give it my personal touch, but really experiment with new technologies and practice the skills outside of my comfort zone. Some might say it’s like a Jedi building his first lightsaber.

At work I almost exclusively use ASP.NET MVC 4. And while I really do like using it, I felt this was the perfect time to try building a website in Node.js and Express. I really liked the idea of using Markdown instead of a WYSIWYG editor or plain HTML. I also liked the idea of having the layout update in real time when writing a post. I’m using MongoDB since it’s my go-to datastore due to how easy and fast it is. So far the core is done. It’s still mostly MVF (minimum viable functionality), but I’ll keep tweaking it as I go.

Here are some of the highlights that I’m proud of or really happy with.

Editing

To get the dual Markdown/HTML rendering I’m using Pagedown which is from the folks at Stack Exchange. Its the editor they use on their sites. It was really easy to implement and there’s even a 3rd party add (Pagedown.Extra) on which extends the Markdown a bit more for things such as tables and code syntax highlighting. For syntax highlighting I’m using SyntaxHighlighter.

For uploading images and files I integrated Dropzone.js by overriding the image dialog in Pagedown. Dropzone is amazingly simple implement and provides thumbnails of the images as you upload. Just eye candy, I know, but the effect is sweet.

Here’s a screenshot of me writing this post: Editor

Styling

If there’s anything I need more practice at, it’s design. Thanks to Twitter Bootstrap, I got a running start. I like the clean and simple look so I tried to keep plenty of whitespace and let it define the sections. I’m using LESS for the CSS. I’m not yet customizing Bootstrap, but its on the list. Font Awesome is used for the icons. I went pretty minimalistic on the colors sticking to the really-dark-grey-and-black on while. I’m still iterating over the layouts, but I think I’m pretty close.

Hosting

I run my own servers, so I wanted continue to host my blog locally. For now I’m using iisnode with Node.js 0.10. One of the benefits is that I can have IIS host all of the static content and only have Node host the dynamic pages. This is the standard Node configuration I hear about, with the exception that its Nginx used instead of IIS. The concept is the same.

I have Grunt setup to do my build and deployment so I can test locally then push out the live site. I really like Grunt and am looking at how feasible it would be to use in the .NET world for things like project scaffolding.

Performance

I wanted the site to be fast. Really fast. I tried to do all that I could to optimize the site. Grunt combines and minifies my JavaScript and CSS. Express is gzipping the content. The slowest part of the site is Disqus which is used for comments. Without Disqus, page load times are sub-70ms. Someone said on Twitter that a blog without comments is not a blog (and I agree), so its a price I’m willing to pay. One way I make things fast is loading all posts in memory and keeping them there. I don’t have thousands of posts, so I can get away with that. Right now Node is only using ~60MB of memory, so I’m not too concerned.

Almost there

I still have a few behind the scenes sections to create. I want to build up a dashboard for some stats. Probably won’t be as amazing as what Ghost will provide, but I’m not sure I need that much. I still have Google Analytics running anyways, and its not like I’m going to beat that.

I also want to pretty up the Edit page to use auto-completion for the tags and to have the url get built from the title automatically. Just a bit of extra polish really.

I do have an RSS feed, so if you’re interested in .NET and Javascript posts, please do subscribe.

Until next time…