Skip to content

Integration of React + Webpack + Rails + rails/webpacker including server-side rendering of React, enabling a better developer experience and faster client performance.

License

Notifications You must be signed in to change notification settings

frullah/react_on_rails

This branch is 117 commits behind shakacode/react_on_rails:master.

Folders and files

NameName
Last commit message
Last commit date
Jan 21, 2023
Mar 8, 2023
Apr 21, 2018
Mar 15, 2023
Feb 24, 2023
Dec 30, 2022
Feb 7, 2022
Jan 27, 2016
Feb 24, 2023
Feb 18, 2017
Sep 15, 2015
Oct 17, 2015
Apr 30, 2020
Dec 23, 2020
Dec 30, 2021
Jan 25, 2016
Dec 30, 2021
Dec 23, 2020
Aug 20, 2015
Jan 9, 2023
Oct 19, 2015
Aug 25, 2020
Mar 15, 2023
Dec 23, 2020
Jan 23, 2018
Nov 14, 2020
Feb 20, 2023
Sep 27, 2018
Jun 25, 2018
Feb 9, 2022
Apr 27, 2018
Nov 6, 2021
Jan 9, 2023
May 11, 2021
Oct 15, 2021
Mar 28, 2020
Jan 23, 2018
Mar 28, 2020
May 7, 2020
Feb 24, 2023
Jan 29, 2023
Mar 28, 2020
Apr 27, 2020
Jan 29, 2023

Repository files navigation

reactrails


LicenseGem Version npm version Code Climate Coverage Status

Build Main Build JS Tests Build Rspec Tests Linting

News

  • ShakaCode now maintains the official successor to rails/webpacker, shakapacker.
  • Project is updated to support Rails 7 and Shakapacker v6+!

These are the docs for React on Rails 13. To see the older docs: v12 and v11.

About

React on Rails integrates Rails with (server rendering of) Facebook's React front-end framework.

This project is maintained by the software consulting firm ShakaCode. We focus on Ruby on Rails applications with React front-ends, often using TypeScript or ReScript (ReasonML). We also build React Native apps and Gatsby sites. See our recent work for examples of what we do. ShakaCode.com (HiChee.com) is hiring developers that like working on open-source.

Are you interested in optimizing your webpack setup for React on Rails including code splitting with react-router and loadable-components with server-side rendering for SEO and hot-reloading for developers? We did this for Popmenu, lowering Heroku costs 20-25% while getting a 73% decrease in average response times. Several years later, Popmenu is serving millions of SSR requests per day with React on Rails.

Check out React on Rails Pro. For more information, feel free to contact Justin Gordon, [email protected], maintainer of React on Rails.

Documentation

See the documentation at shakacode.com/react-on-rails/docs.

Project Objective

To provide a high performance framework for integrating Ruby on Rails with React via the Webpacker gem, especially regarding React Server-Side Rendering for better SEO and improved performance.

Features and Why React on Rails?

Given that rails/webpacker gem already provides basic React integration, why would you use "React on Rails"?

  1. Automatic configuration of what bundles are added to the page based on what React components are on the page. This results in faster browser loading time via smaller bundle sizes.
  2. Keep up with the latest changes of different versions of React. React 18 is supported.
  3. Easy passing of props directly from your Rails view to your React components rather than having your Rails view load and then make a separate request to your API. Tight integration with shakapacker (or it's predecessor rails/webpacker).
  4. Server-Side Rendering (SSR), often used for SEO crawler indexing and UX performance.
  5. Automated optimized entry-point creation and bundle inclusion when placing a component on a page. With this feature, you no longer need to configure javascript_pack_tags and stylesheet_pack_tags on your layouts based on what’s shown. “It just works!”
  6. Redux and React Router integration with server-side-rendering.
  7. Internationalization (I18n) and (localization)
  8. A supportive community. This web search shows how live public sites are using React on Rails.
  9. ReScript Support.

See Rails/Webpacker React Integration Options for comparisons to other gems.

Online demo

ShakaCode Forum Premium Content

Requires creating a free account.

Prerequisites

Ruby on Rails >=5, rails/webpacker >= 4.2 or shakapacker > 6, Ruby >= 2.7

Support

Contributing

Bug reports and pull requests are welcome. See Contributing to get started, and the list of help wanted issues.

Work with Us

ShakaCode is hiring passionate software engineers to work on our projects, including HiChee!

License

The gem is available as open source under the terms of the MIT License.

Supporters

The following companies support our open source projects, and ShakaCode uses their products!



JetBrains ScoutAPM
BrowserStack Rails Autoscale Honeybadger

About

Integration of React + Webpack + Rails + rails/webpacker including server-side rendering of React, enabling a better developer experience and faster client performance.

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • Ruby 66.8%
  • JavaScript 14.0%
  • HTML 9.4%
  • TypeScript 8.4%
  • Shell 0.6%
  • SCSS 0.6%
  • Other 0.2%