Backbone JS and Rails: Trial Run - ruby-on-rails

I am completely new to Backbone.js (have only studied the documentation) and was wondering if it's possible to test its functionality with maybe a Controller or two in a Rails app? I have some functionality I would love to build into my existing application that could highly benefit from backbone, but I am just wanting to "test the waters" with Backbone in my application.

I don't have much experience with Rails, but that would definitely be possible. The best way to play around with Backbone for a small piece would be to add a new Backbone view to your app. Leave an element in your app that you can tack on a Backbone View with and play around with.

Related

What would be the best way to use AngularJS with Ruby on Rails?

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.

What does my elancer mean when he says this?

What does it mean if my web designer says this," I built custom site with RoR and rails NodeJs angularJs ember backbone fullstack meteor"?
I wanted him to edit an HTML5 template and after some back and forth that was his response. What do those things mean?
Those are different programming/scripting languages that he has built websites/apps in... I find it interesting that after telling you about all the JavaScript he has played with he didn't quite say he had the HTML5 experience you are needing. If you can't understand him now you probably wont have any better luck if you hire him to edit the template. You need to find someone you can communicate with efficiently.

Integrating rails & angularjs

I tried Angular, and I liked it. I've began to integrate him into my rails-app, but then appeared some doubts about architecture
Routes. I would like to navigate without refreshing the page, before i used Wiselinks gem, it's easy and cool - just install, patch link_to helper and done. But angular have his own router, and ui-router (which is cool). I want my app to be running at the browser like Opera Mini and IE, but ui-router doesn't have such callbacks as in wiselinks. I wouldn't create mobile site version - the design is adaptive yet. It means, I would use rails routing, but I want to AJAX page refreshing when it can be (progressive enchansement, yep). What do I do?
In many places, the content is rendered by Angular, i.e. a list of posts (by ajaxing json). That fast & cool on desktop, but again old browsers! I need to render it on server for them. Or I haven't?
I'm stuck. Thanks.
This would be best trip to angularjs + rails 4...
This post clear my doubts and now i m very clear about architecture, routes, controllers, model, etc..
http://www.honeybadger.io/blog/2013/12/11/beginners-guide-to-angular-js-rails
I hope this solves your DOUBTs
and to know further about angularjs visit
http://www.angularjs.org
It's not necessary that you have to use angular routing. You can use ng-controller directive to inject controllers in your view.
Angular in general is very fast. I have been using it even in mobile browsers, it works like a charm. True if do heavy $scope manipulation, things might get little slow.
Talking about old browser support, till IE8, you are pretty good, if you follow http://docs.angularjs.org/guide/ie as already mentioned by shaunhusain, but below that I am skeptical.
I wouldnt recommend using wiselinks alongside with angular. We have tried that in a production app and it took us a long time to make this work, there had been so many issues with undead scopes and other artifacts.
Therefore, we have ended up throwing out wiselinks and replacing it with a similar directive written in angular. This way its easier to avoid problems when destroying or compiling dom.

Intergrating Angular JS with rails

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.

Does it sense to use Ember 1.0RC1 with jQuery mobile in a single page web app?

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

Resources