Overview

The Rails React Boilerplate is a pure Ruby on Rails / React / Webpack 4 boilerplate application. It features the latest versions of Ruby on Rails, React, Webpack, and Babel, with support for ESLint, Prettier, SASS, StyleLint, and hashed filenames for production assets. It allows for separate app and vendor JS bundles and is compatible with Postgres. The use of Webpack as a module bundler enables the app to take advantage of the vast NPM ecosystem and allows for customization to meet any application requirement. The boilerplate also provides an easy migration path to a different backend, such as NodeJS, as it is not dependent on the Asset Pipeline or any specific framework module.

Features

• Ruby on Rails 6.x
• React 16.x
• Webpack 4.x
• Babel 7.x
• ESLint support
• Prettier support
• SASS and StyleLint support
• Hashed filenames for production assets
• Separate app and vendor JS bundles
• Postgres compatibility
• Use of Rails default gems and NPM packages only
• Easy migration to a different backend

Installation

To install the Rails React Boilerplate, it is recommended to have Ruby 2.7.1 and NodeJS 12.x installed on your system.

To build the assets for development mode, run the following command:

npm run webpack

To build the assets for development mode and automatically rebuild on every detected change, use the following command:

npm run webpack:watch

To build the assets for production mode, with output files hashed, use the following command:

npm run webpack:production

To load assets in production from a custom root directory or URL, override the Rails.application.config.assets.root_path property in the production environment.

If you want to run the app in a Docker container, the repository includes a basic Dockerfile for running the app in production mode. However, prior to running in Docker, make sure to compile the assets using Webpack outside of the container.

Summary

The Rails React Boilerplate is a powerful boilerplate application that combines the capabilities of Ruby on Rails, React, and Webpack. It provides a comprehensive set of features to streamline the development process and enable easy customization. With its compatibility with Postgres and support for popular frontend tools and libraries, this boilerplate is a great starting point for building modern web applications.