Beautiful Greenfield Apps with MVC3, Bootstrap, and OpenID

I haven't done much greenfield development in the past year. So when the company sponsored hackathon was announced this year, I was a bit wary. Could I keep up with the speed demons out there when I had spent so much recently in low gear, slogging through legacy code?

Luckily there were plenty of resources for my team to use when we got started. We're only a couple of hours into the hackathon, but I wanted to record and share some of the stuff we've used so far.

MVC3 Templates

Since I was so rusty with greenfield development, I did do some excercises before the hackathon to get back into that mindset.  The links below handle straight forward new MVC3 applications. We hadn't decided on a persistence strategy before the hackathon, so I also got some practice with Entity framework. If you haven't seen Entity framework in action before, it really does seem well suited for the type of rapid development that a hackathon imposes.

http://www.asp.net/mvc/tutorials/getting-started-with-aspnet-mvc3/getting-started-with-mvc3-part1-cs
http://msdn.microsoft.com/en-us/data/gg685467

CSS patterns via Bootstrap

Now while the examples above quickly give you a very functional web application, they are ugly. No one is going to attract users with the default CSS in the MVC3 templates. Now a hackathon is not the time to do a focus group; we need at least a basic set of UI patterns. We could have stolen the design patterns from work, but that wouldn't make for a good blog post. Instead we pulled the in the CSS and JavaScript from the Bootstrap project by the Twitter team. This is a pretty great open-source set of design documents which really gives the application a modern look and feel. It even has a NuGet package to ease the implementation.

http://twitter.github.com/bootstrap/
http://nuget.org/packages/Twitter.Bootstrap

OpenID via DotNetOpenAuth in MVC3/Razor

Now you don't get to have your app branded Web 2.0 if you're still asking users to create yet another password/security question on your site. OpenID is the de facto standard for solving this problem (Suggestions to use Facebook Connect were laughed at derisively). Unfortunately OpenID has somewhat of a bad reputation for ease of implementation. So imagine our glee when we found a NuGet package for OpenID in Razor no less. We did have some trouble finding the blog posts on how to use the package properly, but I've listed the links below to save you the trouble.

http://nuget.org/packages/OpenIdPortableArea.RazorViews
http://www.johncoder.com/Post/sample-aspnet-mvc-application-using-openidportablearea
http://johncoder.com/Post/handling-messages-in-openidportablearea

Summary

We've gotten off to a great start with our hackathon application. There are a great number of resources for greenfield application development on the Microsoft stack, especially for enterprise-y developers like me who don't usually get the opportunity for this kind of development. MVC3 templates, Bootstrap, and DotNetOpenAuth give developers a great tool-set to become Web 2.0 in a few short hours.