Hacker News new | ask | show | jobs
by bullsbarry 5329 days ago
My company is looking to move one of our core apps from Silverlight/RIA Services to ASPnet MVC/Javascript client and we're looking to use Knockout, since it maps well mentally to what we've been doing with XAML in Silverlight.

In light of this article, what is a good application structure to use on the client if we do decide to go with Knockout?

2 comments

"It depends" - the only viable answer :D But seriously, it largely does depend on the behavior of your application.

If you're going to use Knockout to provide wiz-bang editing and binding on single page (as opposed to a slew of jQuery code everywhere), then you might not need much more than Knockout.

If you're going to be creating multi-page JavaScript applications within a single page of your site, you should look at combining something like Backbone.js with Knockout, using the Knockback library I linked to in that article.

Alternatively, if your looking for good structure for JavaScript applications in general, I have another post that introduces a few of the concepts and links to some great resources, here: http://derickbailey.lostechies.com (unfortunately, I can't get the exact URL at the moment... site seems to be slow / not responding. just look for the "Intro to composite JavaScript apps" post)

I've used knockoutjs on a few projects now and I think I could help, but the article is down, so I don't understand the context of your question.

There are several way to structure your app, but it depends on what your app does and how structured it is. On a basic level I structure every page to have a page object to handle events and setup the view model(s).

So, for default.aspx, I might have something like:

var Page = new function(){ _this = this;

  $(function(){
    //document ready
  });

  $("#dataTable").delegate(".delete",function(){
     _this.viewModel.deleteItem(ko.dataFor(this));
  });

  this.viewModel = new function(){
    var _this = this;

    //set up view model
    this.observableVal = ko.observable("");
    
    this.deleteItem = function(){
      //delete item from VM
    };

  };
};

But then you might want to have a page with multiple view models (ie UserControls that are self contained). This gets a bit tricky, especially if you want the multiple view models to interact.

Shoot me an email if you need help.