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.
Related
I'm about to start a new project and I am unsure if using AngularJS for my front end would be a good idea not. I've read about people saying this isn't the smartest way of doing a project. And even if I did, Is there a way to get AngularJS to interact with the controllers? This question may be redundant but I am actually curious of how to effectively do this without it being a waste of time.
I've never completely done it, but I believe the way to go is to build a Rails api and then have a separate Angular project use said api. The api could also be used to build a mobile app. I think the Angular project would still need to be served from a Node.js server in production, but I don't think that would be a big deal.
This is what I used to learn how to build a Rails api: http://apionrails.icalialabs.com/book/chapter_one
You can do it within an existing project and share the models from it.
There are several different approaches to accomplish that. I tried about 5 different guides out there, the best I found (and I finally sticked to) was https://thinkster.io/angular-rails - This guide should help you build a basic CRUD app with angular connected to rails.
You use Rails as an JSON RESTful API which responds to Ajax-Requests (Get, Post, Put, Delete). Angular will handle the frontend stuff - sending those Ajax requests to the routes/methods defined in your rails controllers. So yes, of course your AngularJS app can interact with your rails controllers.
This also helped me to understand the setup in the beginning: Instead of the Rails View, you will be using AngularJS as your view:
I really love using angular with rails, because setting up the JSON responses (especially with Active Model Serializer Gem) is very easy and quickly done. i deffinitely can recommend it, and I have not encountered any unsolvable problems - so far.
Just go trough this guide I linked and you will see if this setup fits your needs.
The short answer is that your Rails application will have to present some kind of a public API for your AngularJS application to consume. Angular (and it's brethren, like React and Ember) runs client-side, on the browser, and it needs "something" to make AJAX calls against. That "something", i.e. your backend, can be Firebase, Parse, AWS Lambdas, Rails API, etc. Since you already have a Rails application, it probably makes the most sense to add some RESTful API endpoints that use the existing models (and possibly controllers) to consume/produce JSON payloads from/for the client.
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.
Most of the resources/example about rails and angular on the internet just put them together. AngularJS goes inside of rails under app/assets. This feels reeeaaaly dirty to me. Is it a good idea? What if we decide at some time we won't be using rails and we move to, I don't know, sinatra? How hard would it be to port?
What would be pros/cons of everthing in a single rails app and what would be pros/cons for two seperated apps?
Thank you!
Even when placing Angular (or any other client-side MV* framework) inside your Rails app, you are pretty much keeping the separation of concerns intact. That is, you have a Rails API serving JSON (or similar) data, and a separate Javascript framework using that data to render appropriate views. If you ever wanted to use a different server-side API, you can do so, and still utilize your entire Javascript directory as is.
Placing the client side framework in Rails is simply a matter of convenience. It comes with an organized directory structure and the ability to serve your HTML, which is essentially all you're using it for when it comes to your views. But again, these views aren't really tied to Rails, as they're just HTML and Javascript, so you can easily move them to a different platform when necessary.
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
I mean, the mvc for cairngorm and the one in rails don't overlap their functionalities? I'm not sure I understand the need for cairngorm with the rails backend..
There is no need, it's an option, Cairgorm see's the whole Rails as a model. Rails send xml instead of html so no browser-css-details headaches.
You can use rails as a REST layer and put your business logic in flex.
You can use cairgorm as a candy cover over a complex but well tested rails application.
You can find middle of the way solution that suits to you.
We do implement most business logic in rails but use flex/cairgorm to show each user only the right buttons/forms/controls to her task, and to do it in a nice browser-independent way.
Hope this helps you, feel free to ask any detail
Rails is MVC for the server. You still need an architecture for a sufficiently complex client application. We're using PureMVC on the client with a REST (JSON) interface to a Rails server and it's working nicely. PureMVC allows for the client's model to be independent from the client's view components, and makes it easy to update independent view components simultaneously.