From 1eb3bc01b2a2cd07f1b76e31daf44c1ccd932106 Mon Sep 17 00:00:00 2001
From: Justin Gordon <justin.gordon@gmail.com>
Date: Thu, 8 Apr 2021 16:33:42 -1000
Subject: [PATCH 1/4] Many doc updates

1. Renamed basics to guides
2. Moved Rails/Webpacker React Integration Options to be inside of
   "guides"
---
 CHANGELOG.md                                  |  12 +-
 NEWS.md                                       |  12 +-
 README.md                                     | 320 +-------------
 SUMMARY.md                                    |  24 +-
 docs/additional-details/generator-details.md  |   2 +-
 docs/api/view-helpers-api.md                  |   2 +-
 .../client-vs-server-rendering.md             |   2 +-
 docs/{basics => guides}/configuration.md      |   0
 docs/{basics => guides}/deployment.md         |   0
 docs/guides/getting-started.md                | 183 ++++++++
 ...t-reloading-with-the-webpack-dev-server.md |   0
 .../how-react-on-rails-works.md               |   2 +-
 ...ally-server-render-based-on-device-type.md |  39 ++
 ...t-files-for-client-and-server-rendering.md |  98 +++++
 docs/{basics => guides}/i18n.md               |   0
 ...installation-into-an-existing-rails-app.md |   2 +-
 .../minitest-configuration.md                 |   0
 ...ils-webpacker-react-integration-options.md |   0
 .../react-server-rendering.md                 |   4 +-
 docs/guides/reat-on-rails-overview.md         |  30 ++
 .../render-functions-and-railscontext.md      |   0
 .../{basics => guides}/rspec-configuration.md |   4 +-
 docs/{basics => guides}/tutorial.md           |   6 +-
 .../upgrading-react-on-rails.md               |   2 +-
 .../webpack-configuration.md                  |   2 +-
 docs/home.md                                  | 391 +-----------------
 docs/misc/articles.md                         |   2 +-
 docs/rails/convert-rails-5-api-only-app.md    |   2 +-
 docs/react-on-rails-pro/react-on-rails-pro.md |  43 ++
 spec/dummy/README.md                          |   5 +-
 30 files changed, 465 insertions(+), 724 deletions(-)
 rename docs/{basics => guides}/client-vs-server-rendering.md (97%)
 rename docs/{basics => guides}/configuration.md (100%)
 rename docs/{basics => guides}/deployment.md (100%)
 create mode 100644 docs/guides/getting-started.md
 rename docs/{basics => guides}/hmr-and-hot-reloading-with-the-webpack-dev-server.md (100%)
 rename docs/{basics => guides}/how-react-on-rails-works.md (99%)
 create mode 100644 docs/guides/how-to-conditionally-server-render-based-on-device-type.md
 create mode 100644 docs/guides/how-to-use-different-files-for-client-and-server-rendering.md
 rename docs/{basics => guides}/i18n.md (100%)
 rename docs/{basics => guides}/installation-into-an-existing-rails-app.md (98%)
 rename docs/{basics => guides}/minitest-configuration.md (100%)
 rename docs/{ => guides}/rails-webpacker-react-integration-options.md (100%)
 rename docs/{basics => guides}/react-server-rendering.md (94%)
 create mode 100644 docs/guides/reat-on-rails-overview.md
 rename docs/{basics => guides}/render-functions-and-railscontext.md (100%)
 rename docs/{basics => guides}/rspec-configuration.md (97%)
 rename docs/{basics => guides}/tutorial.md (99%)
 rename docs/{basics => guides}/upgrading-react-on-rails.md (99%)
 rename docs/{basics => guides}/webpack-configuration.md (98%)
 create mode 100644 docs/react-on-rails-pro/react-on-rails-pro.md

diff --git a/CHANGELOG.md b/CHANGELOG.md
index aa393264d1..5b75cb689a 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,7 +1,7 @@
 # Change Log
 All notable changes to this project's source code will be documented in this file. Items under `Unreleased` is upcoming features that will be out in next version. NOTE: major versions of the npm module and the gem must be kept in sync.
 
