Testing JS Fiddle

fiddle.css

p {
  padding: 2px 5px;
}

p span {
  color: red;
}

fiddle.html

<header>
  Track My Fat
</header>

<nav>
  <a href="#create">New weigh in</a>
  <a href="#index">All weigh ins</a>
</nav>

<section id="page"></section>

<footer>Created by Matthew Wratt</footer>

fiddle.js

var Application = Backbone.Router.extend({

  routes: {
    '': 'home',
    'create': 'newWeighIn',
    'index': 'allWeighIns'
  },

  home: function() {
    alert('home');
  },

  newWeighIn: function() {
    alert('new weigh in');
  },

  allWeighIns: function() {
    var weighIns = new app.collections.WeighIns();
    weighIns.fetch({url: '/gh/gist/response.json/2873813/'});
    app.weighIns = weighIns;
  }

});

var app = new Application();

app.models      = {};
app.collections = {};
app.views       = {};

app.models.Base      = Backbone.Model.extend({});
app.collections.Base = Backbone.Collection.extend({});
app.views.Base       = Backbone.View.extend({});

app.models.WeighIn = app.models.Base.extend({});
app.collections.WeighIns = app.collections.Base.extend({
  model: app.models.WeighIn
});

$(function() {
  Backbone.history.start();
});

fiddle.manifest

name: Test
description: jsFiddle test of using a github gist
authors:
  - Matthew Wratt
resources:
  - http://underscorejs.org/underscore.js
  - http://backbonejs.org/backbone.js

fiddle.response.json

[{"id": 1, "date": "01/01/2012", "weight": 103.5},{"id": 2, "date": "02/01/2012", "weight": 103.4}]