React is js Library created by Facebook to support Dynamic UI. It glue easily with Rails and can easily substitute Rails view.
I have explained porting Rails view to React view in this post .
React gem is available which make its integration with Rails a breeze. lets setup React to work with Rails .
CONFIGURING REACT WITH RAILS :
Add below to your Gemfile
Run the bundler command from terminal on your project root :
$ bundle install
Initialize react with below command
Below command will provide default setup for React in your rails App
$ rails g react:install
Running via Spring preloader in process 19546
So below three line will be added to the application.js
//= require react
//= require react_ujs
//= require components
These line will be added to the bottom of your application.js file. I suggest to move the first two line toward top just below the jquery files and keep the last line i,e components towards end of the file. The reason is that, you want react js to be called before you do any DOM manipulation. Keeping components js at bottom ensure that you can call a function defined earlier by you in React component.
//= require jquery //= require jquery_ujs //= require jquery-ui //= require react //= require react_ujs ... other js file Iam using ... // keep react component js at bootom as // you may need other defined function in it //= require components // put other js file above react components
Now configure React Add-ons in your application. The Add-ons have many helper which help you in writing React code.
If you look at component.js file it has below content :
//= require_tree ./components
So it basically call require_tree on components folder, thus any js file you create within this folder automatically get loaded.
Add below line to application.rb file
config.react.addons = true
This enable Reacts addons which provide a number of useful helper method listed here .
With this you are ready to start with react. While working with React you need to write a lot of JS code, So I suggest to start using Coffee Script.
Even you can try it online here and use this editor to convert your existing js code to Coffee script .