-Migration instructions for the major updates can be found [here](docs/basics/upgrading-react-on-rails.md#upgrading-to-version-9.md). Some smaller migration information can be found here.
+Migration instructions for the major updates can be found [here](docs/guides/upgrading-react-on-rails.md#upgrading-to-version-9.md). Some smaller migration information can be found here.
 
 ## Need Help Migrating?
 If you would like help in migrating between React on Rails versions or help with implementing server rendering, please contact [justin@shakacode.com](mailto:justin@shakacode.com) for information about our [React on Rails Pro Support Options](https://www.shakacode.com/react-on-rails-pro).
@@ -32,7 +32,7 @@ Changes since last non-beta release.
 
 ### [12.1.0] - 2021-03-23
 #### Added
-- Added the ability to assign a module with a `call` method to `config.build_production_command`. See [the configuration docs](./docs/basics/configuration.md). [PR 1362: Accept custom module for config.build_production_command](https://github.com/shakacode/react_on_rails/pull/1362).
+- Added the ability to assign a module with a `call` method to `config.build_production_command`. See [the configuration docs](./docs/guides/configuration.md). [PR 1362: Accept custom module for config.build_production_command](https://github.com/shakacode/react_on_rails/pull/1362).
 
 #### Fixed
 - Stop setting NODE_ENV value during precompile, as it interferred with rails/webpacker's setting of NODE_ENV to production by default. Fixes [#1334](https://github.com/shakacode/react_on_rails/issues/1334). [PR 1356: Don't set NODE_ENV in assets.rake](https://github.com/shakacode/react_on_rails/pull/1356) by [alexrozanski](https://github.com/alexrozanski).
@@ -58,7 +58,7 @@ Changes since last non-beta release.
 - Changed invocation of webpacker:clean to use a very large number of versions so it does not acidentally delete the server-bundle.js. [PR 1306](https://github.com/shakacode/react_on_rails/pull/1306) by By [justin808](https://github.com/justin808).
 
 ### [12.0.0] - 2020-07-08
-For upgrade instructions, see [docs/basics/upgrading-react-on-rails.md](./docs/basics/upgrading-react-on-rails.md).
+For upgrade instructions, see [docs/basics/upgrading-react-on-rails.md](./docs/guides/upgrading-react-on-rails.md).
 
 #### Major Improvements
 1. **React Hooks Support** for top level components
@@ -74,8 +74,8 @@ set JavaScript property `renderFunction` on the function for which you want to r
 invoked to return the React component. In that case, you won't need to pass any unused params.
 [PR 1268](https://github.com/shakacode/react_on_rails/pull/1268) by [justin808](https://github.com/justin808)
 
-See [docs/basics/upgrading-react-on-rails](./docs/basics/upgrading-react-on-rails.md#upgrading-to-v12)
-for details.
+See [docs/basics/upgrading-react-on-rails](./docs/guides/upgrading-react-on-rails.md#upgrading-to-v12)
+for details.         
 
 #### Other Updates
 * `react_on_rails` fully supports `rails/webpacker`. The example test app in `spec/dummy` was recently converted over to use rails/webpacker v4+. It's a good example of how to leverage rails/webpacker's webpack configuration for server-side rendering.
@@ -343,7 +343,7 @@ Updated React on Rails to depend on [rails/webpacker](https://github.com/rails/w
 
 
 #### 9.0 from 8.x. Upgrade Instructions
-Moved to [our documentation](docs/basics/upgrading-react-on-rails.md#upgrading-to-version-9).
+Moved to [our documentation](docs/guides/upgrading-react-on-rails.md#upgrading-to-version-9).
 
 ### [8.0.7] - 2017-08-16
 #### Fixed
diff --git a/NEWS.md b/NEWS.md
index 6a41e01451..c4c79c999e 100644
--- a/NEWS.md
+++ b/NEWS.md
@@ -1,21 +1,27 @@
 # NEWS
 
-*We'll keep a history of the news. A few bullets at the top will also show on the [README.md](./README.md).*
+*A history of the news. A few bullets at the top will also show on the [README.md](./README.md).*
 
+* **October 14, 2020**: [RUBY ROGUES
+RR 474: React on Rails V12 – Don’t Shave That Yak! with Justin Gordon](https://devchat.tv/ruby-rogues/rr-474-react-on-rails-v12-dont-shave-that-yak-with-justin-gordon/).
+
+* **October 1, 2020**: See the [spec/dummy](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy) example repo for a simple configuration of webpack via the rails/webpacker gem
+that supports SSR.
+* **August 2, 2020**: See the example repo of [React on Rails Tutorial With SSR, HMR fast refresh, and TypeScript](https://github.com/shakacode/react_on_rails_tutorial_with_ssr_and_hmr_fast_refresh) for a new way to setup the creation of your SSR bundle with `rails/webpacker`.
 * July 8, 2020: Release **v12**.
   1. **React Hooks Support** for top level components
   2. **Typescript bindings**
   3. **rails/webpacker** "just works" with React on Rails by default.
   4. i18n support for generating a JSON file rather than a JS file.
 * 2018-02-27: **Version 10.1.2** Supports the React API for ReactDOM.hydrate.
-* 2017-09-06: **VERSION 9.0.0 shipped!** This version depends on Webpacker directly. See [Upgrading React on Rails](./docs/basics/upgrading-react-on-rails.md) for more concise instructions on upgrading.
+* 2017-09-06: **VERSION 9.0.0 shipped!** This version depends on Webpacker directly. See [Upgrading React on Rails](./docs/guides/upgrading-react-on-rails.md) for more concise instructions on upgrading.
 * Always see the [CHANGELOG.md](./CHANGELOG.md) for the latest project changes.
 * [VERSION 8.1.0](https://rubygems.org/gems/react_on_rails/) shipped with [webpacker_lite](https://github.com/shakacode/webpacker_lite) (soon [**webpacker**](https://github.com/rails/webpacker/issues/464#issuecomment-310986140) support! [react-webpack-rails-tutorial PR #395](https://github.com/shakacode/react-webpack-rails-tutorial/pull/395) shows the changes needed to migrate from the Asset Pipeline to Webpacker Lite. For more information, see my article: [Webpacker Lite: Why Fork Webpacker?](https://blog.shakacode.com/webpacker-lite-why-fork-webpacker-f0a7707fac92). Per recent discussions, we [will merge Webpacker Lite changes back into Webpacker](https://github.com/rails/webpacker/issues/464#issuecomment-310986140). There's no reason to wait for this. The upgrade will eventually be trivial.
 * 2017-04-25: 7.0.0 Shipped! Performance improvements! Please upgrade! Only "breaking" change is that you have to update both the node module and the Ruby gem. 
 * 2017-04-09: 8.0.0 beta work to include webpacker_lite gem has begun. See [#786](https://github.com/shakacode/react_on_rails/issues/786).
 * 2017-04-03: 6.9.3 Released! Props rendered in JSON script tag. Page size is smaller now due to less escaping!
 * 2017-03-06: Updated to Webpack v2!
-* 2017-03-02: Demo of internationalization (i18n) is live at [reactrails.com](https://www.reactrails.com/). Docs [here](docs/basics/i18n.md).
+* 2017-03-02: Demo of internationalization (i18n) is live at [reactrails.com](https://www.reactrails.com/). Docs [here](docs/guides/i18n.md).
 * 2017-02-28: See [discussions here on Webpacker](https://github.com/rails/webpacker/issues/139) regarding how Webpacker will allow React on Rails to avoid using the asset pipeline in the near future.
 * 2017-02-28: Upgrade to Webpack v2 or use the `--bail` option in your webpack script for test and production builds. See the discussion on [PR #730](https://github.com/shakacode/react_on_rails/pull/730).
 * 2016-11-03: Spoke at [LA Ruby: "React on Rails: Why, What, and How?"](http://www.meetup.com/laruby/events/234825187/). [Video and pictures in this article](https://blog.shakacode.com/my-react-on-rails-talk-at-the-la-ruby-rails-meetup-november-10-2016-eaaa83aff800#.ej6h4eglp).
diff --git a/README.md b/README.md
index d572f75469..d08a21a933 100644
--- a/README.md
+++ b/README.md
@@ -13,47 +13,21 @@
 
 *These are the docs for React on Rails 12. To see the version 11 docs, [click here](https://github.com/shakacode/react_on_rails/tree/11.3.0).*
 
-#### News
-**October 14, 2020**: [RUBY ROGUES
-RR 474: React on Rails V12 – Don’t Shave That Yak! with Justin Gordon](https://devchat.tv/ruby-rogues/rr-474-react-on-rails-v12-dont-shave-that-yak-with-justin-gordon/).
-
-**October 1, 2020**: See the [spec/dummy](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy) example repo for a simple configuration of webpack via the rails/webpacker gem
-that supports SSR.
-
-**August 2, 2020**: See the example repo of [React on Rails Tutorial With SSR, HMR fast refresh, and TypeScript](https://github.com/shakacode/react_on_rails_tutorial_with_ssr_and_hmr_fast_refresh) for a new way to setup the creation of your SSR bundle with `rails/webpacker`.
-
-**July 8, 2020**: Release v12 of React on Rails.
-
-**Major Improvements**
-
-1. **React Hooks Support** for top level components
-2. **Typescript bindings**
-3. **rails/webpacker** "just works" with React on Rails by default.
-4. i18n support for generating a JSON file rather than a JS file.
-
-Be sure to see the [CHANGELOG.md](https://github.com/shakacode/react_on_rails/tree/master/CHANGELOG.md) and read the upgrade instructions:
-[docs/basics/upgrading-react-on-rails](https://www.shakacode.com/react-on-rails/docs/basics/upgrading-react-on-rails#upgrading-to-v12).
-
-* See Justin's RailsConf talk: [Webpacker, It-Just-Works, But How?](http://railsconf.com/2020/video/justin-gordon-webpacker-it-just-works-but-how).
-* Are you interested in support for React on Rails? Do you want to use Node.js to do your server-side rendering so libraries like Emotion and Loadable Components just work, as compared to rendering via Ruby embedded JS? If so check out [React on Rails Pro](https://www.shakacode.com/react-on-rails-pro).
-* HMR is working with [Loadable Components](https://loadable-components.com) for a both amazing hot-reloading developer experience and great runtime performance. Please [email me](mailto:justin@shakacode.com) if you'd like to use [Loadable Components Code Splitting](https://loadable-components.com/docs/code-splitting/) to speed up your app by reducing your bundle sizes and lazily loading the code that's needed.
----
-
 #### About
 React on Rails integrates Rails with (server rendering of) Facebook's [React](https://github.com/facebook/react) front-end framework.
 
-This project is maintained by the software consulting firm [ShakaCode](https://www.shakacode.com). We focus on Ruby on Rails applications with React front-ends, often using TypeScript or ReasonML. We also build Gatsby sites. See [our recent work](https://www.shakacode.com/recent-work) for examples of what we do.
+This project is maintained by the software consulting firm [ShakaCode](https://www.shakacode.com). 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](https://www.shakacode.com/recent-work) for examples of what we do. ShakaCode.com (HiChee.com) is [hiring developers that like working on open-source](https://www.shakacode.com/career/).
 
 Interested in optimizing your webpack setup for React on Rails including code
-splitting with [react-router](https://github.com/ReactTraining/react-router#readme),
-and [loadable-components](https://loadable-components.com/) with server-side rendering?
-We just did this for Popmenu, [lowering Heroku costs 20-25% while getting a 73% decrease in average response times](https://www.shakacode.com/recent-work/popmenu/).
+splitting with [react-router](https://github.com/ReactTraining/react-router#readme) and
+and [loadable-components](https://loadable-components.com/) 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](https://www.shakacode.com/recent-work/popmenu/). Check out [React on Rails Pro](https://www.shakacode.com/react-on-rails-pro/).
 
 Feel free to contact Justin Gordon, [justin@shakacode.com](mailto:justin@shakacode.com), maintainer of React on Rails, for more information.
 
-[Click to join **React + Rails Slack**](https://reactrails.slack.com/join/shared_invite/enQtNjY3NTczMjczNzYxLTlmYjdiZmY3MTVlMzU2YWE0OWM0MzNiZDI0MzdkZGFiZTFkYTFkOGVjODBmOWEyYWQ3MzA2NGE1YWJjNmVlMGE).
+# Documentation
 
-# Intro
+See the documentation at [shakacode.com/react-on-rails/docs](https://www.shakacode.com/react-on-rails/docs/).
 
 ## Project Objective
 
@@ -71,7 +45,7 @@ Given that `rails/webpacker` gem already provides basic React integration, why w
 1. A supportive community. This [web search shows how live public sites are using React on Rails](https://publicwww.com/websites/%22react-on-rails%22++-undeveloped.com+depth%3Aall/).
 1. [Reason ML Support](https://github.com/shakacode/reason-react-on-rails-example).
 
-See [Rails/Webpacker React Integration Options](./docs/rails-webpacker-react-integration-options.md) for comparisons to other gems.
+See [Rails/Webpacker React Integration Options](docs/guides/rails-webpacker-react-integration-options.md) for comparisons to other gems.
 
 See the [react-webpack-rails-tutorial](https://github.com/shakacode/react-webpack-rails-tutorial) for an example of a live implementation and code.
 
@@ -81,228 +55,18 @@ _Requires creating a free account._
 * [How to use different versions of a file for client and server rendering](https://forum.shakacode.com/t/how-to-use-different-versions-of-a-file-for-client-and-server-rendering/1352)
 * [How to conditionally render server side based on the device type](https://forum.shakacode.com/t/how-to-conditionally-render-server-side-based-on-the-device-type/1473)
 
-----
-
-# Docs
-
-**Consider browsing this on our [website](https://www.shakacode.com/react-on-rails/docs/).**
 
 ## Prerequisites
 
 Ruby on Rails >=5 and rails/webpacker 4.2+.
 
-## Getting Started
-
-Note, the best way to understand how to use ReactOnRails is to study a few simple examples. You can do a quick demo setup, either on your existing app or on a new Rails app.
-
-1. Do the quick [tutorial](https://www.shakacode.com/react-on-rails/docs/basics/tutorial).
-2. Add React on Rails to an existing Rails app per [the instructions](https://www.shakacode.com/react-on-rails/docs/basics/installation-into-an-existing-rails-app).
-3. Look at [spec/dummy](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy), a simple, no DB example.
-3. Look at [github.com/shakacode/react-webpack-rails-tutorial](https://github.com/shakacode/react-webpack-rails-tutorial); it's a full-featured example live at [www.reactrails.com](http://www.reactrails.com).
-
-## Basic Installation
-
-*See also [the instructions for installing into an existing Rails app](https://www.shakacode.com/react-on-rails/docs/basics/installation-into-an-existing-rails-app).*
-
-2. Add the `react_on_rails` gem to Gemfile:
-
-   ```bash
-   bundle add react_on_rails --strict
-   ```
-
-4. Commit this to git (or else you cannot run the generator unless you pass the option `--ignore-warnings`).
-
-5. Run the generator:
-
-   ```bash
-   rails generate react_on_rails:install
-   ```
-
-6. Start the app:
-
-   ```bash
-   rails s
-   ```
-
-7. Visit http://localhost:3000/hello_world.
-
-
-### Turning on server rendering
-
-With the code from running the React on Rails generator above:
-
-1. Edit `app/views/hello_world/index.html.erb` and set `prerender` to `true`.
-2. Refresh the page.
-
-Below is the line where you turn server rendering on by setting `prerender` to true:
-
-```erb
-<%= react_component("HelloWorld", props: @hello_world_props, prerender: false) %>
-```
-
-Note, if you got an error in your console regarding "ReferenceError: window is not defined",
-then you need to edit `config/webpacker.yml` and set `hmr: false` and `inline: false`.
-See [rails/webpacker PR 2644](https://github.com/rails/webpacker/pull/2644) for a fix for this
-issue.
-
-## Basic Usage
-
-### Configuration
-
-* Configure `config/initializers/react_on_rails.rb`. You can adjust some necessary settings and defaults. See file [docs/basics/configuration.md](https://www.shakacode.com/react-on-rails/docs/basics/configuration) for documentation of all configuration options.
-* Configure `config/webpacker.yml`. If you used the generator and the default webpacker setup, you don't need to touch this file. If you are customizing your setup, then consult the [spec/dummy/config/webpacker.yml](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy/config/webpacker.yml) example or the official default [webpacker.yml](https://github.com/rails/webpacker/blob/master/lib/install/config/webpacker.yml).
-  * Tip: set `compile: false` for development if you know that you'll always be compiling with a watch process. Otherwise, every request will check if compilation is needed.
-  * Your `public_output_path` must match your custom Webpack configuration for `output` of your bundles.
-  * Only set `cache_manifest` to `true` in your production env.
-
-## Including your React Component on your Rails Views
-
-- React component are rendered via your Rails Views. Here's an ERB sample:
-
-  ```erb
-  <%= react_component("HelloWorld", props: @some_props) %>
-  ```
-
-- **Server-Side Rendering**: Your react component is first rendered into HTML on the server. Use the **prerender** option:
-
-  ```erb
-  <%= react_component("HelloWorld", props: @some_props, prerender: true) %>
-  ```
-
-- The `component_name` parameter is a string matching the name you used to expose your React component globally. So, in the above examples, if you had a React component named "HelloWorld", you would register it with the following lines:
-
-  ```js
-  import ReactOnRails from 'react-on-rails';
-  import HelloWorld from './HelloWorld';
-  ReactOnRails.register({ HelloWorld });
-  ```
-
-  Exposing your component in this way is how React on Rails is able to reference your component from a Rails view. You can expose as many components as you like, as long as their names do not collide. See below for the details of how you expose your components via the react_on_rails webpack configuration. You may call `ReactOnRails.register` many times.
-
-- `@some_props` can be either a hash or JSON string. This is an optional argument assuming you do not need to pass any options (if you want to pass options, such as `prerender: true`, but you do not want to pass any properties, simply pass an empty hash `{}`). This will make the data available in your component:
-
-  ```ruby
-    # Rails View
-    <%= react_component("HelloWorld", props: { name: "Stranger" }) %>
-  ```
-
-- This is what your HelloWorld.js file might contain. The railsContext is always available for any parameters that you _always_ want available for your React components. It has _nothing_ to do with the concept of the [React Context](https://reactjs.org/docs/context.html). See [Render-Functions and the RailsContext](https://www.shakacode.com/react-on-rails/docs/basics/render-functions-and-railscontext) for more details on this topic.
-
-  ```js
-  import React from 'react';
-
-  export default (props, railsContext) => {
-    // Note wrap in a function to make this a React function component
-    return () => (
-      <div>
-        Your locale is {railsContext.i18nLocale}.<br/>
-        Hello, {props.name}!
-      </div>
-    );
-  };
-  ```
-
-See the [View Helpers API](https://www.shakacode.com/react-on-rails/docs/api/view-helpers-api) for more details on `react_component` and its sibling function `react_component_hash`.
-
-## Globally Exposing Your React Components
-
-For the React on Rails view helper `react_component` to use your React components, you will have to **register** them in your JavaScript code.
-
-Use modules just as you would when using Webpack and React without Rails. The difference is that instead of mounting React components directly to an element using `React.render`, you **register your components to ReactOnRails and then mount them with helpers inside of your Rails views**.
-
-This is how to expose a component to the `react_component` view helper.
-
-```javascript
-  // app/javascript/packs/hello-world-bundle.js
-  import HelloWorld from '../components/HelloWorld';
-  import ReactOnRails from 'react-on-rails';
-  ReactOnRails.register({ HelloWorld });
-```
-
-#### Different Server-Side Rendering Code (and a Server-Specific Bundle)
-
-You may want different code for your server-rendered components running server side versus client side. For example, if you have an animation that runs when a component is displayed, you might need to turn that off when server rendering. One way to handle this is conditional code like `if (window) { doClientOnlyCode() }`.
-
-Another way is to use a separate webpack configuration file that can use a different server side entry file, like  'serverRegistration.js' as opposed to 'clientRegistration.js.' That would set up different code for server rendering.
-
-For details on techniques to use different code for client and server rendering, see: [How to use different versions of a file for client and server rendering](https://forum.shakacode.com/t/how-to-use-different-versions-of-a-file-for-client-and-server-rendering/1352). (_Requires creating a free account._)
-
-## Specifying Your React Components: Register directly or use render-functions
-
-You have two ways to specify your React components. You can either register the React component (either function or class component) directly, or you can create a function that returns a React component, which we using the name of a "render-function". Creating a render-function allows:
-
-1. You to have access to the `railsContext`. See [documentation for the railsContext](https://www.shakacode.com/react-on-rails/docs/basics/render-functions-and-railscontext) in terms of why you might need it. You **need** a Render-Function to access the `railsContext`.
-2. You can use the passed-in props to initialize a redux store or set up react-router.
-3. You can return different components depending on what's in the props.
-
-Note, the return value of a **Render-Function** should be either a React Function or Class Component, or an object representing server rendering results.
-
-Do not return a React Element (JSX).
-
-ReactOnRails will automatically detect a registered Render-Function by the fact that the function takes
-more than 1 parameter. In other words, if you want the ability to provide a function that returns the
-React component, then you need to specify at least a second parameter. This is the `railsContext`.
-If you're not using this parameter, declare your function with the unused param:
-
-```js
-const MyComponentGenerator = (props, _railsContext) => {
-  if (props.print) {
-    // This is a React FunctionComponent because it is wrapped in a function.
-    return () => <H1>{JSON.stringify(props)}</H1>;
-  }
-}
-```
-
-Thus, there is no difference between registering a React Function Component or class Component versus a "Render-Function." Just call `ReactOnRails.register`.
-
-## react_component_hash for Render-Functions
-
-Another reason to use a Render-Function is that sometimes in server rendering, specifically with React Router, you need to return the result of calling ReactDOMServer.renderToString(element). You can do this by returning an object with the following shape: { renderedHtml, redirectLocation, error }. Make sure you use this function with `react_component_hash`.
-
-For server rendering, if you wish to return multiple HTML strings from a Render-Function, you may return an Object from your Render-Function with a single top-level property of `renderedHtml`. Inside this Object, place a key called `componentHtml`, along with any other needed keys. An example scenario of this is when you are using side effects libraries like [React Helmet](https://github.com/nfl/react-helmet). Your Ruby code will get this Object as a Hash containing keys componentHtml and any other custom keys that you added:
-
-```js
-{ renderedHtml: { componentHtml, customKey1, customKey2} }
-```
-
-For details on using react_component_hash with react-helmet, see [our react-helmet documentation](https://www.shakacode.com/react-on-rails/docs/additional-reading/react-helmet).
-
-## Error Handling
-
-* All errors from ReactOnRails will be of type ReactOnRails::Error.
-* Prerendering (server rendering) errors get context information for HoneyBadger and Sentry for easier debugging.
-
-## I18n
-
-React on Rails provides an option for automatic conversions of Rails `*.yml` locale files into `*.json` or `*.js*.
-See the [How to add I18n](https://www.shakacode.com/react-on-rails/docs/basics/i18n) for a summary of adding I18n.
-
-## More Details
-
-Browse the links in the [Summary Table of Contents](https://github.com/shakacode/react_on_rails/tree/master/SUMMARY.md)
-
-Here are some highly recommended next articles to read:
-
-1. [How React on Rails Works](https://www.shakacode.com/react-on-rails/docs/basics/how-react-on-rails-works)
-1. [Webpack Configuration](https://www.shakacode.com/react-on-rails/docs/basics/webpack-configuration)
-1. [View Helpers API](https://www.shakacode.com/react-on-rails/docs/api/view-helpers-api)
-1. [Caching and Performance: React on Rails Pro](https://www.shakacode.com/react-on-rails-pro).
-1. [Deployment](https://www.shakacode.com/react-on-rails/docs/basics/deployment).
-
 # Support
 
-[Click to join **React + Rails Slack**](https://reactrails.slack.com/join/shared_invite/enQtNjY3NTczMjczNzYxLTlmYjdiZmY3MTVlMzU2YWE0OWM0MzNiZDI0MzdkZGFiZTFkYTFkOGVjODBmOWEyYWQ3MzA2NGE1YWJjNmVlMGE).
-
-## Community Resources
-
-Please [**click to subscribe**](https://app.mailerlite.com/webforms/landing/l1d9x5) to keep in touch with Justin Gordon and [ShakaCode](http://www.shakacode.com/). I intend to send announcements of new releases of React on Rails and of our latest [blog articles](https://blog.shakacode.com) and tutorials.
-
-[![2017-01-31_14-16-56](https://cloud.githubusercontent.com/assets/1118459/22490211/f7a70418-e7bf-11e6-9bef-b3ccd715dbf8.png)](https://app.mailerlite.com/webforms/landing/l1d9x5)
-
-- **Slack Room**: [Contact us](mailto:contact@shakacode.com) for an invite to the ShakaCode Slack room! Let us know if you want to contribute.
+* [Click to join **React + Rails Slack**](https://reactrails.slack.com/join/shared_invite/enQtNjY3NTczMjczNzYxLTlmYjdiZmY3MTVlMzU2YWE0OWM0MzNiZDI0MzdkZGFiZTFkYTFkOGVjODBmOWEyYWQ3MzA2NGE1YWJjNmVlMGE).
+- [**Subscribe**](https://app.mailerlite.com/webforms/landing/l1d9x5) for announcements of new releases of React on Rails and of our latest [blog articles](https://blog.shakacode.com) and tutorials.
 - **[forum.shakacode.com](https://forum.shakacode.com)**: Post your questions
 - **[@railsonmaui on Twitter](https://twitter.com/railsonmaui)**
-- For a live, [open source](https://github.com/shakacode/react-webpack-rails-tutorial), example of this gem, see [www.reactrails.com](http://www.reactrails.com).
+- *See [NEWS.md](https://github.com/shakacode/react_on_rails/tree/master/NEWS.md) for more notes over time.*
 - See [Projects](https://github.com/shakacode/react_on_rails/tree/master/PROJECTS.md) using and [KUDOS](https://github.com/shakacode/react_on_rails/tree/master/KUDOS.md) for React on Rails. Please submit yours! Please edit either page or [email us](mailto:contact@shakacode.com) and we'll add your info. We also **love stars** as it helps us attract new users and contributors.
 - *See [NEWS.md](https://github.com/shakacode/react_on_rails/tree/master/NEWS.md) for more notes over time.*
 
@@ -310,66 +74,6 @@ Please [**click to subscribe**](https://app.mailerlite.com/webforms/landing/l1d9
 
 Bug reports and pull requests are welcome. See [Contributing](https://github.com/shakacode/react_on_rails/tree/master/CONTRIBUTING.md) to get started, and the [list of help wanted issues](https://github.com/shakacode/react_on_rails/labels/contributions%3A%20up%20for%20grabs%21).
 
-## React on Rails Pro
-
-Support React on Rails Pro development [by becoming a Github sponsor](https://github.com/sponsors/shakacode) and get these benefits.
-
-React on Rails Pro includes Node server rendering, fragment caching, code-splitting, and other performance enhancements for React on Rails. For a case study, see the article [HVMN’s 90% Reduction in Server Response Time from React on Rails Pro](https://www.shakacode.com/blog/hvmns-90-reduction-in-server-response-time-from-react-on-rails-pro/). The [Wiki](https://github.com/shakacode/react_on_rails/wiki) contains more details.
-
-[![2018-09-11_10-31-11](https://user-images.githubusercontent.com/1118459/45467845-5bcc7400-b6bd-11e8-91e1-e0cf806d4ea4.png)](https://blog.shakacode.com/hvmns-90-reduction-in-server-response-time-from-react-on-rails-pro-eb08226687db)
-
-The [React on Rails Pro Support Plan](https://www.shakacode.com/react-on-rails-pro) can help!
-
-* Optimizing your webpack setup to the latest Webpack for React on Rails including code splitting with loadable-components.
-* Upgrading your app to use the current `rails/webpacker` setup that skips the Sprockets asset pipeline.
-* Better performance client and server side.
-* Best practices based on over 6 years of React on Rails experience on many production projects.
-* Using [Reason](https://reasonml.github.io/) with (or without) React on Rails.
-
-ShakaCode can also help you with your custom software development needs. We specialize in marketplace and e-commerce applications that utilize both Rails and React. Because we own [HiChee.com](https://hichee.com), we can leverage that code for your app!
-
-Please email Justin Gordon [justin@shakacode.com](mailto:justin@shakacode.com), the maintainer of React on Rails, for more information.
-
-### Pro: Fragment Caching
-
-Fragment caching is a [React on Rails Pro](https://www.shakacode.com/react-on-rails-pro) feature. Fragment caching is a **HUGE** performance booster for your apps. Use the `cached_react_component` and `cached_react_component_hash`. The API is the same as `react_component` and `react_component_hash`, but for 2 differences:
-
-1. The `cache_key` takes the same parameters as any Rails `cache` view helper.
-1. The **props** are passed via a block so that evaluation of the props is not done unless the cache is broken. Suppose you put your props calculation into some method called `some_slow_method_that_returns_props`:
-
-```ruby
-<%= cached_react_component("App", cache_key: [@user, @post], prerender: true) do
-  some_slow_method_that_returns_props
-end %>
-```
-
-Such fragment caching saves CPU work for your web server and greatly reduces the request time. It completely skips the evaluation costs of:
-
-1. Database calls to compute the props.
-2. Serialization the props values hash into a JSON string for evaluating JavaScript to server render.
-3. Costs associated with evaluating JavaScript from your Ruby code.
-4. Creating the HTML string containing the props and the server-rendered JavaScript code.
-
-Note, even without server rendering (without step 3 above), fragment caching is still effective.
-
-### Pro: Integration with Node.js for Server Rendering
-
-Default server rendering is done by ExecJS. If you want to use a Node.js server for better performing server rendering, [email justin@shakacode.com](mailto:justin@shakacode.com). ShakaCode has built a premium Node rendering server that is part of [React on Rails Pro](https://www.shakacode.com/react-on-rails-pro).
-
-## Testimonials for ShakaCode
-[HVMN Testimonial, by Paul Benigeri, October 12, 2018](https://www.shakacode.com/react-on-rails/docs/testimonials/hvmn)
-> The price we paid for the consultation + the React on Rails pro license has already been made back a couple of times from hosting fees alone. The entire process was super hands off, and our core team was able to focus on shipping new feature during that sprint.
-
-[ResortPass Testimonial, by Leora Juster, December 10, 2018](https://www.shakacode.com/react-on-rails/docs/testimonials/resortpass)
-
-> Justin and his team were instrumental in assisting us in setting design foundations and standards for our transition to a react on rails application. Just three months of work with the team at Shaka code and we have a main page of our application server-side rendering at exponentially improved speeds.
-
-From Joel Hooks, Co-Founder, Chief Nerd at [egghead.io](https://egghead.io/), January 30, 2017:
-
-![2017-01-30_11-33-59](https://cloud.githubusercontent.com/assets/1118459/22443635/b3549fb4-e6e3-11e6-8ea2-6f589dc93ed3.png)
-
-For more testimonials, see [Live Projects](https://github.com/shakacode/react_on_rails/tree/master/PROJECTS.md) and [Kudos](https://github.com/shakacode/react_on_rails/tree/master/KUDOS.md).
-
 # Supporters
 
 The following companies support this open source project, and ShakaCode uses their products! Justin writes React on Rails on [RubyMine](https://www.jetbrains.com/ruby/). We use [Scout](https://scoutapp.com/) to monitor the live performance of [HiChee.com](https://HiChee.com), [Rails AutoScale](https://railsautoscale.com) to scale the dynos of HiChee, and [HoneyBadger](https://www.honeybadger.io/) to monitor application errors. We love [BrowserStack](https://www.browserstack.com) to solve problems with oddball browsers. [Status Hero](https://statushero.com/) keeps the team posted on daily progress; it's so much better than live standups.
@@ -379,14 +83,14 @@ The following companies support this open source project, and ShakaCode uses the
 [![Rails AutoScale](https://user-images.githubusercontent.com/1118459/103197530-48dc0e80-488a-11eb-8b1b-a16664b30274.png)](https://railsautoscale.com/)
 [![BrowserStack](https://cloud.githubusercontent.com/assets/1118459/23203304/1261e468-f886-11e6-819e-93b1a3f17da4.png)](https://www.browserstack.com)
 [![HoneyBadger](https://user-images.githubusercontent.com/1118459/114100696-63962a00-9860-11eb-8ac1-75ca02856d8e.png)](https://www.honeybadger.io/)
-[![StatusHero](https://user-images.githubusercontent.com/1118459/126868048-3fe64e54-4d6d-4066-9df2-8cf6fbaeb314.png)](https://statushero.com/)
+[![StatusHero](https://user-images.githubusercontent.com/1118459/114100685-5ed17600-9860-11eb-839a-e335f335462a.png)](https://statushero.com/)
 
 ShakaCode's favorite project tracking tool is [ClubHouse](https://clubhouse.io/). If you want to **try ClubHouse and get 2 months free beyond the 14-day trial period**, click [here to use ShakaCode's referral code](http://r.clbh.se/mvfoNeH). We're participating in their awesome triple-sided referral program, which you can read about [here](https://clubhouse.io/referral/). By using our [referral code](http://r.clbh.se/mvfoNeH) you'll be supporting ShakaCode and, thus, React on Rails!
 
 Aloha and best wishes from Justin and the ShakaCode team!
 
 # Work with Us
-ShakaCode is **[hiring passionate software engineers](http://www.shakacode.com/career)** to work on our projects, including [HiChee](https://hichee.com). 
+ShakaCode is **[hiring passionate software engineers](http://www.shakacode.com/career)** to work on our projects, including [HiChee](https://hichee.com).
 
 # License
 
diff --git a/SUMMARY.md b/SUMMARY.md
index 82f4889e7a..3beee4a4c6 100644
--- a/SUMMARY.md
+++ b/SUMMARY.md
@@ -4,17 +4,17 @@
 
 ## **Basics**
   + [React on Rails Basic Installation Tutorial](./docs/tutorial.md)
-  + [Webpack Configuration](./docs/basics/webpack-configuration.md)
+  + [Webpack Configuration](./docs/guides/webpack-configuration.md)
   + [How React on Rails Works](docs/outdated/how-react-on-rails-works.md)
-  + [Client vs. Server Rendering](./docs/basics/client-vs-server-rendering.md)
-  + [React Server Rendering](./docs/basics/react-server-rendering.md)
-  + [Render-Functions and the RailsContext](docs/basics/render-functions-and-railscontext.md)
+  + [Client vs. Server Rendering](./docs/guides/client-vs-server-rendering.md)
+  + [React Server Rendering](./docs/guides/react-server-rendering.md)
+  + [Render-Functions and the RailsContext](docs/guides/render-functions-and-railscontext.md)
   + [Caching and Performance: React on Rails Pro](https://github.com/shakacode/react_on_rails/wiki).
-  + [Deployment](docs/basics/deployment.md).
-  + [React on Rails Internationalization (I18n, localization)](docs/basics/i18n.md)
-  + [RSpec Test Helpers Configuration](docs/basics/rspec-configuration.md)
-  + [Minitest Configuration](docs/basics/minitest-configuration.md)
-  + [Upgrading React on Rails](docs/basics/upgrading-react-on-rails.md)
+  + [Deployment](docs/guides/deployment.md).
+  + [React on Rails Internationalization (I18n, localization)](docs/guides/i18n.md)
+  + [RSpec Test Helpers Configuration](docs/guides/rspec-configuration.md)
+  + [Minitest Configuration](docs/guides/minitest-configuration.md)
+  + [Upgrading React on Rails](docs/guides/upgrading-react-on-rails.md)
   
 ## **API**
   - [View Helpers API](./docs/api/view-helpers-api.md)
@@ -22,8 +22,8 @@
   - [Redux Store API](./docs/api/redux-store-api.md)
 
 ## **Additional Details**
-  + [Migration from react-rails](./docs/basics/migrating-from-react-rails.md)
-  + [Generator Details](docs/basics/generator-details.md)
+  + [Migration from react-rails](./docs/guides/migrating-from-react-rails.md)
+  + [Generator Details](docs/guides/generator-details.md)
   + [Updating Dependencies](./docs/additional-reading/updating-dependencies.md)
   + [Manual Installation Overview](docs/outdated/manual-installation-overview.md)
   + [Upgrading from rails/webpacker v3 to v4](docs/additional-reading/upgrade-webpacker-v3-to-v4.md)
@@ -45,7 +45,7 @@
   + [AngularJS Integration and Migration to React on Rails](./docs/additional-reading/angular-js-integration-migration.md)
 
 ## **Deployment**
-  + [Heroku Deployment](docs/basics/heroku-deployment.md)
+  + [Heroku Deployment](docs/guides/heroku-deployment.md)
   + [Elastic Beanstalk Deployment](./docs/additional-reading/elastic-beanstalk.md)
 
 ## Outdated Non-Webpack Docs
diff --git a/docs/additional-details/generator-details.md b/docs/additional-details/generator-details.md
index eee15b68ac..9892598d6b 100644
--- a/docs/additional-details/generator-details.md
+++ b/docs/additional-details/generator-details.md
@@ -37,7 +37,7 @@ Then you may run
     `rails s`
 ```
 
-Another good option is to create a simple test app per the [Tutorial](https://www.shakacode.com/react-on-rails/docs/basics/tutorial).
+Another good option is to create a simple test app per the [Tutorial](https://www.shakacode.com/react-on-rails/docs/guides/tutorial).
 
 # Understanding the Organization of the Generated Client Code
 The generated client code follows our organization scheme. Each unique set of functionality, is given its own folder inside of `app/javascript/app/bundles`. Note, the recommended for bigger projects is `client/app/bundles`. This encourages for modularity of *domains*.
diff --git a/docs/api/view-helpers-api.md b/docs/api/view-helpers-api.md
index 25625763d2..e7bb6140b0 100644
--- a/docs/api/view-helpers-api.md
+++ b/docs/api/view-helpers-api.md
@@ -23,7 +23,7 @@ Uncommonly used options:
 ```
 
 - **component_name:** Can be a React component, created using a React Function Component, an ES6 class or a Render-Function that returns a React component (or, only on the server side, an object with shape { redirectLocation, error, renderedHtml }), or a "renderer function" that manually renders a React component to the dom (client side only). Note, a "renderer function" is a special type of "Render-Function." A "renderer function" takes a 3rd param of a DOM ID.
-  All options except `props, id, html_options` will inherit from your `react_on_rails.rb` initializer, as described [here](https://www.shakacode.com/react-on-rails/docs/basics/configuration).
+  All options except `props, id, html_options` will inherit from your `react_on_rails.rb` initializer, as described [here](https://www.shakacode.com/react-on-rails/docs/guides/configuration).
 - **general options:**
   - **props:** Ruby Hash which contains the properties to pass to the react object, or a JSON string. If you pass a string, we'll escape it for you.
   - **prerender:** enable server-side rendering of a component. Set to false when debugging!
diff --git a/docs/basics/client-vs-server-rendering.md b/docs/guides/client-vs-server-rendering.md
similarity index 97%
rename from docs/basics/client-vs-server-rendering.md
rename to docs/guides/client-vs-server-rendering.md
index 12f8fadc87..793df9ec5a 100644
--- a/docs/basics/client-vs-server-rendering.md
+++ b/docs/guides/client-vs-server-rendering.md
@@ -1,6 +1,6 @@
 # Client-Side Rendering vs. Server-Side Rendering
 
-*Also, see [our react server-rendering documentation](https://www.shakacode.com/react-on-rails/docs/basics/react-server-rendering).*
+*Also, see [our react server-rendering documentation](https://www.shakacode.com/react-on-rails/docs/guides/react-server-rendering).*
 
 In most cases, you should use the `prerender: false` (default behavior) with the provided helper method to render the React component from your Rails views. In some cases, such as when SEO is vital, or many users will not have JavaScript enabled, you can enable server-rendering by passing `prerender: true` to your helper, or you can simply change the default in `config/initializers/react_on_rails`.
 
diff --git a/docs/basics/configuration.md b/docs/guides/configuration.md
similarity index 100%
rename from docs/basics/configuration.md
rename to docs/guides/configuration.md
diff --git a/docs/basics/deployment.md b/docs/guides/deployment.md
similarity index 100%
rename from docs/basics/deployment.md
rename to docs/guides/deployment.md
diff --git a/docs/guides/getting-started.md b/docs/guides/getting-started.md
new file mode 100644
index 0000000000..54f80de7e4
--- /dev/null
+++ b/docs/guides/getting-started.md
@@ -0,0 +1,183 @@
+# Getting Started
+
+Note, the best way to understand how to use ReactOnRails is to study a few simple examples. You can do a quick demo setup, either on your existing app or on a new Rails app.
+
+1. Do the quick [tutorial](https://www.shakacode.com/react-on-rails/docs/guides/tutorial).
+2. Add React on Rails to an existing Rails app per [the instructions](https://www.shakacode.com/react-on-rails/docs/guides/installation-into-an-existing-rails-app).
+3. Look at [spec/dummy](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy), a simple, no DB example.
+3. Look at [github.com/shakacode/react-webpack-rails-tutorial](https://github.com/shakacode/react-webpack-rails-tutorial); it's a full-featured example live at [www.reactrails.com](http://reactrails.com).
+
+## Basic Installation
+
+*See also [the instructions for installing into an existing Rails app](https://www.shakacode.com/react-on-rails/docs/guides/installation-into-an-existing-rails-app).*
+
+1. Add the `react_on_rails` gem to Gemfile:
+
+   ```bash
+   bundle add react_on_rails --strict
+   ```
+
+2. Commit this to git (or else you cannot run the generator unless you pass the option `--ignore-warnings`).
+
+3. Run the generator:
+
+   ```bash
+   rails generate react_on_rails:install
+   ```
+
+4. Start the app:
+
+   ```bash
+   rails s
+   ```
+
+5. Visit http://localhost:3000/hello_world.
+
+
+### Turning on server rendering
+
+With the code from running the React on Rails generator above:
+
+1. Edit `app/views/hello_world/index.html.erb` and set the `prerender` option to `true`.
+2. Refresh the page.
+
+Below is the line where you turn server rendering on by setting `prerender` to true:
+
+```erb
+<%= react_component("HelloWorld", props: @hello_world_props, prerender: false) %>
+```
+
+Note, if you got an error in your console regarding "ReferenceError: window is not defined",
+then you need to edit `config/webpacker.yml` and set `hmr: false` and `inline: false`.
+See [rails/webpacker PR 2644](https://github.com/rails/webpacker/pull/2644) for a fix for this
+issue.
+
+## Basic Usage
+
+### Configuration
+
+* Configure `config/initializers/react_on_rails.rb`. You can adjust some necessary settings and defaults. See file [docs/basics/configuration.md](https://www.shakacode.com/react-on-rails/docs/guides/configuration) for documentation of all configuration options.
+* Configure `config/webpacker.yml`. If you used the generator and the default webpacker setup, you don't need to touch this file. If you are customizing your setup, then consult the [spec/dummy/config/webpacker.yml](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy/config/webpacker.yml) example or the official default [webpacker.yml](https://github.com/rails/webpacker/blob/master/lib/install/config/webpacker.yml).
+* Most apps should rely on the rails/webpacker setup for Webpack. v6 of rails/webpacker includes support for v5 of webpack.
+
+## Including your React Component on your Rails Views
+
+- React component are rendered via your Rails Views. Here's an ERB sample:
+
+  ```erb
+  <%= react_component("HelloWorld", props: @some_props) %>
+  ```
+
+- **Server-Side Rendering**: Your react component is first rendered into HTML on the server. Use the **prerender** option:
+
+  ```erb
+  <%= react_component("HelloWorld", props: @some_props, prerender: true) %>
+  ```
+
+- The `component_name` parameter is a string matching the name you used to expose your React component globally. So, in the above examples, if you had a React component named "HelloWorld", you would register it with the following lines:
+
+  ```js
+  import ReactOnRails from 'react-on-rails';
+  import HelloWorld from './HelloWorld';
+  ReactOnRails.register({ HelloWorld });
+  ```
+
+  Exposing your component in this way is how React on Rails is able to reference your component from a Rails view. You can expose as many components as you like, as long as their names do not collide. See below for the details of how you expose your components via the react_on_rails webpack configuration. You may call `ReactOnRails.register` many times.
+
+- `@some_props` can be either a hash or JSON string. This is an optional argument assuming you do not need to pass any options (if you want to pass options, such as `prerender: true`, but you do not want to pass any properties, simply pass an empty hash `{}`). This will make the data available in your component:
+
+  ```ruby
+    # Rails View
+    <%= react_component("HelloWorld", props: { name: "Stranger" }) %>
+  ```
+
+- This is what your HelloWorld.js file might contain. The railsContext is always available for any parameters that you _always_ want available for your React components. It has _nothing_ to do with the concept of the [React Context](https://reactjs.org/docs/context.html). See [Render-Functions and the RailsContext](https://www.shakacode.com/react-on-rails/docs/guides/render-functions-and-railscontext) for more details on this topic.
+
+  ```js
+  import React from 'react';
+
+  export default (props, railsContext) => {
+    // Note wrap in a function to make this a React function component
+    return () => (
+      <div>
+        Your locale is {railsContext.i18nLocale}.<br/>
+        Hello, {props.name}!
+      </div>
+    );
+  };
+  ```
+
+See the [View Helpers API](https://www.shakacode.com/react-on-rails/docs/api/view-helpers-api) for more details on `react_component` and its sibling function `react_component_hash`.
+
+## Globally Exposing Your React Components
+
+For the React on Rails view helper `react_component` to use your React components, you will have to **register** them in your JavaScript code.
+
+Use modules just as you would when using Webpack and React without Rails. The difference is that instead of mounting React components directly to an element using `React.render`, you **register your components to ReactOnRails and then mount them with helpers inside of your Rails views**.
+
+This is how to expose a component to the `react_component` view helper.
+
+```javascript
+  // app/javascript/packs/hello-world-bundle.js
+  import HelloWorld from '../components/HelloWorld';
+  import ReactOnRails from 'react-on-rails';
+  ReactOnRails.register({ HelloWorld });
+```
+
+#### Different Server-Side Rendering Code (and a Server-Specific Bundle)
+
+You may want different code for your server-rendered components running server side versus client side. For example, if you have an animation that runs when a component is displayed, you might need to turn that off when server rendering. One way to handle this is conditional code like `if (window) { doClientOnlyCode() }`.
+
+Another way is to use a separate webpack configuration file that can use a different server side entry file, like  'serverRegistration.js' as opposed to 'clientRegistration.js.' That would set up different code for server rendering.
+
+For details on techniques to use different code for client and server rendering, see: [How to use different versions of a file for client and server rendering](https://forum.shakacode.com/t/how-to-use-different-versions-of-a-file-for-client-and-server-rendering/1352). (_Requires creating a free account._)
+
+## Specifying Your React Components: Register directly or use render-functions
+
+You have two ways to specify your React components. You can either register the React component (either function or class component) directly, or you can create a function that returns a React component, which we using the name of a "render-function". Creating a render-function allows:
+
+1. You to have access to the `railsContext`. See [documentation for the railsContext](https://www.shakacode.com/react-on-rails/docs/guides/render-functions-and-railscontext) in terms of why you might need it. You **need** a Render-Function to access the `railsContext`.
+2. You can use the passed-in props to initialize a redux store or set up react-router.
+3. You can return different components depending on what's in the props.
+
+Note, the return value of a **Render-Function** should be either a React Function or Class Component, or an object representing server rendering results.
+
+**Do not return a React Element (JSX).**
+
+ReactOnRails will automatically detect a registered Render-Function by the fact that the function takes
+more than 1 parameter. In other words, if you want the ability to provide a function that returns the
+React component, then you need to specify at least a second parameter. This is the `railsContext`.
+If you're not using this parameter, declare your function with the unused param:
+
+```js
+const MyComponentGenerator = (props, _railsContext) => {
+  if (props.print) {
+    // This is a React FunctionComponent because it is wrapped in a function.
+    return () => <H1>{JSON.stringify(props)}</H1>;
+  }
+}
+```
+
+Thus, there is no difference between registering a React Function Component or class Component versus a "Render-Function." Just call `ReactOnRails.register`.
+
+## react_component_hash for Render-Functions
+
+Another reason to use a Render-Function is that sometimes in server rendering, specifically with React Router, you need to return the result of calling ReactDOMServer.renderToString(element). You can do this by returning an object with the following shape: { renderedHtml, redirectLocation, error }. Make sure you use this function with `react_component_hash`.
+
+For server rendering, if you wish to return multiple HTML strings from a Render-Function, you may return an Object from your Render-Function with a single top-level property of `renderedHtml`. Inside this Object, place a key called `componentHtml`, along with any other needed keys. An example scenario of this is when you are using side effects libraries like [React Helmet](https://github.com/nfl/react-helmet). Your Ruby code will get this Object as a Hash containing keys componentHtml and any other custom keys that you added:
+
+```js
+{ renderedHtml: { componentHtml, customKey1, customKey2} }
+```
+
+For details on using react_component_hash with react-helmet, see [our react-helmet documentation](https://www.shakacode.com/react-on-rails/docs/additional-reading/react-helmet).
+
+## Error Handling
+
+* All errors from ReactOnRails will be of type ReactOnRails::Error.
+* Prerendering (server rendering) errors get context information for HoneyBadger and Sentry for easier debugging.
+
+## I18n
+
+React on Rails provides an option for automatic conversions of Rails `*.yml` locale files into `*.json` or `*.js*.
+See the [How to add I18n](https://www.shakacode.com/react-on-rails/docs/guides/i18n) for a summary of adding I18n.
diff --git a/docs/basics/hmr-and-hot-reloading-with-the-webpack-dev-server.md b/docs/guides/hmr-and-hot-reloading-with-the-webpack-dev-server.md
similarity index 100%
rename from docs/basics/hmr-and-hot-reloading-with-the-webpack-dev-server.md
rename to docs/guides/hmr-and-hot-reloading-with-the-webpack-dev-server.md
diff --git a/docs/basics/how-react-on-rails-works.md b/docs/guides/how-react-on-rails-works.md
similarity index 99%
rename from docs/basics/how-react-on-rails-works.md
rename to docs/guides/how-react-on-rails-works.md
index 543fc90c0a..05eb6c2230 100644
--- a/docs/basics/how-react-on-rails-works.md
+++ b/docs/guides/how-react-on-rails-works.md
@@ -36,7 +36,7 @@ On production deployments that use asset precompilation, such as Heroku deployme
 
 However, if you want to run a custom command to run webpack to build your bundles, then you will:
 1. Ensure you do not have a `config/webpack/production.js` file
-1. Define `config.build_production_command` in your [config/initializers/react_on_rails.rb](https://www.shakacode.com/react-on-rails/docs/basics/configuration)
+1. Define `config.build_production_command` in your [config/initializers/react_on_rails.rb](https://www.shakacode.com/react-on-rails/docs/guides/configuration)
 
 Then React on Rails modifies the `assets:precompile` task to run your `build_production_command`.
 
diff --git a/docs/guides/how-to-conditionally-server-render-based-on-device-type.md b/docs/guides/how-to-conditionally-server-render-based-on-device-type.md
new file mode 100644
index 0000000000..4384b50375
--- /dev/null
+++ b/docs/guides/how-to-conditionally-server-render-based-on-device-type.md
@@ -0,0 +1,39 @@
+# How to conditionally render server side based on the device type 
+
+In general, we want to use CSS to do mobile responsive layouts.
+
+However, sometimes we want to have layouts sufficiently different that we can't do this via CSS. If we didn't do server rendering, we can check the device type on the client side. However, if we're doing server rendering, we need to send this data to the client code from the Rails server so that the server rendering can account for this.
+
+Here's an example:
+
+## config/initializers/react_on_rails.rb
+```ruby
+module RenderingExtension
+  # Return a Hash that contains custom values from the view context that will get passed to
+  # all calls to react_component and redux_store for rendering
+  def self.custom_context(view_context)
+    if view_context.controller.is_a?(ActionMailer::Base)
+      {}
+    else
+      {
+        desktop: !(view_context.browser.device.tablet? || view_context.browser.device.mobile?),
+        tablet: view_context.browser.device.tablet?,
+        mobile: view_context.browser.device.mobile? || false
+      }
+    end
+  end
+end
+
+# Shown below are the defaults for configuration
+ReactOnRails.configure do |config|
+  # See https://github.com/shakacode/react_on_rails/blob/master/docs/guides/configuration.md for the rest
+ 
+  # This allows you to add additional values to the Rails Context. Implement one static method
+  # called `custom_context(view_context)` and return a Hash.
+  config.rendering_extension = RenderingExtension
+end
+```
+
+Note, full details of the React on Rails confguration are [here in docs/basics/configuration.md](https://github.com/shakacode/react_on_rails/blob/master/docs/guides/configuration.md).
+
+See the doc file [docs/basics/generator-functions-and-railscontext.md](https://github.com/shakacode/react_on_rails/blob/master/docs/guides/generator-functions-and-railscontext.md#rails-context) for how your client-side code uses the device information
diff --git a/docs/guides/how-to-use-different-files-for-client-and-server-rendering.md b/docs/guides/how-to-use-different-files-for-client-and-server-rendering.md
new file mode 100644
index 0000000000..0e318c1c65
--- /dev/null
+++ b/docs/guides/how-to-use-different-files-for-client-and-server-rendering.md
@@ -0,0 +1,98 @@
+## How to use different versions of a file for client and server rendering
+
+There are 3 main ways to use different code for server vs. client rendering.
+
+## A. Using different Entry Points
+Many projects will have different entry points for client and server rendering. This only works for a top-level entry point such as the entry point for a react-router app component.
+
+Your Client Entry can look like this:
+
+```js
+import ReactOnRails from 'react-on-rails';
+import App from './ClientApp';
+ReactOnRails.register({ App })
+```
+
+So your Server Entry can look like:
+
+```js
+import ReactOnRails from 'react-on-rails';
+import App from './ServerApp';
+ReactOnRails.register({ App })
+```
+
+Note that the only difference is on the second line of each of these examples.
+
+## B. Two Options for Using Webpack Resolve Alias in the Webpack Config
+Per [Webpack Docs](https://webpack.js.org/configuration/resolve/#resolve-alias).
+
+### 1. Update `webpack/set-resolve.js` to have a different resolution for the exact file:
+
+```js
+function setResolve(builderConfig, webpackConfig) {
+
+  // Use a different resolution for Client and Server file
+  let SomeJsFile;
+  if (builderConfig.serverRendering) {
+    SomeJsFile = path.resolve(__dirname, "../bundles/SomeJsFileServer");
+  } else {
+    SomeJsFile = path.resolve(__dirname, "../bundles/SomeJsFileClient");
+  }
+
+ const resolve = {
+    alias: {
+      ... // blah blah
+      SomeJsFile,
+      ... // blah blah
+    },
+```
+
+Then you have this import:
+
+```js
+import SomeJsFile from 'SomeJsFile';
+```
+
+### 2. Use a different resolution for the right directory of client or server files:
+
+#### a. Update `webpack/set-resolve.js` to have something like:
+```js
+function setResolve(builderConfig, webpackConfig) {
+
+  // Use a different resolution for Client and Server file
+  let variant;
+  if (builderConfig.serverRendering) {
+    variant = path.resolve(__dirname, "../bundles/variant/ClientOnly");
+  } else {
+    variant = path.resolve(__dirname, "../bundles/variant/serverOnly");
+  }
+
+ const resolve = {
+    alias: {
+      ... // blah blah
+      variant
+      ... // blah blah
+    },
+```
+
+#### b. Add different versions of the file to the `bundles/variant/ClientOnly` and `bundles/variant/ServerOnly` directories
+
+#### c. Use the `variant` in import in a file that can be used both for client and server rendering:
+
+```js
+import SomeJsFile from 'variant/SomeJsFile';
+import AnotherJsFile from 'variant/AnotherJsFile';
+```
+
+## C. Conditional code that can check if `window` is defined.
+
+This is probably the ugliest and hackiest way to do this, but it's quick! Essentially you wrap code that cannot execute server side in a conditional:
+
+```js
+if (window) { // window should be falsy on the server side
+  doSomethingClientOnly();
+  
+  // or do an import
+  const foobar = require('foobar').default;
+}
+```
diff --git a/docs/basics/i18n.md b/docs/guides/i18n.md
similarity index 100%
rename from docs/basics/i18n.md
rename to docs/guides/i18n.md
diff --git a/docs/basics/installation-into-an-existing-rails-app.md b/docs/guides/installation-into-an-existing-rails-app.md
similarity index 98%
rename from docs/basics/installation-into-an-existing-rails-app.md
rename to docs/guides/installation-into-an-existing-rails-app.md
index ad16d56e89..8d602a5c7f 100644
--- a/docs/basics/installation-into-an-existing-rails-app.md
+++ b/docs/guides/installation-into-an-existing-rails-app.md
@@ -1,6 +1,6 @@
 # Getting Started with an existing Rails app
 
-**Also consult the instructions for installing on a fresh Rails app**, see the [React on Rails Basic Tutorial](https://www.shakacode.com/react-on-rails/docs/basics/tutorial).
+**Also consult the instructions for installing on a fresh Rails app**, see the [React on Rails Basic Tutorial](https://www.shakacode.com/react-on-rails/docs/guides/tutorial).
 
 **If you have rails-5 API only project**, first [convert the rails-5 API only app to rails app](#convert-rails-5-api-only-app-to-rails-app) before [getting started](#getting-started-with-an-existing-rails-app).
 
diff --git a/docs/basics/minitest-configuration.md b/docs/guides/minitest-configuration.md
similarity index 100%
rename from docs/basics/minitest-configuration.md
rename to docs/guides/minitest-configuration.md
diff --git a/docs/rails-webpacker-react-integration-options.md b/docs/guides/rails-webpacker-react-integration-options.md
similarity index 100%
rename from docs/rails-webpacker-react-integration-options.md
rename to docs/guides/rails-webpacker-react-integration-options.md
diff --git a/docs/basics/react-server-rendering.md b/docs/guides/react-server-rendering.md
similarity index 94%
rename from docs/basics/react-server-rendering.md
rename to docs/guides/react-server-rendering.md
index 54bf7e444e..4d30c51fe6 100644
--- a/docs/basics/react-server-rendering.md
+++ b/docs/guides/react-server-rendering.md
@@ -1,6 +1,6 @@
 # React Server Rendering
 
-See also [Client vs. Server Rendering](https://www.shakacode.com/react-on-rails/docs/basics/client-vs-server-rendering).
+See also [Client vs. Server Rendering](https://www.shakacode.com/react-on-rails/docs/guides/client-vs-server-rendering).
 
 ## What is the easiest way to setup a webpack configuration for server-side-rendering?
 See the example webpack setup here: [github.com/shakacode/react_on_rails_tutorial_with_ssr_and_hmr_fast_refresh](https://github.com/shakacode/react_on_rails_tutorial_with_ssr_and_hmr_fast_refresh).
@@ -13,7 +13,7 @@ During the Rails rendering of HTML per a browser request, the Rails server will
 
 The default JavaScript interpretter is [ExecJS](https://github.com/rails/execjs). If you want to maximize the perfomance of your server rendering, then you want to use React on Rails Pro which uses NodeJS to do the server rendering. See the [docs for React on Rails Pro](https://github.com/shakacode/react_on_rails/wiki).
 
-See [this note](https://www.shakacode.com/react-on-rails/docs/basics/client-vs-server-rendering).
+See [this note](https://www.shakacode.com/react-on-rails/docs/guides/client-vs-server-rendering).
 
 ## How do you do Server Rendering with React on Rails?
 1. The `react_component` view helper method provides the `prerender:` option to switch on or off server rendering.
diff --git a/docs/guides/reat-on-rails-overview.md b/docs/guides/reat-on-rails-overview.md
new file mode 100644
index 0000000000..e9b2cac26f
--- /dev/null
+++ b/docs/guides/reat-on-rails-overview.md
@@ -0,0 +1,30 @@
+# React on Rails
+
+React on Rails integrates Rails with (server rendering of) Facebook's [React](https://github.com/facebook/react) front-end framework.
+
+---
+
+# Project Objective
+
+To provide a high performance framework for integrating Ruby on Rails with React via the [**Webpacker**](https://github.com/rails/webpacker) gem especially in regards to React Server-Side Rendering for better SEO and improved performance.
+
+# Features and Why React on Rails?
+
+Given that [`rails/webpacker`](https://github.com/rails/webpacker/) gem already provides basic React integration, why would you use "React on Rails"?
+
+1. 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.
+1. Tight integration with [rails/webpacker](https://github.com/rails/webpacker).
+1. Server-Side Rendering (SSR), often used for SEO crawler indexing and UX performance, is not offered by `rails/webpacker`.
+1. Support for HMR for a great developer experience.
+1. Supports latest versions of React with hooks.
+1. [Redux](https://github.com/reactjs/redux) and [React Router](https://github.com/ReactTraining/react-router#readme) integration including server-side-rendering.
+1. [Internationalization (I18n) and (localization)](https://www.shakacode.com/react-on-rails/docs/guides/i18n)
+1. A supportive community. This [web search shows how live public sites are using React on Rails](https://publicwww.com/websites/%22react-on-rails%22++-undeveloped.com+depth%3Aall/).
+1. [ReScript (Reason ML) Support](https://github.com/shakacode/reason-react-on-rails-example).
+
+See the [react-webpack-rails-tutorial](https://github.com/shakacode/react-webpack-rails-tutorial) for an example of a live implementation and code.
+----
+
+## Prerequisites
+
+Ruby on Rails >=5 and rails/webpacker 4.2+.
diff --git a/docs/basics/render-functions-and-railscontext.md b/docs/guides/render-functions-and-railscontext.md
similarity index 100%
rename from docs/basics/render-functions-and-railscontext.md
rename to docs/guides/render-functions-and-railscontext.md
diff --git a/docs/basics/rspec-configuration.md b/docs/guides/rspec-configuration.md
similarity index 97%
rename from docs/basics/rspec-configuration.md
rename to docs/guides/rspec-configuration.md
index 8851ed7e06..caddc9596a 100644
--- a/docs/basics/rspec-configuration.md
+++ b/docs/guides/rspec-configuration.md
@@ -1,5 +1,5 @@
 # RSpec Configuration
-_Click [here for minitest](https://www.shakacode.com/react-on-rails/docs/basics/minitest-configuration)_
+_Click [here for minitest](https://www.shakacode.com/react-on-rails/docs/guides/minitest-configuration)_
 
 # If your webpack configurations correspond to rails/webpacker's default setup
 If you're able to configure your webpack configuration to be run by having your webpack configuration
@@ -9,7 +9,7 @@ compiled by webpack before running tests and during production deployment:
 1. **Use rails/webpacker's compile option**: Configure your `config/webpacker.yml` so that `compile: true` is for `test` and `production`
    environments. Ensure that your `source_path` is correct, or else `rails/webpacker` won't correctly
    detect changes.
-2. **Use the react_on_rails settings and helpers**. Use the settings in `config/initializers/react_on_rails.rb`. Refer to [docs/configuration](https://www.shakacode.com/react-on-rails/docs/basics/configuration).
+2. **Use the react_on_rails settings and helpers**. Use the settings in `config/initializers/react_on_rails.rb`. Refer to [docs/configuration](https://www.shakacode.com/react-on-rails/docs/guides/configuration).
 
 ```yml
   config.build_test_command = "NODE_ENV=test RAILS_ENV=test bin/webpack"
diff --git a/docs/basics/tutorial.md b/docs/guides/tutorial.md
similarity index 99%
rename from docs/basics/tutorial.md
rename to docs/guides/tutorial.md
index c4fdec74a2..2e3fcb20fb 100644
--- a/docs/basics/tutorial.md
+++ b/docs/guides/tutorial.md
@@ -1,7 +1,5 @@
 # React on Rails Basic Tutorial
 
------
-
 **November 11, 2020**: See the example repo of [React on Rails Tutorial With SSR, HMR fast refresh, and TypeScript](https://github.com/shakacode/react_on_rails_tutorial_with_ssr_and_hmr_fast_refresh) for a new way to setup the creation of your SSR bundle with `rails/webpacker`. This file will be update shortly. Most of it is still relevant.
 
 -----
@@ -292,8 +290,8 @@ versus with server rendering:
 
 For more details on server rendering, see:
 
-  + [Client vs. Server Rendering](https://www.shakacode.com/react-on-rails/docs/basics/client-vs-server-rendering)
-  + [React Server Rendering](https://www.shakacode.com/react-on-rails/docs/basics/react-server-rendering)
+  + [Client vs. Server Rendering](https://www.shakacode.com/react-on-rails/docs/guides/client-vs-server-rendering)
+  + [React Server Rendering](https://www.shakacode.com/react-on-rails/docs/guides/react-server-rendering)
 
 ## Moving from the Rails default `/app/javascript` to the recommended `/client` structure
 
diff --git a/docs/basics/upgrading-react-on-rails.md b/docs/guides/upgrading-react-on-rails.md
similarity index 99%
rename from docs/basics/upgrading-react-on-rails.md
rename to docs/guides/upgrading-react-on-rails.md
index 8e716f7bf5..4fc3e8bd8e 100644
--- a/docs/basics/upgrading-react-on-rails.md
+++ b/docs/guides/upgrading-react-on-rails.md
@@ -25,7 +25,7 @@ If you still need that feature, please file an issue.
 In order to solve the issues regarding React Hooks compatibility, the number of parameters
 for functions is used to determine if you have a Render-Function that will get invoked to
 return a React component, or you are registering a React component defined by a function.
-Please see [Render-Functions and the Rails Context](https://www.shakacode.com/react-on-rails/docs/basics/render-functions-and-railscontext) for
+Please see [Render-Functions and the Rails Context](https://www.shakacode.com/react-on-rails/docs/guides/render-functions-and-railscontext) for
 more information on what a Render-Function is.
 
 ##### Update required for registered functions taking exactly 2 params.
diff --git a/docs/basics/webpack-configuration.md b/docs/guides/webpack-configuration.md
similarity index 98%
rename from docs/basics/webpack-configuration.md
rename to docs/guides/webpack-configuration.md
index 6b715ce464..9ad77cdf03 100644
--- a/docs/basics/webpack-configuration.md
+++ b/docs/guides/webpack-configuration.md
@@ -22,7 +22,7 @@ A key decision in your use React on Rails is whether you go with the rails/webpa
 
 ## Option 1: Default Generator Setup: rails/webpacker app/javascript
 
-Typical rails/webpacker apps have a standard directory structure as documented [here](https://github.com/rails/webpacker/blob/5-x-stable/docs/recommended-project-structure.md). If you follow the steps in the the [basic tutorial](https://www.shakacode.com/react-on-rails/docs/basics/tutorial), you will see this pattern in action. In order to customize the Webpack configuration, you need to consult with the [rails/webpacker Webpack configuration](https://www.shakacode.com/react-on-rails/docs/javascript/webpack).
+Typical rails/webpacker apps have a standard directory structure as documented [here](https://github.com/rails/webpacker/blob/5-x-stable/docs/recommended-project-structure.md). If you follow the steps in the the [basic tutorial](https://www.shakacode.com/react-on-rails/docs/guides/tutorial), you will see this pattern in action. In order to customize the Webpack configuration, you need to consult with the [rails/webpacker Webpack configuration](https://www.shakacode.com/react-on-rails/docs/javascript/webpack).
 
 The *advantage* of using rails/webpacker to configure Webpack is that there is very little code needed to get started and you don't need to understand really anything about Webpack customization.
 
diff --git a/docs/home.md b/docs/home.md
index 4ff025f930..55f605646b 100644
--- a/docs/home.md
+++ b/docs/home.md
@@ -1,382 +1,23 @@
 # React on Rails
 
-*These are the docs for React on Rails 12. To see the version 11 docs, [click here](https://github.com/shakacode/react_on_rails/tree/11.3.0).*
-
-**If you're viewing this page on Github, please go to [our documentation website](https://www.shakacode.com/react-on-rails/docs/) instead!**
-
-#### News
-**October 14, 2020**: [RUBY ROGUES
-RR 474: React on Rails V12 – Don’t Shave That Yak! with Justin Gordon](https://devchat.tv/ruby-rogues/rr-474-react-on-rails-v12-dont-shave-that-yak-with-justin-gordon/).
-
-**October 1, 2020**: See the [spec/dummy](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy) example repo for a simple configuration of webpack via the rails/webpacker gem
-that supports SSR.
-
-**August 2, 2020**: See the example repo of [React on Rails Tutorial With SSR, HMR fast refresh, and TypeScript](https://github.com/shakacode/react_on_rails_tutorial_with_ssr_and_hmr_fast_refresh) for a new way to setup the creation of your SSR bundle with `rails/webpacker`.
-
-**July 8, 2020**: Release v12 of React on Rails.
-
-**Major Improvements**
-
-1. **React Hooks Support** for top level components
-2. **Typescript bindings**
-3. **rails/webpacker** "just works" with React on Rails by default.
-4. i18n support for generating a JSON file rather than a JS file.
-
-Be sure to see the [CHANGELOG.md](https://github.com/shakacode/react_on_rails/tree/master/CHANGELOG.md) and read the upgrade instructions:
-[docs/basics/upgrading-react-on-rails](https://www.shakacode.com/react-on-rails/docs/basics/upgrading-react-on-rails#upgrading-to-v12).
-
-* See Justin's RailsConf talk: [Webpacker, It-Just-Works, But How?](http://railsconf.com/2020/video/justin-gordon-webpacker-it-just-works-but-how).
-* Are you interested in support for React on Rails? Do you want to use Node.js to do your server-side rendering so libraries like Emotion and Loadable Components just work, as compared to rendering via Ruby embedded JS? If so check out [React on Rails Pro](https://www.shakacode.com/react-on-rails-pro).
-* HMR is working with [Loadable Components](https://loadable-components.com) for a both amazing hot-reloading developer experience and great runtime performance. Please [email me](mailto:justin@shakacode.com) if you'd like to use [Loadable Components Code Splitting](https://loadable-components.com/docs/code-splitting/) to speed up your app by reducing your bundle sizes and lazily loading the code that's needed.
----
-
-#### About
-React on Rails integrates Rails with (server rendering of) Facebook's [React](https://github.com/facebook/react) front-end framework.
-
-This project is maintained by the software consulting firm [ShakaCode](https://www.shakacode.com). We focus on Ruby on Rails applications with React front-ends, often using TypeScript or ReasonML. We also build Gatsby sites. See [our recent work](https://www.shakacode.com/recent-work) for examples of what we do.
-
-Interested in optimizing your webpack setup for React on Rails including code
-splitting with [react-router](https://github.com/ReactTraining/react-router#readme),
-and [loadable-components](https://loadable-components.com/) with server-side rendering?
-We just did this for Popmenu, [lowering Heroku costs 20-25% while getting a 73% decrease in average response times](https://www.shakacode.com/recent-work/popmenu/).
-
-Feel free to contact Justin Gordon, [justin@shakacode.com](mailto:justin@shakacode.com), maintainer of React on Rails, for more information.
-
-[Click to join **React + Rails Slack**](https://reactrails.slack.com/join/shared_invite/enQtNjY3NTczMjczNzYxLTlmYjdiZmY3MTVlMzU2YWE0OWM0MzNiZDI0MzdkZGFiZTFkYTFkOGVjODBmOWEyYWQ3MzA2NGE1YWJjNmVlMGE).
-
-# Intro
-
-## Project Objective
-
-To provide a high performance framework for integrating Ruby on Rails with React via the [**Webpacker**](https://github.com/rails/webpacker) gem especially in regards to 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. 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.
-1. Tight integration with [rails/webpacker](https://github.com/rails/webpacker).
-1. Server-Side Rendering (SSR), often used for SEO crawler indexing and UX performance, is not offered by `rails/webpacker`.
-1. [Redux](https://github.com/reactjs/redux) and [React Router](https://github.com/ReactTraining/react-router#readme) integration with server-side-rendering.
-1. [Internationalization (I18n) and (localization)](https://www.shakacode.com/react-on-rails/docs/basics/i18n)
-1. A supportive community. This [web search shows how live public sites are using React on Rails](https://publicwww.com/websites/%22react-on-rails%22++-undeveloped.com+depth%3Aall/).
-1. [Reason ML Support](https://github.com/shakacode/reason-react-on-rails-example).
-
-See the [react-webpack-rails-tutorial](https://github.com/shakacode/react-webpack-rails-tutorial) for an example of a live implementation and code.
-
-## ShakaCode Forum Premium Content
-_Requires creating a free account._
-
-* [How to use different versions of a file for client and server rendering](https://forum.shakacode.com/t/how-to-use-different-versions-of-a-file-for-client-and-server-rendering/1352)
-
-----
-
-# Docs
-
-**Consider browsing this on our [website](https://www.shakacode.com/react-on-rails/docs/).**
-
-## Prerequisites
-
-Ruby on Rails >=5 and rails/webpacker 4.2+.
-
-## Getting Started
-
-Note, the best way to understand how to use ReactOnRails is to study a few simple examples. You can do a quick demo setup, either on your existing app or on a new Rails app.
-
-1. Do the quick [tutorial](https://www.shakacode.com/react-on-rails/docs/basics/tutorial).
-2. Add React on Rails to an existing Rails app per [the instructions](https://www.shakacode.com/react-on-rails/docs/basics/installation-into-an-existing-rails-app).
-3. Look at [spec/dummy](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy), a simple, no DB example.
-3. Look at [github.com/shakacode/react-webpack-rails-tutorial](https://github.com/shakacode/react-webpack-rails-tutorial); it's a full-featured example live at [www.reactrails.com](http://www.reactrails.com).
-
-## Basic Installation
-
-*See also [the instructions for installing into an existing Rails app](https://www.shakacode.com/react-on-rails/docs/basics/installation-into-an-existing-rails-app).*
-
-2. Add the `react_on_rails` gem to Gemfile:
-
-   ```bash
-   bundle add react_on_rails --strict
-   ```
-
-4. Commit this to git (or else you cannot run the generator unless you pass the option `--ignore-warnings`).
-
-5. Run the generator:
-
-   ```bash
-   rails generate react_on_rails:install
-   ```
-
-6. Start the app:
-
-   ```bash
-   rails s
-   ```
-
-7. Visit http://localhost:3000/hello_world.
-
-
-### Turning on server rendering
-
-With the code from running the React on Rails generator above:
-
-1. Edit `app/views/hello_world/index.html.erb` and set `prerender` to `true`.
-2. Refresh the page.
-
-Below is the line where you turn server rendering on by setting `prerender` to true:
-
-```erb
-<%= react_component("HelloWorld", props: @hello_world_props, prerender: false) %>
-```
-
-Note, if you got an error in your console regarding "ReferenceError: window is not defined",
-then you need to edit `config/webpacker.yml` and set `hmr: false` and `inline: false`.
-See [rails/webpacker PR 2644](https://github.com/rails/webpacker/pull/2644) for a fix for this
-issue.
-
-## Basic Usage
-
-### Configuration
-
-* Configure `config/initializers/react_on_rails.rb`. You can adjust some necessary settings and defaults. See file [docs/basics/configuration.md](https://www.shakacode.com/react-on-rails/docs/basics/configuration) for documentation of all configuration options.
-* Configure `config/webpacker.yml`. If you used the generator and the default webpacker setup, you don't need to touch this file. If you are customizing your setup, then consult the [spec/dummy/config/webpacker.yml](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy/config/webpacker.yml) example or the official default [webpacker.yml](https://github.com/rails/webpacker/blob/master/lib/install/config/webpacker.yml).
-  * Tip: set `compile: false` for development if you know that you'll always be compiling with a watch process. Otherwise, every request will check if compilation is needed.
-  * Your `public_output_path` must match your custom Webpack configuration for `output` of your bundles.
-  * Only set `cache_manifest` to `true` in your production env.
-
-## Including your React Component on your Rails Views
-
-- React component are rendered via your Rails Views. Here's an ERB sample:
-
-  ```erb
-  <%= react_component("HelloWorld", props: @some_props) %>
-  ```
-
-- **Server-Side Rendering**: Your react component is first rendered into HTML on the server. Use the **prerender** option:
-
-  ```erb
-  <%= react_component("HelloWorld", props: @some_props, prerender: true) %>
-  ```
-
-- The `component_name` parameter is a string matching the name you used to expose your React component globally. So, in the above examples, if you had a React component named "HelloWorld", you would register it with the following lines:
-
-  ```js
-  import ReactOnRails from 'react-on-rails';
-  import HelloWorld from './HelloWorld';
-  ReactOnRails.register({ HelloWorld });
-  ```
-
-  Exposing your component in this way is how React on Rails is able to reference your component from a Rails view. You can expose as many components as you like, as long as their names do not collide. See below for the details of how you expose your components via the react_on_rails webpack configuration. You may call `ReactOnRails.register` many times.
-
-- `@some_props` can be either a hash or JSON string. This is an optional argument assuming you do not need to pass any options (if you want to pass options, such as `prerender: true`, but you do not want to pass any properties, simply pass an empty hash `{}`). This will make the data available in your component:
-
-  ```ruby
-    # Rails View
-    <%= react_component("HelloWorld", props: { name: "Stranger" }) %>
-  ```
-
-- This is what your HelloWorld.js file might contain. The railsContext is always available for any parameters that you _always_ want available for your React components. It has _nothing_ to do with the concept of the [React Context](https://reactjs.org/docs/context.html). See [Render-Functions and the RailsContext](https://www.shakacode.com/react-on-rails/docs/basics/render-functions-and-railscontext) for more details on this topic.
-
-  ```js
-  import React from 'react';
-
-  export default (props, railsContext) => {
-    // Note wrap in a function to make this a React function component
-    return () => (
-      <div>
-        Your locale is {railsContext.i18nLocale}.<br/>
-        Hello, {props.name}!
-      </div>
-    );
-  };
-  ```
-
-See the [View Helpers API](https://www.shakacode.com/react-on-rails/docs/api/view-helpers-api) for more details on `react_component` and its sibling function `react_component_hash`.
-
-## Globally Exposing Your React Components
-
-For the React on Rails view helper `react_component` to use your React components, you will have to **register** them in your JavaScript code.
-
-Use modules just as you would when using Webpack and React without Rails. The difference is that instead of mounting React components directly to an element using `React.render`, you **register your components to ReactOnRails and then mount them with helpers inside of your Rails views**.
-
-This is how to expose a component to the `react_component` view helper.
-
-```javascript
-  // app/javascript/packs/hello-world-bundle.js
-  import HelloWorld from '../components/HelloWorld';
-  import ReactOnRails from 'react-on-rails';
-  ReactOnRails.register({ HelloWorld });
-```
-
-#### Different Server-Side Rendering Code (and a Server-Specific Bundle)
-
-You may want different code for your server-rendered components running server side versus client side. For example, if you have an animation that runs when a component is displayed, you might need to turn that off when server rendering. One way to handle this is conditional code like `if (window) { doClientOnlyCode() }`.
-
-Another way is to use a separate webpack configuration file that can use a different server side entry file, like  'serverRegistration.js' as opposed to 'clientRegistration.js.' That would set up different code for server rendering.
-
-For details on techniques to use different code for client and server rendering, see: [How to use different versions of a file for client and server rendering](https://forum.shakacode.com/t/how-to-use-different-versions-of-a-file-for-client-and-server-rendering/1352). (_Requires creating a free account._)
-
-## Specifying Your React Components: Register directly or use render-functions
-
-You have two ways to specify your React components. You can either register the React component (either function or class component) directly, or you can create a function that returns a React component, which we using the name of a "render-function". Creating a render-function allows:
-
-1. You to have access to the `railsContext`. See [documentation for the railsContext](https://www.shakacode.com/react-on-rails/docs/basics/render-functions-and-railscontext) in terms of why you might need it. You **need** a Render-Function to access the `railsContext`.
-2. You can use the passed-in props to initialize a redux store or set up react-router.
-3. You can return different components depending on what's in the props.
-
-Note, the return value of a **Render-Function** should be either a React Function or Class Component, or an object representing server rendering results.
-
-Do not return a React Element (JSX).
-
-ReactOnRails will automatically detect a registered Render-Function by the fact that the function takes
-more than 1 parameter. In other words, if you want the ability to provide a function that returns the
-React component, then you need to specify at least a second parameter. This is the `railsContext`.
-If you're not using this parameter, declare your function with the unused param:
-
-```js
-const MyComponentGenerator = (props, _railsContext) => {
-  if (props.print) {
-    // This is a React FunctionComponent because it is wrapped in a function.
-    return () => <H1>{JSON.stringify(props)}</H1>;
-  }
-}
-```
-
-Thus, there is no difference between registering a React Function Component or class Component versus a "Render-Function." Just call `ReactOnRails.register`.
-
-## react_component_hash for Render-Functions
-
-Another reason to use a Render-Function is that sometimes in server rendering, specifically with React Router, you need to return the result of calling ReactDOMServer.renderToString(element). You can do this by returning an object with the following shape: { renderedHtml, redirectLocation, error }. Make sure you use this function with `react_component_hash`.
-
-For server rendering, if you wish to return multiple HTML strings from a Render-Function, you may return an Object from your Render-Function with a single top-level property of `renderedHtml`. Inside this Object, place a key called `componentHtml`, along with any other needed keys. An example scenario of this is when you are using side effects libraries like [React Helmet](https://github.com/nfl/react-helmet). Your Ruby code will get this Object as a Hash containing keys componentHtml and any other custom keys that you added:
-
-```js
-{ renderedHtml: { componentHtml, customKey1, customKey2} }
-```
-
-For details on using react_component_hash with react-helmet, see [our react-helmet documentation](https://www.shakacode.com/react-on-rails/docs/additional-reading/react-helmet).
-
-## Error Handling
-
-* All errors from ReactOnRails will be of type ReactOnRails::Error.
-* Prerendering (server rendering) errors get context information for HoneyBadger and Sentry for easier debugging.
-
-## I18n
-
-React on Rails provides an option for automatic conversions of Rails `*.yml` locale files into `*.json` or `*.js*.
-See the [How to add I18n](https://www.shakacode.com/react-on-rails/docs/basics/i18n) for a summary of adding I18n.
-
-## More Details
-
-Browse the links in the [Summary Table of Contents](https://github.com/shakacode/react_on_rails/tree/master/SUMMARY.md)
-
-Here are some highly recommended next articles to read:
-
-1. [How React on Rails Works](https://www.shakacode.com/react-on-rails/docs/basics/how-react-on-rails-works)
-1. [Webpack Configuration](https://www.shakacode.com/react-on-rails/docs/basics/webpack-configuration)
+## Details
+1. [Overview](https://www.shakacode.com/react-on-rails/docs/guides/overview)
+1. [Getting Started](https://www.shakacode.com/react-on-rails/docs/guides/how-react-on-rails-works)
+1. [How React on Rails Works](https://www.shakacode.com/react-on-rails/docs/guides/how-react-on-rails-works)
+1. [Webpack Configuration](https://www.shakacode.com/react-on-rails/docs/guides/webpack-configuration)
 1. [View Helpers API](https://www.shakacode.com/react-on-rails/docs/api/view-helpers-api)
 1. [Caching and Performance: React on Rails Pro](https://www.shakacode.com/react-on-rails-pro).
-1. [Deployment](https://www.shakacode.com/react-on-rails/docs/basics/deployment).
-
-# Support
-
-[Click to join **React + Rails Slack**](https://reactrails.slack.com/join/shared_invite/enQtNjY3NTczMjczNzYxLTlmYjdiZmY3MTVlMzU2YWE0OWM0MzNiZDI0MzdkZGFiZTFkYTFkOGVjODBmOWEyYWQ3MzA2NGE1YWJjNmVlMGE).
-
-## Community Resources
-
-Please [**click to subscribe**](https://app.mailerlite.com/webforms/landing/l1d9x5) to keep in touch with Justin Gordon and [ShakaCode](http://www.shakacode.com/). I intend to send announcements of new releases of React on Rails and of our latest [blog articles](https://blog.shakacode.com) and tutorials.
-
-[![2017-01-31_14-16-56](https://cloud.githubusercontent.com/assets/1118459/22490211/f7a70418-e7bf-11e6-9bef-b3ccd715dbf8.png)](https://app.mailerlite.com/webforms/landing/l1d9x5)
+1. [Deployment](https://www.shakacode.com/react-on-rails/docs/guides/deployment).
 
-- **Slack Room**: [Contact us](mailto:contact@shakacode.com) for an invite to the ShakaCode Slack room! Let us know if you want to contribute.
-- **[forum.shakacode.com](https://forum.shakacode.com)**: Post your questions
-- **[@railsonmaui on Twitter](https://twitter.com/railsonmaui)**
-- For a live, [open source](https://github.com/shakacode/react-webpack-rails-tutorial), example of this gem, see [www.reactrails.com](http://www.reactrails.com).
-- See [Projects](https://github.com/shakacode/react_on_rails/tree/master/PROJECTS.md) using and [KUDOS](https://github.com/shakacode/react_on_rails/tree/master/KUDOS.md) for React on Rails. Please submit yours! Please edit either page or [email us](mailto:contact@shakacode.com) and we'll add your info. We also **love stars** as it helps us attract new users and contributors.
-- *See [NEWS.md](https://github.com/shakacode/react_on_rails/tree/master/NEWS.md) for more notes over time.*
+## Changes and Upgrades
+1. [CHANGELOG.md](https://github.com/shakacode/react_on_rails/tree/master/CHANGELOG.md)
+2. [Upgrading React on Rails](https://www.shakacode.com/react-on-rails/docs/guides/upgrading-react-on-rails#upgrading-to-v12).
 
-## Contributing
-
-Bug reports and pull requests are welcome. See [Contributing](https://github.com/shakacode/react_on_rails/tree/master/CONTRIBUTING.md) to get started, and the [list of help wanted issues](https://github.com/shakacode/react_on_rails/labels/contributions%3A%20up%20for%20grabs%21).
-
-## React on Rails Pro
-
-React on Rails Pro provides Node server rendering, fragment caching, code-splitting, and other performance enhancements for React on Rails. For a case study, see the article [HVMN’s 90% Reduction in Server Response Time from React on Rails Pro](https://blog.shakacode.com/hvmns-90-reduction-in-server-response-time-from-react-on-rails-pro-eb08226687db). The [Wiki](https://github.com/shakacode/react_on_rails/wiki) contains more details.
-
-[![2018-09-11_10-31-11](https://user-images.githubusercontent.com/1118459/45467845-5bcc7400-b6bd-11e8-91e1-e0cf806d4ea4.png)](https://blog.shakacode.com/hvmns-90-reduction-in-server-response-time-from-react-on-rails-pro-eb08226687db)
-
-## React on Rails Pro Support
-
-The [React on Rails Pro Support Plan](https://www.shakacode.com/react-on-rails-pro) can help!
-
-* Optimizing your webpack setup to the latest Webpack for React on Rails including code splitting with loadable-components.
-* Upgrading your app to use the current `rails/webpacker` setup that skips the Sprockets asset pipeline.
-* Better performance client and server side.
-* Best practices based on over 6 years of React on Rails experience on many production projects.
-* Using [Reason](https://reasonml.github.io/) with (or without) React on Rails.
-
-ShakaCode can also help you with your custom software development needs. We specialize in marketplace and e-commerce applications that utilize both Rails and React. Because we own [HiChee.com](https://hichee.com), we can leverage that code for your app!
-
-Please email Justin Gordon [justin@shakacode.com](mailto:justin@shakacode.com), the maintainer of React on Rails, for more information.
-
-### Fragment Caching
-
-Fragment caching is a [React on Rails Pro](https://www.shakacode.com/react-on-rails-pro) feature. Fragment caching is a **HUGE** performance booster for your apps. Use the `cached_react_component` and `cached_react_component_hash`. The API is the same as `react_component` and `react_component_hash`, but for 2 differences:
-
-1. The `cache_key` takes the same parameters as any Rails `cache` view helper.
-1. The **props** are passed via a block so that evaluation of the props is not done unless the cache is broken. Suppose you put your props calculation into some method called `some_slow_method_that_returns_props`:
-
-```ruby
-<%= cached_react_component("App", cache_key: [@user, @post], prerender: true) do
-  some_slow_method_that_returns_props
-end %>
-```
-
-Such fragment caching saves CPU work for your web server and greatly reduces the request time. It completely skips the evaluation costs of:
-
-1. Database calls to compute the props.
-2. Serialization the props values hash into a JSON string for evaluating JavaScript to server render.
-3. Costs associated with evaluating JavaScript from your Ruby code.
-4. Creating the HTML string containing the props and the server-rendered JavaScript code.
-
-Note, even without server rendering (without step 3 above), fragment caching is still effective.
-
-## Integration with Node.js for Server Rendering
-
-Default server rendering is done by ExecJS. If you want to use a Node.js server for better performing server rendering, [email justin@shakacode.com](mailto:justin@shakacode.com). ShakaCode has built a premium Node rendering server that is part of [React on Rails Pro](https://www.shakacode.com/react-on-rails-pro).
-
-## Testimonials for ShakaCode
-[HVMN Testimonial, by Paul Benigeri, October 12, 2018](https://www.shakacode.com/react-on-rails/docs/testimonials/hvmn)
-> The price we paid for the consultation + the React on Rails pro license has already been made back a couple of times from hosting fees alone. The entire process was super hands off, and our core team was able to focus on shipping new feature during that sprint.
-
-[ResortPass Testimonial, by Leora Juster, December 10, 2018](https://www.shakacode.com/react-on-rails/docs/testimonials/resortpass)
-
-> Justin and his team were instrumental in assisting us in setting design foundations and standards for our transition to a react on rails application. Just three months of work with the team at Shaka code and we have a main page of our application server-side rendering at exponentially improved speeds.
-
-From Joel Hooks, Co-Founder, Chief Nerd at [egghead.io](https://egghead.io/), January 30, 2017:
-
-![2017-01-30_11-33-59](https://cloud.githubusercontent.com/assets/1118459/22443635/b3549fb4-e6e3-11e6-8ea2-6f589dc93ed3.png)
-
-For more testimonials, see [Live Projects](https://github.com/shakacode/react_on_rails/tree/master/PROJECTS.md) and [Kudos](https://github.com/shakacode/react_on_rails/tree/master/KUDOS.md).
-
-# Supporters
-
-The following companies support this open source project, and ShakaCode uses their products! Justin writes React on Rails on [RubyMine](https://www.jetbrains.com/ruby/). We use [Scout](https://scoutapp.com/) to monitor the live performance of [HawaiiChee.com](https://www.hawaiichee.com), [BrowserStack](https://www.browserstack.com) to solve problems with oddball browsers, and [CodersRank](https://codersrank.io/) to find candidates for our team.
-
-[![2019-09-24_17-48-00](https://user-images.githubusercontent.com/1118459/65567887-96353780-def3-11e9-926d-4a55e2e186ff.png)](https://www.jetbrains.com/ruby/)
-[![Scout](https://user-images.githubusercontent.com/1118459/41828269-106b40f8-77d0-11e8-8d19-9c4b167ef9d8.png)](https://scoutapp.com/)
-[![BrowserStack](https://cloud.githubusercontent.com/assets/1118459/23203304/1261e468-f886-11e6-819e-93b1a3f17da4.png)](https://www.browserstack.com)
-[![CodersRank](https://user-images.githubusercontent.com/1118459/55040254-ad8a7b00-4fcb-11e9-8936-c6765eb30698.png)](https://codersrank.io/?utm_source=github&utm_medium=banner&utm_campaign=shakacode)
-
-## Clubhouse
-I've just moved ShakaCode's development to [ClubHouse](https://clubhouse.io/) from Trello. We're going to be doing this with all our projects. If you want to **try ClubHouse and get 2 months free beyond the 14-day trial period**, click [here to use ShakaCode's referral code](http://r.clbh.se/mvfoNeH). We're participating in their awesome triple-sided referral program, which you can read about [here](https://clubhouse.io/blog/clubhouse-referral-program-5f614bb437c3). By using our [referral code](http://r.clbh.se/mvfoNeH) you'll be supporting ShakaCode and, thus, React on Rails!
-
-*If you'd like to support React on Rails and have your company listed here, [get in touch](mailto:justin@shakacode.com).*
-
-Aloha and best wishes from Justin and the ShakaCode team!
-
-# Work with Us
-ShakaCode is **[currently looking to hire](http://www.shakacode.com/about/#work-with-us)** like-minded, remote-first, developers that wish to work on our projects, including [Hawaii Chee](https://www.hawaiichee.com). Your main coding interview will be pairing with us on our open source! We're also using [ReasonML](https://reasonml.github.io/) extensively!
-
-# License
+## Example Apps
+1. [spec/dummy](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy) example repo for a simple configuration of webpack via the rails/webpacker gem
+that supports SSR.
+2. Example repo of [React on Rails Tutorial With SSR, HMR fast refresh, and TypeScript](https://github.com/shakacode/react_on_rails_tutorial_with_ssr_and_hmr_fast_refresh) for a new way to setup the creation of your SSR bundle with `rails/webpacker`.
+3. Live, [open source](https://github.com/shakacode/react-webpack-rails-tutorial), example of this gem, see [reactrails.com](http://reactrails.com).
 
-The gem is available as open source under the terms of the [MIT License](https://github.com/shakacode/react_on_rails/tree/master/LICENSE.md).
+# Other Resources 
+1. RailsConf 2020 talk: [Webpacker, It-Just-Works, But How?](http://railsconf.com/2020/video/justin-gordon-webpacker-it-just-works-but-how)
diff --git a/docs/misc/articles.md b/docs/misc/articles.md
index c14c124637..c68de58a78 100644
--- a/docs/misc/articles.md
+++ b/docs/misc/articles.md
@@ -6,7 +6,7 @@
 * [Webpacker Lite: Why Fork Webpacker?](https://blog.shakacode.com/webpacker-lite-why-fork-webpacker-f0a7707fac92)
 * [React on Rails, 2000+ 🌟 Stars](https://medium.com/shakacode/react-on-rails-2000-stars-32ff5cfacfbf#.6gmfb2gpy)
 * [The React on Rails Doctrine](https://medium.com/@railsonmaui/the-react-on-rails-doctrine-3c59a778c724)
-* [Simple Tutorial](https://www.shakacode.com/react-on-rails/docs/basics/tutorial).
+* [Simple Tutorial](https://www.shakacode.com/react-on-rails/docs/guides/tutorial).
 
 ## Videos
 
diff --git a/docs/rails/convert-rails-5-api-only-app.md b/docs/rails/convert-rails-5-api-only-app.md
index 340448ce85..08c2bf3356 100644
--- a/docs/rails/convert-rails-5-api-only-app.md
+++ b/docs/rails/convert-rails-5-api-only-app.md
@@ -16,4 +16,4 @@ Rails will start creating the app and will skip the files you have already creat
 3. If it is removeing some of your code then press "n" and add all additions manually
 ```
 
-3. Run `bundle install` and follow [the instructions for installing into an existing Rails app](https://www.shakacode.com/react-on-rails/docs/basics/installation-into-an-existing-rails-app)
+3. Run `bundle install` and follow [the instructions for installing into an existing Rails app](https://www.shakacode.com/react-on-rails/docs/guides/installation-into-an-existing-rails-app)
diff --git a/docs/react-on-rails-pro/react-on-rails-pro.md b/docs/react-on-rails-pro/react-on-rails-pro.md
new file mode 100644
index 0000000000..a54905eac6
--- /dev/null
+++ b/docs/react-on-rails-pro/react-on-rails-pro.md
@@ -0,0 +1,43 @@
+## React on Rails Pro
+
+Support React on Rails development [by becoming a Github sponsor](https://github.com/sponsors/shakacode) and get these benefits:
+
+1. 1-hour per month of support via Slack, PR reviews, and Zoom for React on Rails,
+   React-Rails, rails/webpacker, ReScript (ReasonML), TypeScript, Rust, etc.
+2. React on Rails Pro Software that extends React on Rails with Node server rendering,
+   fragment caching, code-splitting, and other performance enhancements for React on Rails.
+
+See the [React on Rails Pro Support Plan](https://www.shakacode.com/react-on-rails-pro).
+
+ShakaCode can also help you with your custom software development needs. We specialize in
+marketplace and e-commerce applications that utilize both Rails and React.
+Because we own [HiChee.com](https://hichee.com), we can leverage that code for your app!
+
+Please email Justin Gordon [justin@shakacode.com](mailto:justin@shakacode.com), the
+maintainer of React on Rails, for more information.
+
+### Pro: Fragment Caching
+
+Fragment caching is a [React on Rails Pro](https://www.shakacode.com/react-on-rails-pro) feature. Fragment caching is a **HUGE** performance booster for your apps. Use the `cached_react_component` and `cached_react_component_hash`. The API is the same as `react_component` and `react_component_hash`, but for 2 differences:
+
+1. The `cache_key` takes the same parameters as any Rails `cache` view helper.
+1. The **props** are passed via a block so that evaluation of the props is not done unless the cache is broken. Suppose you put your props calculation into some method called `some_slow_method_that_returns_props`:
+
+```ruby
+<%= cached_react_component("App", cache_key: [@user, @post], prerender: true) do
+  some_slow_method_that_returns_props
+end %>
+```
+
+Such fragment caching saves CPU work for your web server and greatly reduces the request time. It completely skips the evaluation costs of:
+
+1. Database calls to compute the props.
+2. Serialization the props values hash into a JSON string for evaluating JavaScript to server render.
+3. Costs associated with evaluating JavaScript from your Ruby code.
+4. Creating the HTML string containing the props and the server-rendered JavaScript code.
+
+Note, even without server rendering (without step 3 above), fragment caching is still effective.
+
+### Pro: Integration with Node.js for Server Rendering
+
+Default server rendering is done by ExecJS. If you want to use a Node.js server for better performing server rendering, [email justin@shakacode.com](mailto:justin@shakacode.com). ShakaCode has built a premium Node rendering server that is part of [React on Rails Pro](https://www.shakacode.com/react-on-rails-pro).
diff --git a/spec/dummy/README.md b/spec/dummy/README.md
index a626fdefa8..17db52367c 100644
--- a/spec/dummy/README.md
+++ b/spec/dummy/README.md
@@ -25,16 +25,15 @@ yarn run dummy:install
 ## Hot Reloading of Rails Assets
 
 ```sh
-foreman start -f Procfile.hot
+foreman start -f Procfile.dev
 ```
 
 ## Static Loading of Rails Assets
 ```sh
-foreman start -f Procfile.dev
+foreman start -f Procfile.dev-static
 ```
 
 ## Creating Assets for Tests
 ```sh
 foreman start -f Procfile.spec
 ```
-

From a342e00ef3f976fa1f20cb41fdb2b9bdb9d5b2b7 Mon Sep 17 00:00:00 2001
From: Judah Meek <judah.meek@gmail.com>
Date: Tue, 13 Apr 2021 17:11:20 -0500
Subject: [PATCH 2/4] linting fixes

---
 lib/react_on_rails/locales/base.rb | 19 +++++++------------
 1 file changed, 7 insertions(+), 12 deletions(-)

diff --git a/lib/react_on_rails/locales/base.rb b/lib/react_on_rails/locales/base.rb
index 2f2577e161..ee43f977bd 100644
--- a/lib/react_on_rails/locales/base.rb
+++ b/lib/react_on_rails/locales/base.rb
@@ -54,18 +54,13 @@ def file(name)
       end
 
       def locale_files
-        # rubocop:disable Layout/IndentationWidth, Style/RedundantBegin
-        @locale_files ||= begin
-                            if i18n_yml_dir.present?
-                              Dir["#{i18n_yml_dir}/**/*.yml"]
-                            else
-                             ReactOnRails::Utils.truthy_presence(
-                               Rails.application && Rails.application.config.i18n.load_path
-                             ).presence
-                            end
-        end
-
-        # rubocop:enable Layout/IndentationWidth, Style/RedundantBegin
+        @locale_files ||= if i18n_yml_dir.present?
+                            Dir["#{i18n_yml_dir}/**/*.yml"]
+                          else
+                            ReactOnRails::Utils.truthy_presence(
+                              Rails.application && Rails.application.config.i18n.load_path
+                            ).presence
+                          end
       end
 
       def i18n_dir

From 0b3429073cedee8b6a25afbb7392d5fd5331672e Mon Sep 17 00:00:00 2001
From: Judah Meek <judah.meek@gmail.com>
Date: Wed, 18 Aug 2021 01:05:06 -0500
Subject: [PATCH 3/4] link corrections

---
 CHANGELOG.md                                  | 28 +++++++++----------
 README.md                                     |  4 +--
 ...ally-server-render-based-on-device-type.md |  8 +++---
 ...installation-into-an-existing-rails-app.md |  2 +-
 ...overview.md => react-on-rails-overview.md} |  0
 docs/home.md                                  |  6 ++--
 6 files changed, 24 insertions(+), 24 deletions(-)
 rename docs/guides/{reat-on-rails-overview.md => react-on-rails-overview.md} (100%)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 5b75cb689a..004cd63f94 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,7 +1,7 @@
 # Change Log
 All notable changes to this project's source code will be documented in this file. Items under `Unreleased` is upcoming features that will be out in next version. NOTE: major versions of the npm module and the gem must be kept in sync.
 
-Migration instructions for the major updates can be found [here](docs/guides/upgrading-react-on-rails.md#upgrading-to-version-9.md). Some smaller migration information can be found here.
+Migration instructions for the major updates can be found [here](https://www.shakacode.com/react-on-rails/docs/guides/upgrading-react-on-rails#upgrading-to-version-9.md). Some smaller migration information can be found here.
 
 ## Need Help Migrating?
 If you would like help in migrating between React on Rails versions or help with implementing server rendering, please contact [justin@shakacode.com](mailto:justin@shakacode.com) for information about our [React on Rails Pro Support Options](https://www.shakacode.com/react-on-rails-pro).
@@ -32,7 +32,7 @@ Changes since last non-beta release.
 
 ### [12.1.0] - 2021-03-23
 #### Added
-- Added the ability to assign a module with a `call` method to `config.build_production_command`. See [the configuration docs](./docs/guides/configuration.md). [PR 1362: Accept custom module for config.build_production_command](https://github.com/shakacode/react_on_rails/pull/1362).
+- Added the ability to assign a module with a `call` method to `config.build_production_command`. See [the configuration docs](https://www.shakacode.com/react-on-rails/docs/guides/configuration). [PR 1362: Accept custom module for config.build_production_command](https://github.com/shakacode/react_on_rails/pull/1362).
 
 #### Fixed
 - Stop setting NODE_ENV value during precompile, as it interferred with rails/webpacker's setting of NODE_ENV to production by default. Fixes [#1334](https://github.com/shakacode/react_on_rails/issues/1334). [PR 1356: Don't set NODE_ENV in assets.rake](https://github.com/shakacode/react_on_rails/pull/1356) by [alexrozanski](https://github.com/alexrozanski).
@@ -58,7 +58,7 @@ Changes since last non-beta release.
 - Changed invocation of webpacker:clean to use a very large number of versions so it does not acidentally delete the server-bundle.js. [PR 1306](https://github.com/shakacode/react_on_rails/pull/1306) by By [justin808](https://github.com/justin808).
 
 ### [12.0.0] - 2020-07-08
-For upgrade instructions, see [docs/basics/upgrading-react-on-rails.md](./docs/guides/upgrading-react-on-rails.md).
+For upgrade instructions, see [docs/guides/upgrading-react-on-rails.md](https://www.shakacode.com/react-on-rails/docs/guides/upgrading-react-on-rails).
 
 #### Major Improvements
 1. **React Hooks Support** for top level components
@@ -74,7 +74,7 @@ set JavaScript property `renderFunction` on the function for which you want to r
 invoked to return the React component. In that case, you won't need to pass any unused params.
 [PR 1268](https://github.com/shakacode/react_on_rails/pull/1268) by [justin808](https://github.com/justin808)
 
-See [docs/basics/upgrading-react-on-rails](./docs/guides/upgrading-react-on-rails.md#upgrading-to-v12)
+See [docs/guides/upgrading-react-on-rails](https://www.shakacode.com/react-on-rails/docs/guides/upgrading-react-on-rails#upgrading-to-v12)
 for details.         
 
 #### Other Updates
@@ -343,7 +343,7 @@ Updated React on Rails to depend on [rails/webpacker](https://github.com/rails/w
 
 
 #### 9.0 from 8.x. Upgrade Instructions
-Moved to [our documentation](docs/guides/upgrading-react-on-rails.md#upgrading-to-version-9).
+Moved to [our documentation](https://www.shakacode.com/react-on-rails/docs/guides/upgrading-react-on-rails#upgrading-to-version-9).
 
 ### [8.0.7] - 2017-08-16
 #### Fixed
@@ -693,7 +693,7 @@ Here is the addition to the generated config file:
 ## [5.2.0] - 2016-04-08
 ##### Added
 - Support for React 15.0 to react_on_rails. See [#379](https://github.com/shakacode/react_on_rails/pull/379) by [brucek](https://github.com/brucek).
-- Support for Node.js server side rendering. See [#380](https://github.com/shakacode/react_on_rails/pull/380) by [alleycat](https://github.com/alleycat-at-git) and [doc](https://github.com/shakacode/react_on_rails/blob/master/docs/additional-reading/node-server-rendering.md)
+- Support for Node.js server side rendering. See [#380](https://github.com/shakacode/react_on_rails/pull/380) by [alleycat](https://github.com/alleycat-at-git) and [doc](https://www.shakacode.com/react-on-rails/docs/react-on-rails-pro/react-on-rails-pro#pro-integration-with-nodejs-for-server-rendering)
 
 ##### Removed
 - Generator removals to simplify installer. See [#364](https://github.com/shakacode/react_on_rails/pull/364) by [jbhatab](https://github.com/jbhatab).
@@ -826,11 +826,11 @@ All 5.1.0 changes can be found in [#362](https://github.com/shakacode/react_on_r
   <%= react_component("ReduxSharedStoreApp", props: {}, prerender: false, trace: true) %>
   ```
   You'll get a deprecation message to change this.
-- Renamed `ReactOnRails.configure_rspec_to_compile_assets` to `ReactOnRails::TestHelper.configure_rspec_to_compile_assets`. The code has also been optimized to check for whether or not the compiled webpack bundles are up to date or not and will not run if not necessary. If you are using non-standard directories for your generated webpack assets (`app/assets/javascripts/generated` and `app/assets/stylesheets/generated`) or have additional directories you wish the helper to check, you need to update your ReactOnRails configuration accordingly. See [documentation](https://github.com/shakacode/react_on_rails/blob/master/docs/additional-reading/rspec_configuration.md) for how to do this.  [#253](https://github.com/shakacode/react_on_rails/pull/253).
+- Renamed `ReactOnRails.configure_rspec_to_compile_assets` to `ReactOnRails::TestHelper.configure_rspec_to_compile_assets`. The code has also been optimized to check for whether or not the compiled webpack bundles are up to date or not and will not run if not necessary. If you are using non-standard directories for your generated webpack assets (`app/assets/javascripts/generated` and `app/assets/stylesheets/generated`) or have additional directories you wish the helper to check, you need to update your ReactOnRails configuration accordingly. See [documentation](https://www.shakacode.com/react-on-rails/docs/guides/rspec_configuration) for how to do this.  [#253](https://github.com/shakacode/react_on_rails/pull/253).
 - You have to call `ReactOnRails.register` to register react components. This was deprecated in v2. [#273](https://github.com/shakacode/react_on_rails/pull/273).
 
 ##### Migration Steps v2 to v3
-- [spec/dummy/spec/rails_helper.rb](https://github.com/shakacode/react_on_rails/blob/master/spec%2Fdummy%2Fspec%2Frails_helper.rb#L36..38) for an example. Add this line to your `rails_helper.rb`:
+- See [these changes of spec/dummy/spec/rails_helper.rb](https://github.com/shakacode/react_on_rails/blob/master/spec/dummy/spec/rails_helper.rb#L36..38) for an example. Add this line to your `rails_helper.rb`:
 ```ruby
 RSpec.configure do |config|
   # Ensure that if we are running js tests, we are using latest webpack assets
@@ -846,7 +846,7 @@ RSpec.configure do |config|
 
 ## [2.2.0] - 2016-01-29
 ##### Added
-- New JavaScript API for debugging TurboLinks issues. Be sure to see [turbolinks docs](docs/additional-reading/turbolinks.md). `ReactOnRails.setOptions({ traceTurbolinks: true });`. Removed the file `debug_turbolinks` added in 2.1.1. See [#243](https://github.com/shakacode/react_on_rails/pull/243).
+- New JavaScript API for debugging TurboLinks issues. Be sure to see [turbolinks docs](https://www.shakacode.com/react-on-rails/docs/rails/turbolinks). `ReactOnRails.setOptions({ traceTurbolinks: true });`. Removed the file `debug_turbolinks` added in 2.1.1. See [#243](https://github.com/shakacode/react_on_rails/pull/243).
 
 ## [2.1.1] - 2016-01-28
 
@@ -855,21 +855,21 @@ RSpec.configure do |config|
 
 ##### Added
 - `ReactOnRails.render` returns a virtualDomElement Reference to your React component's backing instance. See [#234](https://github.com/shakacode/react_on_rails/pull/234).
-- `debug_turbolinks` helper for debugging turbolinks issues. See [turbolinks](docs/additional-reading/turbolinks.md).
+- `debug_turbolinks` helper for debugging turbolinks issues. See [turbolinks](https://www.shakacode.com/react-on-rails/docs/rails/turbolinks).
 - Enhanced regression testing for non-turbolinks apps. Runs all tests for dummy app with turbolinks both disabled and enabled.
 
 ## [2.1.0] - 2016-01-26
 ##### Added
-- Added EnsureAssetsCompiled feature so that you do not accidentally run tests without properly compiling the JavaScript bundles. Add a line to your `rails_helper.rb` file to check that the latest Webpack bundles have been generated prior to running tests that may depend on your client-side code. See [docs](docs/additional-reading/rspec_configuration.md) for more detailed instructions. [#222](https://github.com/shakacode/react_on_rails/pull/222)
-- Added [migration guide](https://github.com/shakacode/react_on_rails#migrate-from-react-rails) for migrating from React-Rails. [#219](https://github.com/shakacode/react_on_rails/pull/219)
-- Added [React on Rails Doctrine](docs/doctrine.md) to docs. Discusses the project's motivations, conventions, and principles. [#220](https://github.com/shakacode/react_on_rails/pull/220)
+- Added EnsureAssetsCompiled feature so that you do not accidentally run tests without properly compiling the JavaScript bundles. Add a line to your `rails_helper.rb` file to check that the latest Webpack bundles have been generated prior to running tests that may depend on your client-side code. See [docs](https://www.shakacode.com/react-on-rails/docs/guides/rspec_configuration) for more detailed instructions. [#222](https://github.com/shakacode/react_on_rails/pull/222)
+- Added [migration guide](https://www.shakacode.com/react-on-rails/docs/additional-details/migrating-from-react-rails) for migrating from React-Rails. [#219](https://github.com/shakacode/react_on_rails/pull/219)
+- Added [React on Rails Doctrine](https://www.shakacode.com/react-on-rails/docs/misc/doctrine) to docs. Discusses the project's motivations, conventions, and principles. [#220](https://github.com/shakacode/react_on_rails/pull/220)
 - Added ability to skip `display:none` style in the generated content tag for a component. Some developers may want to disable inline styles for security reasons. See generated config [initializer file](lib/generators/react_on_rails/templates/base/base/config/initializers/react_on_rails.rb#L27) for example on setting `skip_display_none`. [#218](https://github.com/shakacode/react_on_rails/pull/218)
 
 ##### Changed
 - Changed message when running the dev (a.k.a. "express" server). [#227](https://github.com/shakacode/react_on_rails/commit/543ae70254d0c7b477e2c92af86f40746e58a431)
 
 ##### Fixed
-- Fixed handling of Turbolinks. Code was checking that Turbolinks was installed when it was not yet because some setups load Turbolinks after the bundles. The changes to the code will check if Turbolinks is installed after the page loaded event fires. Code was also added to allow easy debugging of Turbolinks, which should be useful when v5 of Turbolinks is released shortly. Details of how to configure Turbolinks with troubleshooting were added to docs/additional-reading/turbolinks.md. [#221](https://github.com/shakacode/react_on_rails/pull/221)
+- Fixed handling of Turbolinks. Code was checking that Turbolinks was installed when it was not yet because some setups load Turbolinks after the bundles. The changes to the code will check if Turbolinks is installed after the page loaded event fires. Code was also added to allow easy debugging of Turbolinks, which should be useful when v5 of Turbolinks is released shortly. Details of how to configure Turbolinks with troubleshooting were added to `docs` directory. [#221](https://github.com/shakacode/react_on_rails/pull/221)
 - Fixed issue with already initialized constant warning appearing when starting a Rails server [#226](https://github.com/shakacode/react_on_rails/pull/226)
 - Fixed to make backwards compatible with Ruby v2.0 and updated all Ruby and Node dependencies.
 
diff --git a/README.md b/README.md
index d08a21a933..535f4647ea 100644
--- a/README.md
+++ b/README.md
@@ -41,11 +41,11 @@ Given that `rails/webpacker` gem already provides basic React integration, why w
 1. Tight integration with [rails/webpacker](https://github.com/rails/webpacker).
 1. Server-Side Rendering (SSR), often used for SEO crawler indexing and UX performance, is not offered by `rails/webpacker`.
 1. [Redux](https://github.com/reactjs/redux) and [React Router](https://github.com/ReactTraining/react-router#readme) integration with server-side-rendering.
-1. [Internationalization (I18n) and (localization)](https://www.shakacode.com/react-on-rails/docs/basics/i18n)
+1. [Internationalization (I18n) and (localization)](https://www.shakacode.com/react-on-rails/docs/guides/i18n)
 1. A supportive community. This [web search shows how live public sites are using React on Rails](https://publicwww.com/websites/%22react-on-rails%22++-undeveloped.com+depth%3Aall/).
 1. [Reason ML Support](https://github.com/shakacode/reason-react-on-rails-example).
 
-See [Rails/Webpacker React Integration Options](docs/guides/rails-webpacker-react-integration-options.md) for comparisons to other gems.
+See [Rails/Webpacker React Integration Options](https://www.shakacode.com/react-on-rails/docs/guides/rails-webpacker-react-integration-options.md) for comparisons to other gems.
 
 See the [react-webpack-rails-tutorial](https://github.com/shakacode/react-webpack-rails-tutorial) for an example of a live implementation and code.
 
diff --git a/docs/guides/how-to-conditionally-server-render-based-on-device-type.md b/docs/guides/how-to-conditionally-server-render-based-on-device-type.md
index 4384b50375..78ab713fcb 100644
--- a/docs/guides/how-to-conditionally-server-render-based-on-device-type.md
+++ b/docs/guides/how-to-conditionally-server-render-based-on-device-type.md
@@ -1,4 +1,4 @@
-# How to conditionally render server side based on the device type 
+# How to conditionally render server side based on the device type
 
 In general, we want to use CSS to do mobile responsive layouts.
 
@@ -27,13 +27,13 @@ end
 # Shown below are the defaults for configuration
 ReactOnRails.configure do |config|
   # See https://github.com/shakacode/react_on_rails/blob/master/docs/guides/configuration.md for the rest
- 
+
   # This allows you to add additional values to the Rails Context. Implement one static method
   # called `custom_context(view_context)` and return a Hash.
   config.rendering_extension = RenderingExtension
 end
 ```
 
-Note, full details of the React on Rails confguration are [here in docs/basics/configuration.md](https://github.com/shakacode/react_on_rails/blob/master/docs/guides/configuration.md).
+Note, full details of the React on Rails confguration are [here in docs/basics/configuration.md](https://shakacode.com/react_on_rails/docs/guides/configuration).
 
-See the doc file [docs/basics/generator-functions-and-railscontext.md](https://github.com/shakacode/react_on_rails/blob/master/docs/guides/generator-functions-and-railscontext.md#rails-context) for how your client-side code uses the device information
+See the doc file [docs/basics/generator-functions-and-railscontext.md](https://shakacode.com/react_on_rails/docs/guides/generator-functions-and-railscontext#rails-context) for how your client-side code uses the device information
diff --git a/docs/guides/installation-into-an-existing-rails-app.md b/docs/guides/installation-into-an-existing-rails-app.md
index 8d602a5c7f..4ae9540297 100644
--- a/docs/guides/installation-into-an-existing-rails-app.md
+++ b/docs/guides/installation-into-an-existing-rails-app.md
@@ -2,7 +2,7 @@
 
 **Also consult the instructions for installing on a fresh Rails app**, see the [React on Rails Basic Tutorial](https://www.shakacode.com/react-on-rails/docs/guides/tutorial).
 
-**If you have rails-5 API only project**, first [convert the rails-5 API only app to rails app](#convert-rails-5-api-only-app-to-rails-app) before [getting started](#getting-started-with-an-existing-rails-app).
+**If you have rails-5 API only project**, first [convert the rails-5 API only app to rails app](https://www.shakacode.com/react-on-rails/docs/rails/convert-rails-5-api-only-app-to-rails-app).
 
 1. Add the following to your Gemfile and `bundle install`. We recommend fixing the version of React on Rails, as you will need to keep the exact version in sync with the version in your `package.json` file.
 
diff --git a/docs/guides/reat-on-rails-overview.md b/docs/guides/react-on-rails-overview.md
similarity index 100%
rename from docs/guides/reat-on-rails-overview.md
rename to docs/guides/react-on-rails-overview.md
diff --git a/docs/home.md b/docs/home.md
index 55f605646b..25aa9c0150 100644
--- a/docs/home.md
+++ b/docs/home.md
@@ -1,8 +1,8 @@
 # React on Rails
 
 ## Details
-1. [Overview](https://www.shakacode.com/react-on-rails/docs/guides/overview)
-1. [Getting Started](https://www.shakacode.com/react-on-rails/docs/guides/how-react-on-rails-works)
+1. [Overview](https://www.shakacode.com/react-on-rails/docs/guides/react-on-rails-overview)
+1. [Getting Started](https://www.shakacode.com/react-on-rails/docs/guides/getting-started)
 1. [How React on Rails Works](https://www.shakacode.com/react-on-rails/docs/guides/how-react-on-rails-works)
 1. [Webpack Configuration](https://www.shakacode.com/react-on-rails/docs/guides/webpack-configuration)
 1. [View Helpers API](https://www.shakacode.com/react-on-rails/docs/api/view-helpers-api)
@@ -19,5 +19,5 @@ that supports SSR.
 2. Example repo of [React on Rails Tutorial With SSR, HMR fast refresh, and TypeScript](https://github.com/shakacode/react_on_rails_tutorial_with_ssr_and_hmr_fast_refresh) for a new way to setup the creation of your SSR bundle with `rails/webpacker`.
 3. Live, [open source](https://github.com/shakacode/react-webpack-rails-tutorial), example of this gem, see [reactrails.com](http://reactrails.com).
 
-# Other Resources 
+# Other Resources
 1. RailsConf 2020 talk: [Webpacker, It-Just-Works, But How?](http://railsconf.com/2020/video/justin-gordon-webpacker-it-just-works-but-how)

From 6dc871f4a0640ca6ccdf4cf78d903f014f746238 Mon Sep 17 00:00:00 2001
From: Judah Meek <judah.meek@gmail.com>
Date: Wed, 18 Aug 2021 11:41:47 -0500
Subject: [PATCH 4/4] per review

---
 README.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index 535f4647ea..9cacd35e2b 100644
--- a/README.md
+++ b/README.md
@@ -45,7 +45,7 @@ Given that `rails/webpacker` gem already provides basic React integration, why w
 1. A supportive community. This [web search shows how live public sites are using React on Rails](https://publicwww.com/websites/%22react-on-rails%22++-undeveloped.com+depth%3Aall/).
 1. [Reason ML Support](https://github.com/shakacode/reason-react-on-rails-example).
 
-See [Rails/Webpacker React Integration Options](https://www.shakacode.com/react-on-rails/docs/guides/rails-webpacker-react-integration-options.md) for comparisons to other gems.
+See [Rails/Webpacker React Integration Options](https://www.shakacode.com/react-on-rails/docs/guides/rails-webpacker-react-integration-options) for comparisons to other gems.
 
 See the [react-webpack-rails-tutorial](https://github.com/shakacode/react-webpack-rails-tutorial) for an example of a live implementation and code.
 
@@ -83,7 +83,7 @@ The following companies support this open source project, and ShakaCode uses the
 [![Rails AutoScale](https://user-images.githubusercontent.com/1118459/103197530-48dc0e80-488a-11eb-8b1b-a16664b30274.png)](https://railsautoscale.com/)
 [![BrowserStack](https://cloud.githubusercontent.com/assets/1118459/23203304/1261e468-f886-11e6-819e-93b1a3f17da4.png)](https://www.browserstack.com)
 [![HoneyBadger](https://user-images.githubusercontent.com/1118459/114100696-63962a00-9860-11eb-8ac1-75ca02856d8e.png)](https://www.honeybadger.io/)
-[![StatusHero](https://user-images.githubusercontent.com/1118459/114100685-5ed17600-9860-11eb-839a-e335f335462a.png)](https://statushero.com/)
+[![StatusHero](https://user-images.githubusercontent.com/1118459/126868048-3fe64e54-4d6d-4066-9df2-8cf6fbaeb314.png)](https://statushero.com/)
 
 ShakaCode's favorite project tracking tool is [ClubHouse](https://clubhouse.io/). If you want to **try ClubHouse and get 2 months free beyond the 14-day trial period**, click [here to use ShakaCode's referral code](http://r.clbh.se/mvfoNeH). We're participating in their awesome triple-sided referral program, which you can read about [here](https://clubhouse.io/referral/). By using our [referral code](http://r.clbh.se/mvfoNeH) you'll be supporting ShakaCode and, thus, React on Rails!