The environment setup

Samples of running code are provided throughout the book. They are in branches in the Git repository. You can look at them by checking out the branch, using the following command:

git checkout [BranchName]

Since the repository is a functional app, most of the code is not relevant to the samples. The client directory contains the index.html and shell.html pages, as well as the app, content, and lib directories. The app directory is where our JavaScript is located. The content directory contains the included CSS and lib contains third-party code (Knockout, jQuery, and Twitter Bootstrap).

The included Node server has a very simple view composition that places the contents of a page in the {{ body }} section of the shell. If you have worked with any server-side MVC frameworks, such as Ruby on Rails or ASP.NET MVC, you will be familiar with this. The mechanism is not related to Knockout, but it will help us keep our code separated as we add files. The shell is in the shell.html file. You can take a look at it, but it's not directly related to the samples. The HTML for samples is in the client/index.html file. The JavaScript for samples is in the client/app/sample.js file.

Throughout this book, we will be using code that relies on ECMAScript 5 features, which are supported on all modern browsers. I encourage you to run these examples using a compatible browser. If you cannot, or if you are interested in running them in an older environment, you can use a polyfill for them. A polyfill is a JavaScript library that adds standard features to old environments to allow them to run modern code. For the ECMAScript 5 functions, I recommend Sugar.js. For the CSS3 media query support, I recommend Respond.js.