I have a single page website using ruby on rails as the framework.
On the single page I have a
header
section 1
section 2
section 3 etc
footer
The problem I am having is this, how do I organise the layouts/views/controllers.
Only in one section I have a form which needs processing and is linked to a database table (model). Can anyone advise me on how I can organise my ROR application?
The question on "how to make a single-page application in Rails" has been asked numerous times on SO like here, here and here.
You can try to look for Single Page Application (SPA) tutorials and there is a video on Vimeo here where Prateek Mohan Dayal shows off how to make a single-page application in Rails and Backbone.js.
On Back-End of an SPA
On the backend side you're most likely going to arrange your controllers and models the same way as usual with Rails, but you'll be retrieving JSON-data as views (i.e. AJAX stuff) as they're the easiest way to handle data client-side.
So think about what models you have and how you're going to work with them in controllers an arrange the code as usual.
As to how to do things AJAXy with sending JSON data to and from Rails you can have a look at Yehuda Katz Rails 3 book in this SO answer or you could have a look at this simple example that uses Rabl to develop a JSON API.
On Front-End of an SPA
It seems that most Rails developers are using either Backbone.js or Ember.js for single page application development. Both of them have some powerful javascript based view-model and databinding concepts which helps out developing the web app.
Another way to get started is to look at Addi Osmani's TodoMVC project that is a single page application (i.e. a web based todo-list) developed in many different javascript MVC frameworks. Both frameworks mentioned above are available for your perusal:
TodoMVC Backbone version - source code
TodoMVC Ember version - source code
Here are some screencasts:
Peepcode also has some starter projects and a video tutorial on Backbone.JS though like with all it's screencast's it costs.
Code school also has some tutorials for Backbone.JS where the introduction level is free.
Well, if you don't create a new layout, everything is going to be in the application layout (app/views/layous/application.html.erb), in this file you're going to create you html for the header and the foother. Also in this file you'll see a <%= yield %>, this yield is going to show you view of your controller.
Sorry about my english, I hope this help you. Also you could check the Rails Tutorial
is very helpful and very descriptive. Also you could check the RailsCast videos.
For the section 1 and section 2 you could check the rails guide to undertand how to show something in any numbers of yields. Here is the link Understanding yield
Related
I've been using Ruby on Rails since a little more than one year now and I've always do it in a casual way, I mean, everything in one place (front & back), using the standard .html.erb file populated by the associated controller method.
Otherwise, today in our project, I have the need to separate the front and the back end for multiples reasons (code maintainability / clarity, better architecture, more reactivity, etc...).
I've done plenty of researches, watch some conferences (1, 2, 3), but didn't find my solution yet. It looks like to be a question that comes often, but what is the best practice/tools to separate the backend and the frontend of a Ruby on Rails app?
I don't feel we need (yet) a huge JS framework like React/EmberJS/Angular/etc...
First I was thinking about something like Middleman/Jekyll and make the communication via JSON and API calls, but it seems like that it's not a good solution for dynamic website.
So is there a frontend framework that works well with a Rails API and which is easily maintainable and upgradable (add feature/extension to it like gems)?
Thanks for your insights.
A friend of mine wrote this great article/tutorial on Rails as a backend API.
http://blog.launchacademy.com/the-basics-of-building-an-api-in-ruby-on-rails/
As well as this tutorial on Rails/Ember.js
https://github.com/diegodesouza/Project-Planner-EmberJS
You can get an idea of how it's done and implement your preferred front end framework.
Hope it sheds some light on this question.
I have a similar setup as one of the commenters on the question.
I'm using Rails mainly for just the project structure, to define some page layouts, and for ActiveRecord.
I then have my JSON APIs defined using the Grape API framework.
I have a SPA, written on AngularJS that lives in the public/ folder. It doubles as my mobile app, made possible by phonegap. If my Angular app didn't double as my mobile app, I could've possibly just used the asset pipeline to serve up the SPA. To compensate for that, I have a separate build task written in Grunt to minify/uglify my JS/CSS assets before I deploy them out to production.
I also use Comfortable Mexican Sofa for my static content pages.
It took some trial and error to get things right, but overall I find that this setup serves me pretty well.
I am fairly new to web application development and I have a pretty noob question. As I understand, it is possible to write the backend of a web application - models, business logic, etc. using Rails and write the backend - the view - using just HTML, CSS Javascript (without using Rail's form helpers, embedded ruby, etc.) and that the said view would render data exposing a Rails API and making AJAX requests to it. Everytime I googled "rails ajax requests API" I have only found tutorials that explain how to use AJAX w/ embedded ruby instead of tutorials that clearly separate how to make a Rails API and make AJAX requests to render data. So my questions are:
1) If any of the above statements are incorrect, could you let me know?
2) Can someone point me to tutorials that help me understand the theory and implementation of the aforementioned topics?
Thanks!
The REST API generated by Rails can be consume by any client, if you want to use pure HTML and CSS withouth the .erb files (for me brings many advantages when developing) you can access to the Rails API data by AJAX.
I let you the following tutorial:
http://blog.project-sierra.de/archives/1788
Hope it helps
I need some guidance to figure out how to incorporate Angular inside rails.
Reason for choosing Rails : I like their opionated approach to do things right. Also migrations, gems are really cool.
Reason for angular : I was researching and looking for framework best suited for SPA. Backbone seem too abstract. I had choice to make between Angular & Ember. I started reading Angular first and it made sense to me. So i never went to read about ember.
Reason for Angular & Rails: I researched and tried using small scale framework like grape, slim ( Yes i use php too ). But i feel need to stick to rails for long term scope of project. And personally i like doing things rails way.
So here is where i need help,
I have rails project in Rails 4.
Sign-in , sign-up everything is created as followed in Michael Hartl tutorial. Have tweaked stuff based on my requirement.
So post-sign-in or post-sign-up steps a view from show action of users controller is rendered.
I figured i'll need different layout files so i created same for outer pages and inner pages, respectively.
I don't know how to proceed i want to make use of the angular templates and routes for my single page app ( which resides post sign-in ). I am flexible if there is another way. I just need a guide how to use angular seemlessly with rails making use of rails controller to handle my rest request and using routing provided by angular to navigate around in SPA.
Hope i am clear. Feel free to edit this.
here is a great railscasts from ryan bates: http://railscasts.com/episodes/405-angularjs
also here is the source for that railscasts you can get ideas from there:
https://github.com/railscasts/405-angularjs
I'm not familiar with SPA, but I have been working on a tutorial for integrating rails and angularjs, which I'm refining over time. It may provide some answers here - in particular I am using the angular routing to provide a single-page app as you describe: http://technpol.wordpress.com/2013/09/03/angularjs-and-rails-tutorial-index/
I would suggest you to not mix angular into your rails app. Keep both of them separate.
So you could either place the whole of your angular app in the public folder of your rails app or keep it completely away from the rails app. This is more like a service oriented architecture, where your rails app serves as a back end serving as an api and the front end(Angular app) consuming that api.
There are many many nice articles the covers how to handle the authentication/authorization
in angularjs with REST APIs.Authentication with AngularJS and a Node.js REST api
Coming to the rails side for building REST API, Grape is a nice choice. Here is a nice series explaining some best practices about grape.
HTH!
I'd suggest taking a look at this tutorial: How to Wire Up Ruby on Rails and AngularJS as a Single-Page Application. I have used it for a few personal projects, so I am sure that it is up to date as of late 2014. If you want to view it in action you can head to http://goodmatches.herokuapp.com, and you can view the repo.
Try half-pipe gem which makes using bower for managing javascripts assets much easier.
I've been trying to figure out the best way to use Rails, Ember 1.0RC and jQuery mobile but with no success.
I'm building a simple single web app with Rails as a backend that provides simple JSON. Now I know that Ember and JQM don't like each other and you have to write custom helpers to render Ember views. This makes things quite complicated.
I know that there are a few examples out there but they are quite obsolete since Ember was under heavy development and there have been many changes.
I'd like to hear from experienced developers if it is a good idea or not to use Ember with JQM in my case?
Maybe I should go for other MVC framework (which one?)?
Sorry for the question being pretty open but I could not find any reliable resources on the web.
// edited on March 20
I've watched 2 Ember screencasts (from Peepscode and Railscasts) and they shed some light on the matter. Now I know a little bit more. But let me explain what I'm after.
I'm building an internal 'kudos' app based on the merits system. That is every Monday an employee receives 20 'kudos' to give other co-workers. The design is as follows:
the main page shows a list of all employees and at the top, also as an list item, there is position that belongs to himself. It shows for example how many kudos to give left and how many he or she received from others. The owner? do not know how many kudos other employees received. But I think there'll be a 'Top 3 kudoers' page.
When you tap/hold an item, a modal dialog will appear that will ask you if you what to give a kudo.
It is done. But what remained is porting it to Ember.
Now, after watching screencasts I kind of know what to do, but what buggs me is how to make JQM internal hash pages and Ember router a breeze.
I saw that one page app in Ember uses urls like these:
myapp/#/users/user
whereas JQM uses internal pages like this:
myapp/#somepage
I'd like to keep the app as simple as possible (following Ember 'convention over configuration') and make use of JQM internal pages.
So my question is how can they both go with each other?
I'd like to hear from experienced developers if it is a good idea or not to use Ember with JQM in my case?
I've been asking around about this and pretty much everyone who has tried to use JQuery Mobile with ember has advised against it.
Not that it can't be done. It's just that most people have determined the challenges outweigh the benefits. Especially if you are new to one or both frameworks.
The best example of JQM + Ember integration i've seen is by TOMASZ and can be found here: https://coderwall.com/p/ylogzg
Thing is, that app does not use ember router at all. For sure it won't help you make JQM internal hash pages and Ember router a breeze
My goal is to create a Rails based site that uses AJAX to fetch different sections. The site should never completely refresh. I'm using Rails 3.2.8.
There's a lot of conflicting articles online about how to actually implement this. It seems to me that simply fetching pages.json and using javascript would accomplish my goal, but is that the "rails" way?
Every page that is users will see is static. I'll be using Rails as an admin to CRUD them, but that's it, and that portion doesn't need to be AJAX.
Take a look at backbone.js. For an ajax heavy site, that's exactly what you need to help organize your code and keep your front end consistent with your database. Also, check out this excellent railscast on implementing backbone in a rails project.
I noticed that you said static site. Well, if the site is completely static, why bother with something like rails? I would suggest just coding it in html and javascript because rails is intended to be used for dynamic, database driven sites.