What do you get when combining EF5, Web API, Bootstrap, jQuery, Breeze, Knockout, Sammy, Require and SignalR into a single MVC 4 app ? Behold SuperSPA Template.

Standard

Hello Dear Reader,

This is my first post of 2013 so I want it to have a special creativity flavor. :)

SPA´s or Single Page Apps are really the buzz words of the moment, so after being inspired by John Papa´s Pluralsight video, I decided to create my own SPA template for VS 2012.

You are probably wondering…wait isn´t there a SPA Template delivered with the ASP.NET Fall 2012 Update? Yes and it´s awesome! But it doesn´t have all the technologies mentioned in the video as well as others like SignalR, Breeze, Bootstrap, etc that I bring in.

Say hello to SuperSPA Template! A responsive SPA app that works on all modern HTML 5 browsers and devices.

SuperSpa Template

SuperSpa Template

The user story behind the template (the Photo BlurZ! app) is very simple. It´s a blurred images sharing site where users can not only search and download those images (so called blurz) as well as contribute to the gallery by uploading their own.

What it´s interesting about this SPA is that all data changes are processed in real-time, that is to say if you open 2 browser windows and user in window 1 uploads an image or changes the image ratings, user in window 2 will immediately see those changes. How cool is that? ;)

Also because it makes heavy use of local caching, the app is quite fast and server round-trips only happen when absolutely necessary or when the internal entity change detection mechanism tells it to do so.

Enjoy!

About these ads

4 thoughts on “What do you get when combining EF5, Web API, Bootstrap, jQuery, Breeze, Knockout, Sammy, Require and SignalR into a single MVC 4 app ? Behold SuperSPA Template.

    • First of all thanks for the follow! :)
      This post is merely to show my end result of mixing all those technologies together into a SPA, it´s not meant to be instructional. For that I totally recommend the Pluralsight video I mention. But feel free to ask anything you would like to know in more detail.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s