Knockout Resources

26 Oct

Following on from Tim’s great post about UI development, I want to thank CapArea.NET and Scott Lock for hosting my presentation on Knockout on Tuesday evening. For many of our pages, Knockout is the tool we use to display data. Knockout is a JavaScript framework that lets you create a JavaScript view model that represents the business data used by a page. Once you have a view model, you can add data-bind attributes to HTML elements. The data-bind attributes instruct Knockout to pull data from the view model and display it within the HTML. 

As promised on Tuesday evening, here is a list of Knockout resources and links to all the samples I used.

Knockout Samples

Here’s a list of the Knockout samples I used. All of them are from  Each of these samples exists as both a web page and a JSFiddle. I’ve included both links below:

Web Page JSFiddle
Hello World Page Hello World Fiddle
Click Counter Page Click Counter Fiddle
Simple List (Observable Array) Page Simple List (Observable Array) Fiddle
Rich List Page Rich List Fiddle
Forms Controls Page Forms Controls Fiddle
Collections (foreach) Page Collections (foreach) Fiddle
Animation & Bindings Page Animation & Bindings Fiddle
Grid Custom Binding Page Grid Custom Binding Fiddle
Contact Editor Page Contact Editor Fiddle
Grid Editor Page Grid Editor Fiddle
Shopping Cart Page Shopping Cart Fiddle
Twitter Client Page Twitter Client Fiddle

Other Knockout Resources

The main page for Knockout is here. Hands-on tutorials are here. Documentation is here.

Steve Sanderson is the creator of Knockout.

Ryan Niemeyer’s blog includes some Knockout presentations.

Knockout Validation, which I didn’t cover, adds validation capabilities to Knockout.

Knockout Grid builds on the simple grid simple we reviewed to provide a more complete grid.

At the bar after the meeting, we had some discussion of Knockout competitors.  Steve Sanderson’s list of seven JavaScript frameworks is on his blog. Although Steve is the creator of Knockout, the comparison does a pretty good job of listing the pros and cons of each framework.

ToDoMVC is an application that’s been implemented in multiple JS frameworks as a comparison tool:

AngularJS is Google’s competitor to Knockout.

Leave a Reply

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

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

Google+ photo

You are commenting using your Google+ 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 )


Connecting to %s

%d bloggers like this: