How to use Backbone.js for multi-page web application?

Question

I always used trunk routes (#! / Blah)

But I understand that in order to index Google, you need to provide a non-javascript version of the site.

I do not like to write code twice. Thus, I would prefer to create a multi-page application instead of a single-page web application.

Backbone.js provides me with a "structure", so my javascript does not turn into sphagetti mess. But I do not know at all how to create multi-page applications using Backbone.

Do you include a main.js file on every render page? What about the routes? How do you deal with this? How do you feel about modulation, etc.

I wish there was a tutorial on how to create multi-page javascript applications using Backbone.

Answer 1

There are many considerations for doing something similar, but there are two keys here:

Page Maintenance

You probably want your web server to trace everything to serve the same static page (assuming these are static assets). This means that everything at http://yourdomain.com/* will be served by /var/www/yourdomain.com/index.html . Once the static page is loaded, the JS on this page will decide what to do based on the URL.

Click Status

To perform routing, you can still use trunk routing, but do not use hashbangs ( #!/blah Blah style URLs). See http://backbonejs.org/#History , for example. This will allow you to navigate to real URLs without actually refreshing the page. If the browser does not support pushState, everything will work, but it will reload the page.

Answer 2

@ Jamie Wong's answer gives you part of the way. Using the pushState URL instead of the hash, Google should treat each route as a different page. However, since I assume that the content for each route is generated dynamically, it is unclear whether Google can capture all the content. Google definitely has the ability to access dynamic content like @Domenic mentioned above, but the questions are:

1) How much can they get?

2) Are they trying to access as much as possible from ALL sites or, perhaps, only from large data sites such as Facebook?

You can try to provide default data for each view and layers in a dynamic, custom-style material later. The trunk calls this download. http://backbonejs.org/#FAQ-bootstrap