JSFiddle - React, Tailwind, and code Playground

HTML

<body>

<script src="js/underscore.js"></script>
<script src="js/jquery.js"></script>
<script src="js/backbone.js"></script>
</body>

CoffeeScript

# Encapsulate classes
window.App =
  apiKey: { data: $.param({'apiKey':'50b28f80e4b0995a3f4312a0'}) }
  Models: {}
  Views: {}
  Collections: {}



# The model for a single task
class App.Models.Task extends Backbone.Model
  #override backbones 'id' attr to match mongo's '_id' attr
  idAttribute: "_id"
  defaults:
    title: "None provided"
    completed: 0


# The model for a collection of tasks
class App.Collections.Tasks extends Backbone.Collection
  model: App.Models.Task   # Tell the collection which model to pull use
  url: 'https://api.mongolab.com/api/1/databases/bbone_rest/collections/tasks/'



  
  
##################### Views, prob not important ########################  


# View for a list of tasks
class App.Views.Tasks extends Backbone.View
  tagName: 'ul'

  initialize : () ->
    @collection.on 'add', @addOne
  
  render: ->
    # Cycle through each task in collection and call @addOne
    @collection.each @addOne
    return this
    
  addOne: (task) =>
    task = new App.Views.Task({ model: task })
    @$el.append( task.render().el )


# View for a single task unit
class App.Views.Task extends Backbone.View
  tagName: 'li'
  render: ->
    @$el.html( this.model.get('title'))
    return this