Converting existing rails app to a single page

Question

I would like to convert an existing rails app with multiple models,controllers and views to a single page app (SPA). How can I render views for each model not as separate html pages, but as sections of the main page (say a div for each section), which could be navigated to by scrolling vertically? Is it possible to get the same user experience, I mean specifically vertical scrolling, in a standard MVC Rails app?

Answer 1

Well, to convert a standard rails app to a Single Page Application(SPA) you need to hook it to a MVC front - end framework. The html that was being rendered by the rails calls previously will now be fed into the front-end MVC framework which will render portions of a page instead of the complete page by making AJAX calls. Nothing at all changes with the models and almost the whole of controller codes also stay untouched. As a front-end MVC framework you can look into angular.js which is from the google stable of products or backbone.js which I personally find great. In fact there's a whole host of other frameworks ranging from heavy and full- featured like ember.js to minimal and necessary like handlebar.js If you're looking for tutorials, tutsplus has a tutorial on backbone on rails that I know of. Hope this gets you started.

Answer 2

You have to render the views in the page you want to display ,there is noting to do with model and controller code .. for this refer following link http://guides.rubyonrails.org/layouts_and_rendering.html

Answer 3

It's perfectly possible, you should call your actions through javascript instead of html so that each actions return a portion of the page you want to modify instead of reloading the whole page.

Example, suppose you want to add a user to a list of user:

• when you click the add button you make a ajax post to your controller.

• this actions responds to the js format with a javascript file (controller_action.js.erb)

• This js file will evaluate a partial template corresponding to a single line of your table (_user.html.erb), find your table and append the evaluated html to the table

Have a look at :

http://edgeguides.rubyonrails.org/working_with_javascript_in_rails.html

Specifically this section which answers your question with example :

http://edgeguides.rubyonrails.org/working_with_javascript_in_rails.html#server-side-concerns

Answer 4

Try turbolinks gem Your app will be similar to one page application with less efforts and less time.