Heroku Deployment
Most React on Rails Pro installations of the Node SSR Renderer will deploy the Rails and Renderer instances on the same server. This technique results in better performance since it avoids network latency.
Scroll down if you want to have different servers.
Deploying to the Same Server As Your App Server
Procfile
/Procfile
web: bin/runsvdir-dynoProcfile.web
/Procfile.web
puma: bundle exec puma -C config/puma.rb
renderer: bin/node-rendererbin/node-renderer
#!/bin/bash
cd client
yarn run node-rendererBe sure your script to run the node-renderer sets some port, like 3800 which is also set as the config.renderer_url for your Rails server.
node-renderer
Any task in client/package.json that starts the node-renderer
Modifying Precompile Task
Not necessary if you are using bundle caching as doing so will result in the below being done automatically.
To avoid the initial round trip to get a bundle on the renderer, you can do something like this to copy the file during precompile.
See lib/tasks/assets.rake for a couple tasks that you can use.
If you're using the default tmp/bundles subdirectory for the node-renderer, you don't need to set the
ENV value for RENDERER_BUNDLE_PATH. Otherwise, please set this ENV value so the files get copied
to the right place.
Then you can use the rake task: react_on_rails_pro:pre_stage_bundle_for_node_renderer.
You might do something like this:
Rake::Task["assets:precompile"]
.clear_prerequisites
.enhance([:environment, "react_on_rails:assets:compile_environment"])
.enhance do
Rake::Task["react_on_rails_pro:pre_stage_bundle_for_node_renderer"].invoke
endTroubleshooting
If you get this sort of error, then you're forgetting to configure the PORT on the node-renderer and setting the config.renderer_url on the Rails App.
bundler: failed to load command: puma (/app/vendor/bundle/ruby/2.6.0/bin/puma)
Errno::EADDRINUSE: Address already in use - bind(2) for "0.0.0.0" port 21752
/app/vendor/bundle/ruby/2.6.0/gems/puma-4.3.3/lib/puma/binder.rb:229:in `initialize'Separate Rails and Node Render Instances
Deploy Node renderer to Heroku
- Create your Heroku app with Node.js buildpack, say
renderer-test.herokuapp.com. - In your JS configuration file or
- If setting the port, ensure the port uses
process.env.PORTso it will use port number provided by Heroku environment. The default is to use the env value RENDERER_PORT if available. (TODO: Need to check on this) - Set password in your configuration to something like
process.env.RENDERER_PASSWORDand configure the corresponding ENV variable on your Heroku dyno so theconfig/initializers/react_on_rails_pro.rbuses this value.
- If setting the port, ensure the port uses
- Run deployment process (usually by pushing changes to Git repo associated with created Heroku app).
- Once deployment process is finished, renderer should start listening from something like
renderer-test.herokuapp.comhost.
Deploy react_on_rails application to Heroku
- Create your Heroku app for
react_on_rails. - Configure your app to communicate with renderer app you've created above. Put the following to your
initializers/react_on_rails_pro(assuming you have SSL certificate uploaded to your renderer Heroku app or you use Heroku wildcard certificate under*.herokuapp.com) and configure corresponding ENV variable for the render_url and/or password on your Heroku dyno. - Run deployment process (usually by pushing changes to Git repo associated with created Heroku app).
- Once deployment process is finished, all rendering requests form your
react_on_railsapp should be served by<your-heroku-app>.herokuapp.comapp via HTTPS.