React on Rails Tutorial

A cleaner way to explore Rails, React, and server rendering together.

Start with the live demo, then branch into the React on Rails gem and Shakapacker gem integration patterns without digging through a wall of docs first.

More routes and docs

This Demo Covers

  • Server rendering and hydration.
  • React Router transitions and redirects.
  • Live comments over Action Cable.

Review Apps

Three commands, one preview environment.

Use control-plane-flow to deploy, inspect, or remove a PR preview without leaving the thread.

Why this workflow matters

The review-app flow turns deployment into a lightweight PR action instead of a separate setup task.

Quick Review App Commands

/deploy-review-app

Deploy your PR branch for testing.

/delete-review-app

Remove the review app when done.

/help

Show detailed instructions, environment setup, and configuration options.

SSR + hydration Action Cable updates Review app commands Multiple Rails + React paths

Live Playground

The main demo is already running below.

Stay on this page, or jump straight to the plain Rails and React variants.

React Router Demo

The same comments app, with routing.

Use the pills to view the comments route, a plain routed screen, and a redirect back to root.

What this demo proves
  • Server render first, then hydrate on the client.
  • Keep routing and comments in the same Redux-backed flow.
  • Verify redirects still resolve cleanly after SSR.