Life October 19, 2009

The new blog, built with EPiServer and ASP.NET MVC

It took me a while (the birth of my daughter kind of took priority) but now I’ve finally done what I set out to do almost three months ago, switched from BlogEngine.NET to a custom built blog created with EPiServer Community, EPiServer CMS, ASP.NET MVC and a lot of other great frameworks and plug-ins. And of course this little creation is released as open source should anyone want to modify it and use it themselves or just look at it for inspiration.

When I started this project I had three primary goals: to replace BlogEngine.NET with a blogging platform that I felt more comfortable with, learn ASP.NET MVC and to build something that was good enough to function as an extra set of templates for EPiServer CMS and Community.

As for the first goal I think I’ve reached it. This blog has the the features that are most important to me as a blogger while it’s built on a platform that I definitely feel comfortable with. I also feel that I have built the blog in a way that makes it very easy for me to extend it in the future.

I also feel that I have learnt a lot about ASP.NET MVC in the process. Much of my newly found knowledge has come from the excellent book Pro ASP.NET MVC Framework by Steven Sanderson. Using EPiServer products that I normally work with all day long combined with a real project where the “customer” was myself was a perfect way to try out and expand that new knowledge. 

As for the third goal there is still some refactoring, documentation and tests left before I’m totally happy with the quality of the code, but nevertheless I’m making it available for download and hope to update and improve it a lot in the coming months.

Pet features

I really like details and there are a few on this blog that I, or the people that have helped me, have put some extra effort and love into.

The header

As I normally use a picture of myself in a safari hat (taken by my wife Marie at Gods window in South Africa) as profile picture I decided to give the blog a jungle theme. My former colleague Anders Adlén helped me with that by making the background images and the HTML and CSS for the header. If you resize your browser window horizontally (go ahead, try it out!) you’ll notice a pretty cool effect very similar to the rather famous Silverback site.

Seriously, if you haven’t resized your browser window yet, do it now! :)

The avatars for comments

fishAvatars for people who comment are fetched from Gravatar. I think Gravatar is a great service but I also think that the default images that they provide when someone doesn’t have a gravatar are ugly, to say the least. So, I decided to make a custom implementation with my own default images that I’m very happy with and which also plays nicely with the jungle theme in the header. 

The first time someone posts a comment their gravatar is fetched and stored locally on my server. In the request to Gravatar I instruct it to send me a 404 response if the person who comments doesn’t have a gravatar. When that happens one of twelve animal silhouettes is randomly selected and assigned to that person as avatar. Both real and the randomly selected default avatar will be that persons avatar for future comments as well unless he or she updates his or hers gravatar, then it gets updated by a scheduled job (OK, I haven’t actually built that yet :-)).

Grade A with YSlow

yslow-logo Yahoo! YSlow is an excellent plug-in for Firebug that measures a sites performance against Yahoo!'s Exceptional Performance teams performance guidelines. I’m happy to say that the front page and most posts and pages gets an A from YSlow. The exception is a few posts with a lot of images or comments that only gets a B due to to many HTTP requests.

Frameworks used

During this project I’ve taken the opportunity to use quite a few frameworks and plug-ins that I either wanted to try out for the first time or explore further. Below is a full list of the frameworks and plug-ins that I’ve used.

Server side

Client side

A note about EPiServer CMS and ASP.NET MVC

I should probably mention that my focus when building the blog hasn’t been to make EPiServer CMS and ASP.NET MVC work together. Instead it has been to build a blog with MVC and EPiServer Community where EPiServer CMS is used for a few editorial pages and some background functionality. I, as I’m sure others will as well,  will continue to experiment with ASP.NET MVC and EPiServer CMS, but this release isn’t “the great leap forward” on that subject :) 

Download

The source code for the blog can be downloaded from CodePlex.

Thank you EPiServer

I’d like to thank EPiServer and especially Peter Sunna and Erik Dunder who made it possible for me to use their products and set up the hosting!

PS. For updates about new posts, sites I find useful and the occasional rant you can follow me on Twitter. You are also most welcome to subscribe to the RSS-feed.

Joel Abrahamsson

Joel Abrahamsson

I'm a passionate web developer and systems architect living in Stockholm, Sweden. I work as CTO for a large media site and enjoy developing with all technologies, especially .NET, Node.js, and ElasticSearch. Read more

Comments

comments powered by Disqus

More about Life