javascript - BackboneJS site structure - Stack Overflow

admin管理员组

文章数量:1023848

Ok I am trying to get my head round this whole backboneJS thing. I understand you have to separate your site into modules and break each module down into Models, Collections and Views like described in this example.

My JS file structure currently looks like this:

-js
  -application.js

  -lib
    -jquery.min.js
    -backbone.min.js
    -underscore.min.js

  -modules
    -newsfeed.js //activity feed
    -file.js // page to upload files to
    -members.js // page that show other members of group
    //-general-site-logic.js??

---

I have two questions:

1. Should all application logic be controlled from BackboneJS? If not then where should this separate logic reside in my application structure? Surely backbone can't control all of your client-side activity. What about activity that doesn't involve any collections?

2. Should I be using RequireJS to manage modules when using BackboneJS or not? I have found this example but it seems to plicate the already confusing concepts of Backbone even further.

I am about to embark on a very javascript heavy app and really want to get this right before my code begins to mushroom!

Ok I am trying to get my head round this whole backboneJS thing. I understand you have to separate your site into modules and break each module down into Models, Collections and Views like described in this example.

My JS file structure currently looks like this:

-js
  -application.js

  -lib
    -jquery.min.js
    -backbone.min.js
    -underscore.min.js

  -modules
    -newsfeed.js //activity feed
    -file.js // page to upload files to
    -members.js // page that show other members of group
    //-general-site-logic.js??

---

I have two questions:

1. Should all application logic be controlled from BackboneJS? If not then where should this separate logic reside in my application structure? Surely backbone can't control all of your client-side activity. What about activity that doesn't involve any collections?

2. Should I be using RequireJS to manage modules when using BackboneJS or not? I have found this example but it seems to plicate the already confusing concepts of Backbone even further.

I am about to embark on a very javascript heavy app and really want to get this right before my code begins to mushroom!

• javascript
• module
• backbone.js
• structure
• requirejs

Share Improve this question Follow edited Oct 14, 2011 at 9:44 wilsonpage asked Oct 14, 2011 at 9:37 wilsonpagewilsonpage 17.6k2323 gold badges105105 silver badges150150 bronze badges 3

• You don't have to organize it the way they describe in the example. It depends on how plex your app is (i.e. do you have a lot of different use cases, or just a handful?) – Eric Turner Commented Oct 14, 2011 at 9:47
• This app could scale to bee very plex on the clientside. But I can't see how certain features would implement into the BackboneJS proposed structure I have seen so far. Basically: Where can logic unrelated to Backbone reside? – wilsonpage Commented Oct 14, 2011 at 9:59
• @pagewil Where can logic reside? It depends on the particular logic. We have a "helpers" folder (see my answer) where we put our hard-core putation helpers that get called by our backbone views/models. – Brian Genisio Commented Oct 14, 2011 at 10:48

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 8

The great thing about Backbone is that it is just a collection of useful pieces that you can put together however you want. You can organize it however you want.

Surely backbone can't control all of your client-side activity.

Why not? I have a rather large client-side app where all of the code (aside from jQuery plug-ins and such) is written using Backbone constructs (Views, Models, Collections, Routers).

In our case, we are using Rails, so we don't need to worry about requiring other JS files. We break the project up into many js (coffee) files and the "asset pipeline" merges it all into one js file for us. (we do need to tell the asset pipeline some ordering rules, however... models before collections, collections before views, etc)

When we do this, we have the following setup:

-assets
  -javascripts
    -backbone
      -collections
      -helpers
      -models
      -routers
      -templates
      -views
      -bootstrapper.js

Of course, that is how WE do it. For larger projects, I always know where to find my ponents and we create subfolders within for our different sub-views. For instance:

-views
  -people
    -people_list.js
    -people_item.js
  -orders
    -order_list.js
    -order_item.js
    -order_form.js

On smaller projects, however, you can put everything in one JS file and it wouldn't be a problem. Most toy examples are laid out this way.

An intermediate layout might be something where you just separate your models from your views like this:

-models.js // models and collections
-routers.js
-views.js

I guess what you should get from this is: "Organize however you'd like". Do what makes sense for the project size and your team's understanding of organization.

Backbone provides structure. It isn't opinionated, however, to how that structure is designed.

If it helps I have a bootstrap, project starter integrating backbone.js, coffeescript, sinatra, jasmine and skeleton.

It'll get you started with project structure and save you time integrating the tech stack. Also uses skeleton css for responsive design.

