Search code examples
restbackbone.jsreactjsreactjs-flux

Making a React + Backbone application restful without Collections


I'm trying to add REST to a react + backbone example.

The tutorial for doing this requires a Backbone.Collection, but the example I found (TodoMVC) doesn't seem to use Collections at all, contrary to what I expected given this tutorial on using Backbone with React.

Will this be a problem later on?

Second, how would I make the application restful without an explicit reference to a Collection. Must I rewrite it using one?

Edit:

I ended up using Collection instead, but am having trouble reorganizing some of the code.

The original example I was referencing had a bit like this:

var TodoStore = _.extend(_todos, {
    getAll: function() {
        return _todos.toJSON();
    }
    ...
 }

Now, my TodoStore becomes TodoStore = new TodoCollection();

So where do I put those functions?
I tried putting them in TodoCollection (perhaps rather naively), but new entries are no longer being saved in the store.

Where do these functions belong?

Edit 2:

Studying the previous example confused me.

It looks like their TodoStore (which I want to be a Collection) is a Model.

And when they're creating an item, they add it to that model, which doesn't make much sense to me. Shouldn't they create an instance of a model and add it to the Collection, or am I misunderstanding something?

sigh Edit 3:

Just noticed that their Model is actually an instance.

What I thought was var _todos = Backbone.Model.extend(); is actually:
... = new Backbone.Model.extend();

I suppose that changes something.


Solution

  • The TodoMVC is a constrained example it pretends to be illustrative rather than exhaustive showing all the features of the libraries.

    Backbone is kind of a buffet library, take what you fancy-need rather than a stricter framework as Angular so it "shouldn't" be a problem but it depends a bit on your REST api on the server side.

    I personally will use Collections if they seem a natural representation of aggregated objects on my DSL, generally speaking I'll "always" use it. The main advantage is to leverage all the events that you will automatically get from Collections on CRUD operations.

    Collections are ordered sets of models. You can bind "change" events to be notified when any model in the collection has been modified, listen for "add" and "remove" events, fetch the collection from the server, and use a full suite of Underscore.js methods.

    Finally all the exposed is absolutely independent wether you add React.js or not

    Regarding your edits:

    After seeing your edits I think that example it's not a good guide for your problem domain. Something like this is more "real"

    1. I tried putting them in TodoCollection right
    2. To the collection
    3. Yeah, it's not natural, they tried to keep the example simple, it should be a collection if there were a sever side
    4. Yes, it changes a lot. Have a look at Douglas Crockford article I think extend without arguments could be removed too