Generator-rails-react NPM

generator-rails-react

Yeoman generator

Better Integration

Please look at generator-rails-react-webpack and generator-rails-react-browserify projects

Getting Started

To run this version of yeoman generator. First, make sure that you have already installed yeoman

$ npm install -g yo

To install generator-rails-react from npm, run:

$ npm install -g generator-rails-react

Usage for Rails 4.*

Firstly, create Ruby on Rails project with normal rails command, but skip it bundle:

$ rails new app-name --skip-bundle

Finally, initiate the generator:

$ cd app-name
$ yo rails-react

Answer 'Yes' to all 'Overwrite' actions. Then config the 'config/database.yml' if you use different database than sqlite3.

Other dependencies

SASS (gem install sass)
Compass (gem install compass)

Template

I define all the react components with suffix .js.jsx.coffee based on react-rails. For code fragments, I like the way of require.js controlling application by module rather than defining all js file in application.js

Assets compile

Compile your assets before deploying to production server

$ rake assets:precompile RAILS_ENV=production

Options

Name: mongoid (for mongodb)

add --skip-active-record option to your rails new app --skip-active-record command before selecting this option.

Task

Live reload

For using livereload utility, firstly, install guard. Then, use rack-livereload or install LiveReload Safari/Chrome extension

$ bundle exec guard # to run the guard server and enjoy coding

Testing

Working on

Subgenerators

This also supports for subgenerator for component as well. Make sure you link them in your main.js

$ yo rails-react:component "name" #replace the name with your module name

Structure

application/
  |- app/
  |  |- apis/
  |  |  |- v1/
  |  |  |  |- base.rb
  |  |  |  |- person_api.rb
  |  |  |- base.rb
  |  |- assets/
  |  |  |- images/
  |  |  |- javascripts/
  |  |  |  |- <codeModule>/
  |  |  |  |  |- codeModule.js.jsx.coffee
  |  |  |  |- application.js
  |  |  |  |- main.jsx.coffee # main file
  |  |  |- stylesheets/
  |  |  |  |- application.css
  |  |- controllers/
  |  |- helpers/
  |  |- mailers/
  |  |- models/
  |  |- views/
  |  |  |- application/
  |  |  |  |- index.html # default template for the application
  |  |  |- layouts/
  |  |  |  |- application.html.erb
  |- bin/
  |- config/
  |  |- initializers/
  |  |  |- bower_rails.rb # bower rails config
  |  |- requirejs.yml # requirejs config file
  |- db/
  |- lib/
  |- log/
  |- public/
  |- test/
  |- tmp/
  |- vendor/
  |  |- assets/
  |  |  |- bower_components/
  |  |  |  |- third libararies/
  |- |  |- bower.json
  |- Bowerfile # define all bower_components here
  |- config.ru
  |- Gemfile
  |- Gemfile.lock
  |- Guardfile # Guard file for livereload
  |- Rakefile
  |- README.rdoc