Skip to content

Replace all possible links with relative links #1747

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Jul 16, 2025
Merged
Show file tree
Hide file tree
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion docs/additional-details/generator-details.md
Original file line number Diff line number Diff line change
Expand Up @@ -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/guides/tutorial/).
Another good option is to create a simple test app per the [Tutorial](../guides/tutorial.md).

# Understanding the Organization of the Generated Client Code

Expand Down
4 changes: 2 additions & 2 deletions docs/additional-details/manual-installation-overview.md
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ The only requirements within this directory for basic React on Rails integration
1. Your Webpack configuration files:
1. Create outputs in a directory like `/public/webpack`, which is customizable in your `config/initializers/react_on_rails.rb`.
1. Provide server rendering if you wish to use that feature.
1. Your JavaScript code "registers" any components and stores per the ReactOnRails APIs of ReactOnRails.register(components) and ReactOnRails.registerStore(stores). See [our javascript API docs](https://www.shakacode.com/react-on-rails/docs/api/javascript-api/) and the [ReactOnRails.js source](https://github.com/shakacode/react_on_rails/tree/master/node_package/src/ReactOnRails.js).
1. Your JavaScript code "registers" any components and stores per the ReactOnRails APIs of ReactOnRails.register(components) and ReactOnRails.registerStore(stores). See [our javascript API docs](../api/javascript-api.md) and the [ReactOnRails.js source](https://github.com/shakacode/react_on_rails/tree/master/node_package/src/ReactOnRails.js).
1. Set your registration file as an "entry" point in your Webpack configs.
1. Configure scripts in `client/package.json` as shown in the example apps. These are used for building your Webpack assets. Also do this for your top-level `package.json`.

Expand All @@ -23,6 +23,6 @@ The only requirements within this directory for basic React on Rails integration
1. Configure the `config/initializers/react_on_rails.rb`. You can adjust some necessary settings and defaults. See file [https://github.com/shakacode/react_on_rails/tree/master/spec/dummy/config/initializers/react_on_rails.rb](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy/config/initializers/react_on_rails.rb) for a detailed example of configuration, including comments on the different values to configure.
1. Configure your Procfiles per the example apps. These are at the root of your Rails installation.
1. Configure your top-level JavaScript files for inclusion in your layout. Use one file for static assets, and a separate file for any files in your setup that are not part of your Webpack build. This separation is needed for hot reloading. If hot reloading is not needed, simply configure your `application.js` file to include the Webpack-generated files.
1. If you are deploying to Heroku, see [our Heroku deployment documentation](https://www.shakacode.com/react-on-rails/docs/deployment/heroku-deployment/).
1. If you are deploying to Heroku, see [our Heroku deployment documentation](../deployment/heroku-deployment.md).

If I missed anything, please submit a PR or file an issue.
10 changes: 5 additions & 5 deletions docs/api/view-helpers-api.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

## View Helpers API

Once the bundled files have been generated in your `app/assets/webpack` folder, and you have registered your components, you will want to render these components on your Rails views using the included helper method, [`react_component`](https://www.shakacode.com/react-on-rails/docs/api/view-helpers-api/#react_component).
Once the bundled files have been generated in your `app/assets/webpack` folder, and you have registered your components, you will want to render these components on your Rails views using the included helper method, [`react_component`](#react_component).

---

Expand All @@ -25,7 +25,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/guides/configuration/).
All options except `props, id, html_options` will inherit from your `react_on_rails.rb` initializer, as described [here](../guides/configuration.md).
- **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!
Expand Down Expand Up @@ -105,7 +105,7 @@ You can call `rails_context` or `rails_context(server_side: true|false)` from yo

A "renderer function" is a Render-Function that accepts three arguments (rather than 2): `(props, railsContext, domNodeId) => { ... }`. Instead of returning a React component, a renderer is responsible for installing a callback that will call `ReactDOM.render` (in React 16+, `ReactDOM.hydrate`) to render a React component into the DOM. The "renderer function" is called at the same time the document ready event would instantiate the React components into the DOM.

Why would you want to call `ReactDOM.hydrate` yourself? One possible use case is [code splitting](https://www.shakacode.com/react-on-rails/docs/javascript/code-splitting/). In a nutshell, you don't want to load the React component on the DOM node yet. So you want to install some handler that will call `ReactDOM.hydrate` at a later time. In the case of code splitting with server rendering, the server rendered code has any async code loaded and used to server render. Thus, the client code must also fully load any asynch code before server rendering. Otherwise, the client code would first render partially, not matching the server rendering, and then a second later, the full code would render, resulting in an unpleasant flashing on the screen.
Why would you want to call `ReactDOM.hydrate` yourself? One possible use case is [code splitting](../javascript/code-splitting.md). In a nutshell, you don't want to load the React component on the DOM node yet. So you want to install some handler that will call `ReactDOM.hydrate` at a later time. In the case of code splitting with server rendering, the server rendered code has any async code loaded and used to server render. Thus, the client code must also fully load any asynch code before server rendering. Otherwise, the client code would first render partially, not matching the server rendering, and then a second later, the full code would render, resulting in an unpleasant flashing on the screen.

Renderer functions are not meant to be used on the server since there's no DOM on the server. Instead, use a Render-Function. Attempting to server render with a renderer function will throw an error.

Expand All @@ -115,9 +115,9 @@ Renderer functions are not meant to be used on the server since there's no DOM o

[React Router](https://reactrouter.com/) is supported, including server-side rendering! See:

1. [React on Rails docs for React Router](https://www.shakacode.com/react-on-rails/docs/javascript/react-router/)
1. [React on Rails docs for React Router](../javascript/react-router.md)
2. Examples in [spec/dummy/app/views/react_router](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy/app/views/react_router) and follow to the JavaScript code in the [spec/dummy/client/app/startup/ServerRouterApp.jsx](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy/client/app/startup/ServerRouterApp.jsx).
3. [Code Splitting docs](https://www.shakacode.com/react-on-rails/docs/javascript/code-splitting/) for information about how to set up code splitting for server rendered routes.
3. [Code Splitting docs](../javascript/code-splitting.md) for information about how to set up code splitting for server rendered routes.

---

Expand Down
2 changes: 1 addition & 1 deletion docs/contributor-info/linters.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# Linters

These linters support the [ShakaCode Style Guidelines](https://www.shakacode.com/react-on-rails/docs/misc/style/)
These linters support the [ShakaCode Style Guidelines](../misc/style.md)

## Autofix!

Expand Down
3 changes: 0 additions & 3 deletions docs/contributor-info/pull-requests.md
Original file line number Diff line number Diff line change
Expand Up @@ -37,8 +37,5 @@ When making doc changes, we want the change to work on both the gitbook and the

### Links to other docs:

- When making references to doc files, use a full URL to [https://www.shakacode.com/react-on-rails/docs](https://www.shakacode.com/react-on-rails/docs), for example:
`[Installation Overview](https://www.shakacode.com/react-on-rails/docs/additional-details/manual-installation-overview/)`

- When making references to source code files, use a full GitHub URL, for example:
`[spec/dummy/config/initializers/react_on_rails.rb](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy/config/initializers/react_on_rails.rb)`
20 changes: 10 additions & 10 deletions docs/getting-started.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,10 @@

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.

This documentation assumes the usage of ReactOnRails with Shakapacker 7. For installation on Shakapacker 6, check [tips for usage with Shakapacker 6](https://www.shakacode.com/react-on-rails/docs/aditional-details/tips-for-usage-with-sp6) first.
This documentation assumes the usage of ReactOnRails with Shakapacker 7. For installation on Shakapacker 6, check [tips for usage with Shakapacker 6](./additional-details/tips-for-usage-with-sp6.md) first.

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/).
1. Do the quick [tutorial](./guides/tutorial.md).
2. Add React on Rails to an existing Rails app per [the instructions](./guides/installation-into-an-existing-rails-app.md).
3. Look at [spec/dummy](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy), a simple, no DB example.
4. 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).

Expand All @@ -20,7 +20,7 @@ bundle add shakapacker --strict
rails shakapacker:install
```

You may need to check [the instructions for installing into an existing Rails app](https://www.shakacode.com/react-on-rails/docs/guides/installation-into-an-existing-rails-app/) if you have an already working Rails application.
You may need to check [the instructions for installing into an existing Rails app](./guides/installation-into-an-existing-rails-app.md) if you have an already working Rails application.

1. Add the `react_on_rails` gem to Gemfile:
Please use [the latest version](https://rubygems.org/gems/react_on_rails) to ensure you get all the security patches and the best support.
Expand Down Expand Up @@ -69,7 +69,7 @@ issue.

### 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/initializers/react_on_rails.rb`. You can adjust some necessary settings and defaults. See file [docs/basics/configuration.md](./guides/configuration.md) for documentation of all configuration options.
- Configure `config/shakapacker.yml`. If you used the generator and the default Shakapacker setup, you don't need to touch this file. If you are customizing your setup, then consult the [spec/dummy/config/shakapacker.yml](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy/config/shakapacker.yml) example or the official default [shakapacker.yml](https://github.com/shakacode/shakapacker/blob/master/lib/install/config/shakapacker.yml).
- Most apps should rely on the Shakapacker setup for Webpack. Shakapacker v6+ includes support for Webpack version 5.

Expand Down Expand Up @@ -104,7 +104,7 @@ issue.
<%= 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.
- 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](./guides/render-functions-and-railscontext.md) for more details on this topic.

```js
import React from 'react';
Expand All @@ -120,7 +120,7 @@ issue.
};
```

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`.
See the [View Helpers API](./api/view-helpers-api.md) for more details on `react_component` and its sibling function `react_component_hash`.

## Globally Exposing Your React Components

Expand Down Expand Up @@ -149,7 +149,7 @@ For details on techniques to use different code for client and server rendering,

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 you to:

1. Access to the `railsContext`. See the [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`.
1. Access to the `railsContext`. See the [documentation for the railsContext](./guides/render-functions-and-railscontext.md) in terms of why you might need it. You **need** a Render-Function to access the `railsContext`.
2. Use the passed-in props to initialize a redux store or set up `react-router`.
3. Return different components depending on what's in the props.

Expand Down Expand Up @@ -189,7 +189,7 @@ For server rendering, if you wish to return multiple HTML strings from a Render-
}
```

For details on using react_component_hash with react-helmet, see [our react-helmet documentation](https://www.shakacode.com/react-on-rails/docs/javascript/react-helmet/).
For details on using react_component_hash with react-helmet, see [our react-helmet documentation](./javascript/react-helmet.md).

## Error Handling

Expand All @@ -199,4 +199,4 @@ For details on using react_component_hash with react-helmet, see [our react-helm
## 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.
See the [How to add I18n](./guides/i18n.md) for a summary of adding I18n.
2 changes: 1 addition & 1 deletion docs/guides/client-vs-server-rendering.md
Original file line number Diff line number Diff line change
@@ -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/guides/react-server-rendering/)._
_Also, see [our React server-rendering documentation](./react-server-rendering.md)._

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`.

Expand Down
2 changes: 1 addition & 1 deletion docs/guides/deployment.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,4 +2,4 @@

Shakapacker puts the necessary precompile steps automatically in the rake precompile step.

See the [Heroku Deployment](https://www.shakacode.com/react-on-rails/docs/deployment/heroku-deployment/) doc for specifics regarding Heroku. The information for Heroku may apply to other deployments.
See the [Heroku Deployment](../deployment/heroku-deployment.md) doc for specifics regarding Heroku. The information for Heroku may apply to other deployments.
6 changes: 3 additions & 3 deletions docs/guides/file-system-based-automated-bundle-generation.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,11 +26,11 @@ For example, configure `config/initializers/react_on_rails` to set the name for
config.components_subdirectory = "ror_components"
```

Now all React components inside the directories called `ror_components` will automatically be registered for usage with [`react_component`](https://www.shakacode.com/react-on-rails/docs/api/view-helpers-api/#react_component) and [`react_component_hash`](https://www.shakacode.com/react-on-rails/docs/api/view-helpers-api/#react_component_hash) helper methods provided by React on Rails.
Now all React components inside the directories called `ror_components` will automatically be registered for usage with [`react_component`](../api/view-helpers-api.md#react_component) and [`react_component_hash`](../api/view-helpers-api.md#react_component_hash) helper methods provided by React on Rails.

### Configure `auto_load_bundle` Option

For automated component registry, [`react_component`](https://www.shakacode.com/react-on-rails/docs/api/view-helpers-api/#react_component) and [`react_component_hash`](https://www.shakacode.com/react-on-rails/docs/api/view-helpers-api/#react_component_hash) view helper method tries to load generated bundle for component from the generated directory automatically per `auto_load_bundle` option. `auto_load_bundle` option in `config/initializers/react_on_rails` configures the default value that will be passed to component helpers. The default is `false`, and the parameter can be passed explicitly for each call.
For automated component registry, [`react_component`](../api/view-helpers-api.md#react_component) and [`react_component_hash`](../api/view-helpers-api.md#react_component_hash) view helper method tries to load generated bundle for component from the generated directory automatically per `auto_load_bundle` option. `auto_load_bundle` option in `config/initializers/react_on_rails` configures the default value that will be passed to component helpers. The default is `false`, and the parameter can be passed explicitly for each call.

You can change the value in `config/initializers/react_on_rails` by updating it as follows:

Expand Down Expand Up @@ -186,7 +186,7 @@ For example, if you wanted to utilize our file-system based entrypoint generatio
<%= react_component("BarComponentTwo", {}) %>
```

If a component uses multiple HTML strings for server rendering, the [`react_component_hash`](https://www.shakacode.com/react-on-rails/docs/api/view-helpers-api/#react_component_hash) view helper can be used on the Rails view, as illustrated below.
If a component uses multiple HTML strings for server rendering, the [`react_component_hash`](../api/view-helpers-api.md#react_component_hash) view helper can be used on the Rails view, as illustrated below.

```erb
<% foo_component_one_data = react_component_hash(
Expand Down
2 changes: 1 addition & 1 deletion docs/guides/how-react-on-rails-works.md
Original file line number Diff line number Diff line change
Expand Up @@ -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. Define `config.build_production_command` in your [config/initializers/react_on_rails.rb](https://www.shakacode.com/react-on-rails/docs/guides/configuration/)
1. Define `config.build_production_command` in your [config/initializers/react_on_rails.rb](./configuration.md)

Then React on Rails modifies the `assets:precompile` task to run your `build_production_command`.

Expand Down
Loading
Loading