ROR + React

rubyonrails-talk
1

I’m going to rebuild my rails app and maybe add react on the front end. I forget which version of rails I’m using, but I guess it would be best to start over with the latest.

Does anyone know of boilerplate or template that would include starting an app with the react & rails? (maybe some other useful gems as well)

Thanks,

Joe

2

I guess this is what I’m looking for?

https://github.com/reactjs/react-rails

3

You likely just want —webpack=react if using rails 5.1 or higher

4

Thanks.

Can I add react to my existing project or should I start over?

5

There are at least 4 different ways that I’m familiar with and tons of resources to help you execute the way that works best for you. Here’s the ones I’ve learned from researching:

  1. Approach 1 - CDN based inclusion in header
6

Another approach is simply to have two completely separate apps: A REACT JS app deployed on Express (google “Create React App on Express”) and a separate Rails app, deployed separate to separate servers (/dynos). (It’s two separate apps!)

It’s not a matter of “Can Rails serve up a React app via the asset pipeline (5.1/5.2) or webpack (6+)?” – of course it can – the answer is yes— but should you?

These days I build out two separate apps even (a React front-end and a Rails backend) even when starting from scratch and even knowing that webpack is default in Rails 6 and that Rails is perfectly capable of serving up the React front-end.

7

Here is an open source project on GitHub that combines React with Rails:

It takes a monorepo approach, with the front-end JS code next to the back-end Rails. To integrate, it simply has the JS build (uses Parcel) output the transpiled, bundled javascript into the Rails assets/javascripts directory. It names the output without a fingerprint, because Rails asset pipeline will add one.

The idea was to keep it as simple as it can possibly be and have it work cleanly. It doesn’t use the react-rails gem. It doesn’t use separate repositories or servers. All of these gymnastics for scale are aspirational. Few projects ever reach the point of scale, especially when bogged-down in the gymnastics.

8

Thanks.

I found a portfolio app that runs on react. Got it working locally, unfortunately can’t figure out how to publish it to heroku. ( I did follow a tutorial, most tutorials don’t seem to work…)

9

Is it an issue with the Heroku build failing? You may need to insert the heroku/nodejs buildpack infront of your heroku/ruby buildpack if it did not happen automatically. You can check by running heroku buildpacks, it should list something like 1. heroku/nodejs, 2. heroku/ruby.

10

I was able to publish the create-react-app my-**app ** → right below…

https://serene-island-96020.herokuapp.com

but I was wrapping my head around getting this portfolio up and running so I can add a few of my web projects online. (of course, I’d edited it a bit, lol)

https://github.com/merlin2049er/portfolio-redux-app