application.html.haml

!!! html
%html
  %head
    %title Collaborate
    = stylesheet_link_tag :all
    = javascript_include_tag "jquery", "json2", "underscore", "backbone", "app"
    = csrf_meta_tag
  %body
    = yield

Sample App.js with Backbone.js

$(function(){
  Movie = Backbone.Model;
  
  var Movies = Backbone.Collection.extend({
    model: Movie,
    url: '/movies'
  });
  
  MovieController = Backbone.Controller.extend({
    routes: {
      "!/help": "help",
      "!/movies/:id": "movie",
    },
    help: function() {
      alert("here");
    },
    movie: function(id) {
      current_id = id;
      App.render();
    }
  });
    
  var DocumentRow = Backbone.View.extend({
    el: $("div#the_business"),
    events: {
      "click a.destroy": "destroy",
      "submit form": "create"
    },
    initialize: function() {
      _.bindAll(this, 'render');
      movies.bind('all',     this.render);
      movies.fetch();
    },
    create: function(form) {
      var formValue = this.$('input[type=text]');
      movies.create(
        { name: formValue.val() },
        { 
          error: function(model, response) { 
            var name_error = JSON.parse(response.responseText).name; 
            $('label[for=name]').html("Name: " + name_error); 
          }
        });
      
      formValue.val('');
      return false;
    },
    render: function() {
      if(current_id > 0 && movies.length) {
        $('title').html(movies.get(current_id).get('name'));
        $("#movie_info").html(movies.get(current_id).get('name'));
      }
      this.$("ul").html("");
      this.addAll();
      return this;
    },
    addOne: function(movie) {
      $("ul#movies").append("<li>\
      <a href='#!/movies/" + movie.id + "'>" + movie.get("name") + "</a>\
      <a class='destroy' href='#' id='" + movie.id + "'>destroy</a></li>");
      return this;
    },
    addAll: function() {
      movies.forEach(this.addOne);
      return this;
    },
    destroy: function(target) {
      current_id = 0;
      movies.get(target.currentTarget.id).destroy();
      movies.fetch();
      this.trigger('hashchange', '');
    }
  });
  current_id = 0;
  movies = new Movies();
  
  window.App = new DocumentRow();
  ws = new MovieController();
  
  Backbone.history.start();
});