
CloudEdit: A Backbone.js Tutorial with Rails - jamesjyu
http://www.jamesyu.org/2011/01/27/cloudedit-a-backbone-js-tutorial-by-example/
======
jashkenas
Fantastic tutorial -- thanks for taking the time to put it together.

There's a couple things that might be better handled differently:

* Use a collection to keep track of "Documents". You wouldn't have to implement url() yourself, write the manual getJSON() request, or map the response into Document models.

* As previously mentioned, templates would help avoid a lot of the messy string concatenation here.

* You can use the "change" event to listen to changes on documents, instead of re-rendering the Index every time ... That said, with so many people editing the list of docs simultaneously, it probably makes sense to refresh the Index from scratch.

* You shouldn't have to call "delegateEvents()" again inside of Edit#save, as long as the Edit view's "el" hasn't changed.

Great work -- I really appreciate you taking the time to write such a detailed
tutorial.

------
dreyfiz
This is the best walkthrough for learning Backbone.js that’s been posted to
Hacker News yet. (In that I actually feel empowered to go use Backbone to
create something, now that I’ve read it). Thanks for posting!

~~~
dreyfiz
Part of what makes Backbone hard to learn from a lot of the tutorials that
have been posted is that the authors aren’t experienced at it enough to be
opinionated, which makes me feel lost. jamesjyu’s tutorial is opinionated
about some matters of taste, which is confidence-inspiring.

Backbone itself isn’t all that opinionated: it just offers a bunch of legos to
put together however you wish, feeling free to ignore many of the pieces. So
it’s easy to feel adrift trying to learn how to use it confidently.

------
callmeed
Great tutorial but when I see this in the conclusion:

 _Backbone.js really introduces a new kind of data flow for Rails apps.
Instead of data flowing like this:

Rails Model => Rails Controller => Rails View

It now flows like this:

Rails Model => Rails Controller => Backbone Model => Backbone Controller =>
Backbone View_

I get confused. 5 components instead of 3—sweet. Why do I want backbone as
part of my rails app? Just to ajax-ify everything? Will it reduce the load on
my server?

~~~
dreyfiz
You want Backbone as part of your Rails app to clean up your Javascript and
make it easier to do hard things…it’s meant for apps that let the user do
significant client-side state manipulation.

The alternative to “5 components instead of 3” isn’t “just 3”. It’s “3 well-
understood components on the server, and a bunch of jQuery/prototype spaghetti
on the client that I really wish was better-organized and easier to extend.”
If this describes your app, you might do well to look at Backbone.

------
Pewpewarrows
This looks like a great tutorial, but please, for the love of maintainability
stop stringing (pun intended) your views together by concatenating a bunch of
lines together all over the place.

Underscore.js (which is required (and from the same team) for using Backbone)
has a built-in templating with logic feature. In your html make a <script
type="text/html"></script> with your template code inside of it, which will be
overlooked by the browser during rendering, but you can still select and get
the contents of it by slapping on an id. Then it's just a quick call to
_.template() with your data object and it renders out beautifully. It feels
analogous to your usual MVC structure, and is much easier to debug and update.

~~~
jashkenas
James is also using Jammit here, which has built-in support for JavaScript
templates (of any flavor). I agree that it would simplify the tutorial to get
all of that string concatenation out of there.

That said, he clearly thinks that leaving templates out of it is the simpler
solution: "For the purposes of this tutorial, I'll use simple string
concatenation in my views." And from the point of view of someone just getting
started, he may very well be right.

------
foobarbazoo
I'd be willing to do the identical tutorial for SproutCore, if the author will
allow his page to be copied and edited.

(I didn't see a license anywhere allowing that.)

~~~
effkay
I would like to see that!

------
steele
Any secret sauce in not worrying about rails 3 forgery protection?

~~~
steveklabnik
His example app is running Rails 2.3.8, and also includes this little option
that's important:

    
    
        ActiveRecord::Base.include_root_in_json = false
    

If that's not in your environment, it changes the JSON from {"id":n, ... to
{"doument":{"id":n,..., which is kind of a big difference.

James, I'd consider adding a note about this to your tutorial. Also, the link
to your GitHub is a fake one; I managed to guess it properly though. Oh, and
all of your commits show you as both the committer and the author, I think
your git config is wrong. Make sure git config --global author.email is your
github email.

~~~
jamesjyu
Oh man, that is embarrassing. Link is fixed now. I'll add a note about the
json later.

~~~
steveklabnik
No worries, it happens to everyone. :D