Ok I am trying to get my head round this whole backboneJS thing. I understand you have to separate your site into modules and break each module down into Models, Collections and Views like described in this example.

My JS file structure currently looks like this:

-js
  -application.js

  -lib
    -jquery.min.js
    -backbone.min.js
    -underscore.min.js

  -modules
    -newsfeed.js //activity feed
    -file.js // page to upload files to
    -members.js // page that show other members of group
    //-general-site-logic.js??

---

I have two questions:

1. Should all application logic be controlled from BackboneJS? If not then where should this separate logic reside in my application structure? Surely backbone can't control all of your client-side activity. What about activity that doesn't involve any collections?

2. Should I be using RequireJS to manage modules when using BackboneJS or not? I have found this example but it seems to plicate the already confusing concepts of Backbone even further.

I am about to embark on a very javascript heavy app and really want to get this right before my code begins to mushroom!

Ok I am trying to get my head round this whole backboneJS thing. I understand you have to separate your site into modules and break each module down into Models, Collections and Views like described in this example.

My JS file structure currently looks like this:

-js
  -application.js

  -lib
    -jquery.min.js
    -backbone.min.js
    -underscore.min.js

  -modules
    -newsfeed.js //activity feed
    -file.js // page to upload files to
    -members.js // page that show other members of group
    //-general-site-logic.js??

---

I have two questions:

1. Should all application logic be controlled from BackboneJS? If not then where should this separate logic reside in my application structure? Surely backbone can't control all of your client-side activity. What about activity that doesn't involve any collections?

2. Should I be using RequireJS to manage modules when using BackboneJS or not? I have found this example but it seems to plicate the already confusing concepts of Backbone even further.

I am about to embark on a very javascript heavy app and really want to get this right before my code begins to mushroom!

• javascript
• module
• backbone.js
• structure
• requirejs

Share Improve this question Follow edited Oct 14, 2011 at 9:44 wilsonpage asked Oct 14, 2011 at 9:37 wilsonpagewilsonpage 17.6k2323 gold badges105105 silver badges150150 bronze badges 3

• You don't have to organize it the way they describe in the example. It depends on how plex your app is (i.e. do you have a lot of different use cases, or just a handful?) – Eric Turner Commented Oct 14, 2011 at 9:47
• This app could scale to bee very plex on the clientside. But I can't see how certain features would implement into the BackboneJS proposed structure I have seen so far. Basically: Where can logic unrelated to Backbone reside? – wilsonpage Commented Oct 14, 2011 at 9:59
• @pagewil Where can logic reside? It depends on the particular logic. We have a "helpers" folder (see my answer) where we put our hard-core putation helpers that get called by our backbone views/models. – Brian Genisio Commented Oct 14, 2011 at 10:48

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 8

The great thing about Backbone is that it is just a collection of useful pieces that you can put together however you want. You can organize it however you want.

Surely backbone can't control all of your client-side activity.

Why not? I have a rather large client-side app where all of the code (aside from jQuery plug-ins and such) is written using Backbone constructs (Views, Models, Collections, Routers).

In our case, we are using Rails, so we don't need to worry about requiring other JS files. We break the project up into many js (coffee) files and the "asset pipeline" merges it all into one js file for us. (we do need to tell the asset pipeline some ordering rules, however... models before collections, collections before views, etc)

When we do this, we have the following setup:

-assets
  -javascripts
    -backbone
      -collections
      -helpers
      -models
      -routers
      -templates
      -views
      -bootstrapper.js

Of course, that is how WE do it. For larger projects, I always know where to find my ponents and we create subfolders within for our different sub-views. For instance:

-views
  -people
    -people_list.js
    -people_item.js
  -orders
    -order_list.js
    -order_item.js
    -order_form.js

On smaller projects, however, you can put everything in one JS file and it wouldn't be a problem. Most toy examples are laid out this way.

An intermediate layout might be something where you just separate your models from your views like this:

-models.js // models and collections
-routers.js
-views.js

I guess what you should get from this is: "Organize however you'd like". Do what makes sense for the project size and your team's understanding of organization.

Backbone provides structure. It isn't opinionated, however, to how that structure is designed.

If it helps I have a bootstrap, project starter integrating backbone.js, coffeescript, sinatra, jasmine and skeleton.

It'll get you started with project structure and save you time integrating the tech stack. Also uses skeleton css for responsive design.

本文标签： javascriptBackboneJS site structureStack Overflow