/react-rails-api

All-in-one application generator enabling the integration of a React front-end and a Ruby-on-Rails API back-end with ActiveAdmin CMS.

Primary LanguageRubyMIT LicenseMIT

Ruby Version Gem License

React-Rails API

All-in-one application generator enabling the integration of a React front-end and a Ruby-on-Rails API back-end with a CMS via ActiveAdmin.

Image courtesy of Heroku.

This is an easy-to-use generator to implement the modern web application stack described here by Heroku designer Charlie Gleason.

Requirements

  • Ruby ~> 2.5
  • Rails ~> 5.2
  • Node ^11: Recommend installing this with NVM.
  • Yarn ^1.13: Recommend installing Node separately from this, rather than as a dependency.

Installation

$ gem install react-rails-api

Usage

$ react-rails
Usage:
  react-rails new [PATH]

Options:
  [--database], [--no-database]  # Integrate ActiveRecord (and Postgres).
                                 # Default: true

Initialise a React/Rails API application.

Creating an application

$ react-rails new demo-app

If the --database flag is set to true (which is the default), a prompt will also ask if you'd like to integrate ActiveAdmin into the application.

If you would not like to integrate ActiveRecord (and a Postgres database), make sure to use the --no-database flag:

$ react-rails new demo-app --no-database

Running an application

There are two rake tasks that allow you to run development and production builds of an application (using Foreman):

  • start:development - Starts a development build of the application (running Procfile.dev).
  • start:production - Starts a production build of the application (running Procfile).

Troubleshooting and common errors

  • Error when precompiling assets on Heroku (failed to load command: webpack)

    This is often as a result of the auto-detected Ruby and Node.js buildpacks being ran in the wrong order.

    This can be fixed by running the following commands in the application's directory:

    $ heroku buildpacks:add heroku/nodejs -i 1
$ heroku buildpacks:add heroku/ruby -i 2

    This ensures that webpack is installed before trying to precompile the assets.

More information

For more information about how to use this stack, please read the following blog posts by Charlie Gleason: