In case you hadn't heard, Microsoft released WebMatrix and its supporting cast of technologies yesterday. WebMatrix itself is just a lightweight and simplified development IDE that allows one to develop websites using ASP.NET Web Pages and the new Razor View Engine. It uses the new IIS Express and has support for the new SQL Server Compact Edition 4 as well. When you download and install WebMatrix, all of its dependencies are downloaded and installed for you transparently. I used the Web Platform Installer to install it and ASP.NET MVC 3 at the same time, and the whole process completed in about 10-15 minutes.
WebMatrix and jQuery Mobile
Recently I have seen a number of examples using ASP.NET MVC with jQuery Mobile for displaying a list of blog posts to mobile devices. I thought I would show you similar code for doing this with the ASP.NET Web Pages Framework and Razor View Engine via WebMatrix. I want to warn you up front that the solution will seem too easy. One page, and only 1 page of code and markup is all that we will need to write to create the solution ( besides our sample database, of course ).
First things first, we need a database. Let's create a simple SQL Server CE 4 database right within WebMatrix itself. The database tooling feels a lot like SQL Server Management Studio, which is fantastic for new developers as they can take these skills with them for managing other versions of SQL Server. Here is a quick snapshot of the database definition:
Once we have the database defined and add a bit of data that I pulled from my blog, I can go ahead and create a blank Razor Page with all the necessary stylesheets, JavaScript files, HTML markup, and Razor code. You can click on the image to see a more viewable version of the page, but even now it looks way too easy.
In the example, we connect to the database, define a query, and then execute the query and return the results. In this case the results are posts from the database. Further down the page we iterate through each post, displaying the date the post was published as well as a clickable title that takes you to the post.
The bonus here is that if the needs of your application grow, you can easily convert this to ASP.NET MVC 3. The top-most code gets swallowed up into a controller or service per your strategy for separating the concerns, leaving the HTML and Razor markup the same in the rest of the page.
Now here is the best part - click Run :)
You have a quick list of posts that give you a wonderful user experience on your mobile phone or tablet.
This has taken an exhausting 30 minutes, so you can now spend the rest of the day playing Caveman's Quest, Cut the Rope, Cover Orange, or any of your other favorite iPad Puzzle Games :)
Conclusion
This whole umbrella of WebMatrix technologies is really exciting. Learn more about WebMatrix, jQuery and jQuery Mobile.
If you are interested in ASP.NET MVC 3, check out my ASP.NET MVC 3 Tutorials as well.
Hope this helps.
David Hayden