React + Rails No-Fluff Boilerplate
A boilerplate project for anyone interested in making a project that uses React and Rails.
Note! This boilerplate has no fluff! That means that there's nothing set up for you to do authentication stuff, there's no Redux stuff, and there's no React Router stuff.
The main important bit is that the React project has
proxy set to
localhost:3001 in the
package.json file. Take a look!
Hall of Fame
Here are some projects that have been built using this boilerplate.
Using the boilerplate
First, fork this boilerplate so you get your own copy of it. Once you have done that, you can clone your new repo to your machine, and get started.
You need TWO terminals for this.
In one terminal, run
bundle to install the dependencies. Run
bin/rake db:setup to create the databases (called rails_project_development by default). Run
bin/rails s to run the server.
In the other terminal,
npm install. Rename the
.env.example file to be called
.env. Then run
npm start and go to
localhost:3000 in your browser.
In the browser, you can click on the button and see the data get loaded.
If this doesn't work, please message me!
From here, you can start working on your project!
On the Rails side, you may make new
resources routes in your
routes.rb file, e.g. :
namespace :api do resources :dogs # to generate GET /api/dogs, POST /api/dogs, etc... end
Then you can make your various controllers, models, migrations, etc. as you need! The one funky thing is that instead of rendering an HTML view you'll be rendering JSON. You can return anything from a Rails controller as JSON like this. See the example in my "tests_controller".
On the React side, the important bit is that you make you make your AJAXy HTTP requests using something like
superagent. I've set this up to use
axios already. Check the React code to see an example request being made on-click to the Rails server! You can make your HTTP requests to
/api/anything/you/want, as long as the route exists on your Rails app.
NOTE: I recommend that you namespace all your routes under
api on the Rails side! Look at how I've done that in the
routes.rb file, and also how the
tests_controller is written as:
class Api::TestsController < ApplicationController
and it lives in the
api folder! Put all your controllers in there!
Deployment to Heroku
This boilerplate is almost all set up to deal with deploying to Heroku. If you have the Heroku CLI tools installed you can run
heroku create to create the Heroku project.
Then we must run two commands to tell Heroku to first build our React app, and then build the Rails app.
heroku buildpacks:add heroku/nodejs --index 1
heroku buildpacks:add heroku/ruby --index 2
Once you've done that, you can run
git push heroku master to deploy your project any time you want! Note, however, that deploying to Heroku can be a little slow since Heroku needs to build your React app. Just give it some time.
Once it's deployed, you can run the following commands to manage your app:
heroku run rake db:schema:loadto set up your database the first time
heroku run rake db:migratefor any additional migrations
heroku run rake db:seedfor seeds
heroku run rake db:rollbackto rollback a migration
There are other commands, but these are good to get you started!
To make your app work properly with React Router (if you end up using it) on Heroku, I've added a special route to the
routes.rb file (
get '*path' ... ).
Please contact me at
email@example.com if you have any questions or requests, or post an issue to this repo.
False information is nothing new. Propaganda, doctored content, and even outright made up stories have long existed within the realm of information sharing. However, over the past few years, the conception and distribution of the term 'fake news', combined with the rapid mass-sharing capabilities of social media, has given false information