This document provides guidance on building real world single page applications using various technologies including Git, AppHarbor PaaS, MongoDB integration, IoC/Dependency Injection, testing with nUnit and Moq, CI/CD, the Repository Pattern, and exception management. It discusses using Bootstrap.MVC for responsive design, Backbone.js as a client MVC library, and client-side session and authentication management. The document also covers building and deploying an app in the cloud using WebAPI which is self-hosted and flexible with content negotiation, and separating website concerns from the API.

1. How to build real world single page
applications

5.  Git
 AppHarbor PaaS
 MongoDB integration
 IoC/Dependency Injection
 Tests with nUnit & Moq
 CI + CD
 Repository Pattern
 Exception Management
 Authentication & Authorization

6.  Bootstrap.MVC for responsive design
 Backbone.js client MVC lib
 Client Side session management
 Client side authentication

7.  Build and deploy an App in the Cloud

8.  WebApi is Self Hosted and more flexible
 WebApi Has Content Negotiation
 Separation of concerns
• Allows detaching the website from the Api

9. User Question Vote
• Name • QuestionText • UserId
• Password • IsOpenToVotes • Answer
• PassSalt • List<Vote>
• AccessToken

10. The Api…

11.  User Model:
public class User : Entity
public string Name { get; set; }
public string Password { get; set; }
public string PasswordSalt { get; set; }
public string AccessToken { get; set; }

12.  User Api Model:
public class User
public string Id { get; set; }
public string Name { get; set; }
public string AccessToken { get; set; }

13.  Use AttributeRouting nuGet Package
public class SampleController : ApiController
{
[GET("Sample")]
public List<Tweet> Index() { /* ... */ }
[POST("Sample")]
public void Create() { /* ... */ }
[PUT("Sample/{id}")]
public void Update(int id) { /* ... */ }
[Route("Sample/Any-Method-Will-Do")]
public string Wildman() { /* ... */ }
}

14. Main

15. Dependency
Main
Injector

16.  Pros
• Decoupling
• Easy Testing, Isolating and Mocking
 Cons
• Complicates the code
• New set of bugs

17.  Add StructureMap.MVC4 nuGet Package
to the website
 Build classes with IoC in mind
 Add Repository Registry
 Add Registry to Ioc.cs in Depedency
Resolution folder

18.  Not a part of Asp.Net.
It’s just a best practice
 Allows:
• Code reuse
• Decoupling
• IoC/Dependency Injection
 Current Standard – Low learning curve for
developers

19.  void Add(IEnumerable<T> entities)
 IQueryable<T> All(Expression<Func<T, bool>> criteria)
 void Delete(Expression<Func<T, bool>> criteria)
 void Update(IEnumerable<T> entities)
 ...

20. The Client…

21.  Backbone.js
 Knockout.js
 Javascript.MVC
 Ember.js
 Angular.js
 Batman.js
 Sammy.js
 YUI

22.  Twitter Bootstrap
 Foundation 3 by Zurb
 HTML5 Boilerplate
 LessFramework
…

23.  Attribute Routing
 Twitter Bootstrap
 Twitter Bootstrap Starter Layout Page
 Great Backbone.js Book

24.  Chrome Extensions
• Dev Http Client
• Edit this Cookie
• Clear Cache
• JSON View
 Responsinator

25.  effie.arditi@gmail.com
 @fe_rdt
 Github: EffieArditi