The Question
What are the best practices for architecting an application using Knockout 2.0.1, Upshot.js, and Entity Framework 4.3?
Technology Stack
Our technology stack currently looks something like:
• SQL Server 2008 R2
• ASP.NET MVC3 (using C#) with Entity Framework 4.3 (using Code-First)
• jQuery 1.7.2
• jQuery-UI 1.8.2
• Knockout 2.0.1
• Upshot.js beta
Background (Many other developers could probably substitute their own project here for ours.)
We are developing a new Web application in which user experience is extremely important. The application involves many closely related entities. For a variety of reasons, having many or most of these entities reside in the same general visual context (and very likely on the same “page”) is highly desirable. Additionally, several page elements require frequent communication with the server.
While we originally intended to use ASP.NET MVC4 for our presentation layer, we quickly decided that may not be the best approach. After struggling how to make MVC do what we wanted, we basically concluded that our best approach would be to move virtually all UI logic to the client and just pass JSON data back and forth to the server. A Single Page Application appears to be a good fit for our client’s needs.
We had been evaluating Knockout, but were not completely “sold” on it due to the amount of work necessary to map entities (in JavaScript) exposed by our ASP.NET MVC Controller (using JSON Action methods). With upwards of 100 different entities, this manual mapping would have been extremely painful!
After seeing Steve Sanderson’s amazing presentation on “Single Page Applications” from TechDays Netherlands (http://channel9.msdn.com/Events/TechDays/Techdays-2012-the-Netherlands/2159), we thought Christmas had come early. Knockout + Upshot seemed like the perfect solution. Without taking any reasonable time to think things through, we immediately informed our client that we would be making some adjustments to our UI toolset.
As we begin to dive into the more subtle architectural questions that accompany any real-world application, we realized that there were few examples and even fewer ideas on implementation methods and best practices
We have compiled a number of the thorny architectural questions which beg for answers. We are very thankful for any ideas or solutions you can offer.
What is the best mechanism to communicate between upshot and .NET?
According to Denver Developer in his blog post titled “Digging into Upshot.js” (http://denverdeveloper.wordpress.com/2012/03/07/digging-into-upshot-js/), there are three data providers exposed by Upshot.js. These are:
• “the default is DataProvider() and uses the /Submit method and the operation you provide it to get data using jQuery’s $.ajax method.
• the next is riaDataProvider() – similar to the first, but it uses the /json/SubmitChanges method and /json/{your opertion} to get data
• finally we also have odataDataProvider() – this one is quite different because it does not currently support updating data – it is read-only.”
Which data provider is better—the default data provider or the RIA data provider? Which one is recommended?
How should controllers be configured to manage incoming and outbound data?
Our understanding is that WebAPI controllers can only have one “Get” method. If we have perhaps a couple of hundred different queries (not including filter variations) which will be executed against the server, does this mean we will require 200 different controller classes? If so, does this argue for using a data provider other than upshot’s riaDataProvider()?
How does one access and bind the meta-data available to Upshot?
One of the supposed benefits of Upshot is its ability to query meta-data exposed through Data Annotations. (At least that is our current understanding.) How would one access meta-data for entity properties for string length, default values, display name, description information, and whether a field is required?
Which client-side validation library should be used with Knockout and Upshot?
Supposedly, use of standard jQuery Validation requires the “uniqueName” binding on all form input fields. It seems that use of jQuery Validation may be discouraged. The Knockout plugins page (https://github.com/SteveSanderson/knockout/wiki/Plugins) list two validation plugins—“Knockout.Validation” and “Knock-Knock Validation”. For general use, what tool or plugin is recommended for validation with Knockout?
How does Upshot deal with creating and updating objects in a hierarchy?
When upshot is writing data back to a server, will it automatically handle the simultaneous addition of parents and their children as can be done in Entity Framework already? We assume the answer is yes, but this is not something we have yet tested.
As suggested, I am splitting this post into several smaller questions.