react_on_rails 13.4.0 → 14.0.0

data/docs/outdated/rails-assets-relative-paths.md

@@ -1,195 +0,0 @@
-*Note: this doc reflects using Sprockets for assets and has not been updated for Shakapacker or rails/webpacker*
-
-# Using Webpack bundled assets with the Rails Asset Pipeline
-
-**If you're looking to use assets in your react components, look no further. This doc is for you.**
-
-As most of you know, when you spin up a Rails application all of your asset files that live within your `app/assets/` directory will be added into your application's Asset Pipeline. If you would like to view any of these assets (most commonly you'd want to view images), run your rails server in development mode and in a browser visit a url similar to: `localhost:3000/assets/sample_image.png`. In this case, if I had an image `sample_image.png` in my `app/assets/images/` directory, visiting the url `localhost:3000/assets/sample_image.png` in a browser would display the image to me. Meaning that `/assets/sample_image.png` is my path to that individual asset.
-
-## The Problem
-
-Sometimes we would like to use images directly in our react components or even component specific CSS. This can cause problems because it is difficult to maintain the relative path to assets in our pipeline. Normally, we would use erb to get around this, using something like `<img src="<%= asset_path('my-image.png') %>" />`. Unfortunately, that will not play well with webpack.
-
-Now we could always just place these assets in our `app/assets/` directory like normal and then reference them in our react with things like `<img src="/assets/asset-name.ext" />`, and that would work! But that also will move this image out of our client side app, which isn't always ideal. Also hardcoding the path to an asset isn't a good approach considering file paths can always change, and that would then require a source code change. That's just no bueno.
-
-So how do we get around this? And find the relative paths to our assets without hardcoding the paths?
-
-## The Solution: The lowdown on Webpack's url-loader & file-loader, outputPaths and publicPaths
-
-Loaders are an incredibly useful part of Webpack. Simply put, they allow you to load and bundle different types of sources/files (you can load anything from images, CSS, to CoffeeScript).
-
-##### Url Loader vs. File Loader
-
-Two very common, and quite useful, Webpack loaders are the [url-loader](https://github.com/webpack-contrib/url-loader) and the [file-loader](https://github.com/webpack-contrib/file-loader). They allow you to load and access files in an easy manner. Both of these loaders are incredibly similar to one another, and in fact work together to accomplish their goals, with a very slight difference. The url-loader will load any file(s) and when accessed, will return a Data Url that can be used to access the file(s) (commonly used to inline images). File-loader on the other hand, will bundle and output the file(s) to a desired directory so they can live in the assets on your webserver along with your outputted webpack bundle. These bundled assets can then be accessed by their public paths, making it very easy to include and use them in your JavaScript code.
-
-The url-loader is great to use for smaller images! It is most commonly used with a set byte limit on the size of the files that can be loaded. When this is the case, anything below the byte limit will be loaded and returned as a Data Url. Anything that exceeds the byte limit, will delegate to file-loader for loading, passing any set query parameters as well to file-loader (if that sounds like gibberish right now, don't worry. You'll learn all about it soon!).
-
-The benefit of using url-loader first, and falling back on file-loader, is that the use of Data Urls saves HTTP Requests that need to be made to fetch files. That is very important in regards to how fast a webpage will load. Generally speaking, the less HTTP requests that need to be made, the faster a page will load. For more information about usage, and the pros & cons of Data Urls read [here](https://css-tricks.com/data-uris/).
-
-Note: _For the rest of this doc, we will be using file-loader. This is because its usage can be a little bit trickier and it is used as url-loader's back up. Keep in mind that the usage for the two are EXTREMELY similar. For more info about the url-loader's usage, check out its configuration for the `react_on_rails` sample app [here](https://github.com/shakacode/react-webpack-rails-tutorial/blob/master/client/webpack.client.base.config.js) (specifically lines 82-84)._
-
-##### Configuring Webpack with file-loader
-
-Once you have added file-loader (or whatever loader you would like to use) to your project, you can start configuring your `webpack.config.js` file to bundle these assets. Inside your `module["loaders"]` list you will add a new object to represent your loader. This loader will include a few attributes:
-
-1. `test`: a regular expression that specifies the types of files that can be loaded.
-2. `loader`: the name of the loader you will be using (in this doc we will be using [file-loader](https://github.com/webpack-contrib/file-loader))
-3. `query`: query parameters are additional configuration options that get passed to the loader. This can either be appended to your `loader` attribute like follows:
-
-
-```javascript
-loader: "file-loader?name=[name].[ext]"
-```
-
-or as a JSON object:
-
-```javascript
-query: {
-  name: "[name].[ext]"
-}
-```
-
-both of these two example above do the exact same thing, just using different syntaxes. For the rest of this doc we will be using the JSON object style. For more information about webpack loaders, read [this](https://webpack.github.io/docs/using-loaders.html).
-
-_For the sake of this doc, we're also going to add a `resolve["alias"]` inside our webpack.config to make it easier to include our assets in our jsx files. In `resolve["alias"]`, simply add:_
-
-```javascript
-'assets': path.resolve('./app/assets')
-```
-
-##### Configuring your file-loader Query Parameters
-
-The first property we'll want to set is our file's resulting name after bundling. For now we're just going to use:
-
-```javascript
-name: "[name][md5:hash].[ext]"
-```
-
-This will just set the name to the file's original name + a md5 digested hash + the extension of the original file (.png, .jpg, etc).
-
-Next we'll set the outputPath for our files. This is the directory we want the files to be placed in after webpack runs. When Webpack runs with file-loader, all files (in this case assets) that have been used in the bundled JavaScript will be bundled and outputted to the output destination. **Keep in mind that react_on_rails outputs by default to the `app/assets/webpack/` directory so when we specify the outputPath here it will be relative the `app/assets/webpack` directory.** You can set the outputPath to whatever you want, in this example we will add it to a directory `/app/assets/webpack/webpack-assets/`, and here's how we would do that:
-
-```javascript
-outputPath: "webpack-assets/"
-```
-
-Note: _You can output these files in the asset pipeline wherever you see fit. My preference is outputting somewhere inside the `app/assets/webpack/` directory just because anything in this directory is already ignored by git due to the react_on_rails generated gitignore, meaning they will not be added by git twice! (once in your `client/app/assets/` and once in your outputted path after webpack bundling)_
-
-Lastly, we will set the publicPath to our file(s). This will be the endpoint on our rails web server that you can visit to reach the asset (if you don't know how this works, read the [intro](#using-webpack-bundled-assets-with-the-rails-asset-pipeline)). If you've been following the previous steps, you know that we set our outputPath for our assets to be absolute at `app/assets/webpack/webpack-assets/`, which your rails app should end up hosting at `/assets/webpack-assets/file-name+hash.ext` when the server is run.
-
-Note: _If you're having a hard time figuring out what an asset's path will be on your rails server, simply run `rake assets:precompile` and `cd public/`. The path from there to your file will then be the path/url on your web server to that asset. On top of this, it is also a good idea to check out [this doc](https://www.shakacode.com/react-on-rails/docs/outdated/rails-assets/) to understand how `react_on_rails` allows us to access these files after precompilation, when Rails applies another hash onto the asset._
-
-Our publicPath setting will match the path to our outputted assets on our rails web server. Given our assets in this example will be outputted to `/app/assets/webpack/webpack-assets/` and hosted at `/assets/webpack-assets/`, our publicPath would be:
-
-```javascript
-publicPath: "/assets/webpack-assets/"
-```
-
-Voila! Your webpack setup is complete.
-
-##### Adding/Using `client/` Assets
-
-Now for the fun part, we actually get to use our client assets now. The first thing you'll want to do is create an assets directory inside your client directory. The best place for this directory is probably at `client/app/assets`. Put any assets you want in there, images, stylesheets, whatever. Now that the assets are in place, we can simply `import` or `require` them in our jsx files for use in our components. For example:
-
-```javascript
-import myImage from 'assets/images/my-image.png'; // This uses the assets alias we created earlier to map to the client/app/assets/ directory followed by `images/my-image.png`
-
-export default class MyImageBox extends React.Component {
-  constructor(props, context) {
-    super(props, context);
-  }
-
-  render() {
-    return <img src={myImage} />
-  }
-}
-```
-
-`myImage` in the example above will resolve to the path of that asset on the web server. Therefore using it as an img's source would then properly display the image/assets when this react component is rendered.
-
-Note: **Any assets in our `client/` directory that are not imported/required for use in our jsx files will NOT be bundled and outputted by webpack.**
-
-## Summary: Welcome people who are tired of reading
-
-If you've read this far, you probably have a grip on everything. If you didn't, and want a condensed version, here you go:
-
-- Add webpack's file-loader to your project
-- Add a new loader module in your webpack.config.js file
-- Set this loader's test attribute to a regex of the file extensions you would like to load
-- Set the loader attribute to "file-loader"
-- Set name to something like `"[name][md5:hash].[ext]"`
-- Set outputPath attribute to directory of choice, relative to `app/assets/webpack` directory
-- Set publicPath attribute, this should be the same as where the rails asset pipeline will serve your asset(s) on the server. See [this](#configuring-your-file-loader-query-parameters) for more info.
-- Add assets directory in `client/app/`, and place whatever you would like in there
-- Import or Require these files in your jsx and use them all you want!
-
-### Here's a full example of a webpack.config.js configured with file-loader to load images:
-
-```javascript
-const webpack = require('webpack');
-const path = require('path');
-
-const devBuild = process.env.NODE_ENV !== 'production';
-const nodeEnv = devBuild ? 'development' : 'production';
-
-module.exports = {
-  entry: [
-    './app/bundles/HelloWorld/startup/registration',
-  ],
-
-  output: {
-    filename: 'hello-world-bundle.js',
-    path: '../app/assets/webpack'
-  },
-
-  resolve: {
-    extensions: ['', '.js', '.jsx'],
-    alias: {
-      assets: path.resolve('./app/assets'), // Makes it easier to reference our assets in jsx files
-      react: path.resolve('./node_modules/react'),
-      'react-dom': path.resolve('./node_modules/react-dom'),
-    },
-  },
-
-  plugins: [
-    new webpack.DefinePlugin({
-      'process.env': {
-        NODE_ENV: JSON.stringify(nodeEnv),
-      }
-    })
-  ],
-  module: {
-    rules: [
-      {
-        test: /\.jsx?$/,
-        loader: 'babel-loader',
-        exclude: /node_modules/,
-      },
-      {
-        test: require.resolve('react'),
-        use: {
-          loader: 'imports-loader',
-          options: {
-            shim: 'es5-shim/es5-shim',
-            sham: 'es5-shim/es5-sham',
-          },
-        }
-      },
-      {
-        // The important stuff
-        test: /\.(jpg|jpeg|png)(\?.*)?$/, // Load only .jpg .jpeg, and .png files
-        use: {
-          loader: 'file-loader',
-          options: {
-            name: '[name][md5:hash].[ext]', // Name of bundled asset
-            outputPath: 'webpack-assets/', // Output location for assets. Final: `app/assets/webpack/webpack-assets/`
-            publicPath: '/assets/webpack-assets/' // Endpoint asset can be found at on Rails server
-          }
-        }
-      }
-    ]
-  }
-};
-```
-
-If you'd like to understand how react_on_rails handles these bundled assets after asset precompilation and in production mode, check out: [Rails Assets](https://www.shakacode.com/react-on-rails/docs/outdated/rails-assets/).

data/docs/outdated/rails-assets.md

@@ -1,77 +0,0 @@
-# Rails assets and the Extract Text Plugin
-
-*This doc needs updating for the use of  Shakapacker or rails/webpacker with React on Rails*
-
-The [Webpack file loader](https://github.com/webpack/file-loader) copies referenced files to
-the destination output directory, with an MD5 hash. The other term for this is a "digest".
-
-> By default the filename of the resulting file is the MD5 hash of the file's contents with
-the original extension of the required resource.
-
-The most common use cases for Webpack processed files are images used for backgrounds in
-CSS and fonts for CSS. However, this applies to any file that might be processed using the
-Webpack file loader.
-
-## The Problem
-To understand the problem, it helps to read this article:
-[What is fingerprinting and why should I care](http://guides.rubyonrails.org/asset_pipeline.html#what-is-fingerprinting-and-why-should-i-care-questionmark)
-Basically, when Rails prepares assets for production deployments, it also adds a digest
-to the file names. E.g., `img1.jpg` becomes `img1-dbu097452jf2v2.jpg`.
-
-When compiling its native css Rails transforms all urls and links to digested
-versions, i.e. `background-image: image-url(img1.jpg)` becomes
-`background-image: url(img1-dbu097452jf2v2.jpg)`. However this doesn't happen for js and
-css files compiled by webpack on the client side, because they don't use
-`image-url` and `asset-url`. Without some fix, these assets would fail to load.
-
-When Webpack's client JavaScript uses images in render methods, e.g. `<img src='...' />` or
-in css, e.g. `background-image: url(...)` The code (such as the CSS) generated by the Webpack
-will have the Webpack digested name (MD5 hash). Since the Webpack generated CSS expects
-just one level of "digesting", this "double-digesting" from Rails will cause such these assets
-fail to load.
-
-_If you are interested in learning how to use assets in your React components, read this doc: [Webpack, the Asset Pipeline, and Using Assets w/ React](https://www.shakacode.com/react-on-rails/docs/outdated/rails-assets-relative-paths/)_
-
-## The Solution: Symlink Original File Names to New File Names
-_Note, this solution was removed in v14. If you're intersted in this symlink solution, please create
-a github issue._
-
-## Example from /spec/dummy
-
-```
-cd spec/dummy
-RAILS_ENV=production bundle exec rake assets:precompile
-rails s -e production
-```
-
-You will see this. This shows how the file names output by rails. Note the original names after
-being processed by Webpack are just MD5's.
-
-```
-I, [2016-07-17T23:46:56.301981 #77382]  INFO -- : Writing /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/server-bundle-42935dea382802a27e91b7df444a2813f74b4e6a0fce5606d863aaa10c0623d7.js
-I, [2016-07-17T23:46:56.305649 #77382]  INFO -- : Writing /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/server-bundle-42935dea382802a27e91b7df444a2813f74b4e6a0fce5606d863aaa10c0623d7.js.gz
-I, [2016-07-17T23:46:56.370390 #77382]  INFO -- : Writing /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/application_static-dfa728160c3cdebc633c2f6fb3823411530b307044f4dfe460790eef00b4e421.js
-I, [2016-07-17T23:46:56.370566 #77382]  INFO -- : Writing /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/application_static-dfa728160c3cdebc633c2f6fb3823411530b307044f4dfe460790eef00b4e421.js.gz
-I, [2016-07-17T23:46:56.372895 #77382]  INFO -- : Writing /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/application_static-17ed778d5061d4797556632b7bfbf405e067d9e7f140060a7f56a09788251f16.css
-I, [2016-07-17T23:46:56.373012 #77382]  INFO -- : Writing /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/application_static-17ed778d5061d4797556632b7bfbf405e067d9e7f140060a7f56a09788251f16.css.gz
-I, [2016-07-17T23:46:56.374531 #77382]  INFO -- : Writing /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/2ac2dd94f9b7e54292f6d051f1e4e756-ab14eebb171a9a5c9bfdeb2f88933d2dc4904ea8bb09444984e52b13d230e251.svg
-I, [2016-07-17T23:46:56.374818 #77382]  INFO -- : Writing /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/2ac2dd94f9b7e54292f6d051f1e4e756-ab14eebb171a9a5c9bfdeb2f88933d2dc4904ea8bb09444984e52b13d230e251.svg.gz
-I, [2016-07-17T23:46:56.392207 #77382]  INFO -- : Writing /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/5cf5db49df178f9357603f945752a1ef-033650e1d6193b70d59bb60e773f47b6d9aefdd56abc7ccdba3c7bed4e57ccad.png
-I, [2016-07-17T23:46:56.393208 #77382]  INFO -- : Writing /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/8970f5e1e92aea933b502a2d73976b76-877bde3739dc7080c3fb00ee9012db6f21ed0dbbf11cd596dbb6e1a35bfb71f9.png
-I, [2016-07-17T23:46:56.395490 #77382]  INFO -- : Writing /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/ecb4572a5e478b107dfcb60c16a7eefa-6d1ab3741d5a164dc2aab48bb74429aebe2e2e29606feca581081697624dc18c.ttf
-I, [2016-07-17T23:46:56.395846 #77382]  INFO -- : Writing /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/ecb4572a5e478b107dfcb60c16a7eefa-6d1ab3741d5a164dc2aab48bb74429aebe2e2e29606feca581081697624dc18c.ttf.gz
-I, [2016-07-17T23:46:56.396979 #77382]  INFO -- : Writing /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/fbd0d00cc9b670f05c17893a40da08d0-5731789fd0d7847a582b52b55a83e7a0ad4684acd5a9b487557635a08c112d0e.svg
-I, [2016-07-17T23:46:56.397669 #77382]  INFO -- : Writing /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/fbd0d00cc9b670f05c17893a40da08d0-5731789fd0d7847a582b52b55a83e7a0ad4684acd5a9b487557635a08c112d0e.svg.gz
-I, [2016-07-17T23:46:56.399261 #77382]  INFO -- : Writing /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/fc2dcaaf2057331ff76c5d37e1aa7056-efba50c701b697fc8160603b9e876adcf47511f35af68701db285272c965a45f.svg
-I, [2016-07-17T23:46:56.399660 #77382]  INFO -- : Writing /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/fc2dcaaf2057331ff76c5d37e1aa7056-efba50c701b697fc8160603b9e876adcf47511f35af68701db285272c965a45f.svg.gz
-React On Rails: Symlinking /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/2ac2dd94f9b7e54292f6d051f1e4e756-ab14eebb171a9a5c9bfdeb2f88933d2dc4904ea8bb09444984e52b13d230e251.svg to /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/2ac2dd94f9b7e54292f6d051f1e4e756.svg
-React On Rails: Symlinking /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/2ac2dd94f9b7e54292f6d051f1e4e756-ab14eebb171a9a5c9bfdeb2f88933d2dc4904ea8bb09444984e52b13d230e251.svg.gz to /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/2ac2dd94f9b7e54292f6d051f1e4e756.svg.gz
-React On Rails: Symlinking /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/5cf5db49df178f9357603f945752a1ef-033650e1d6193b70d59bb60e773f47b6d9aefdd56abc7ccdba3c7bed4e57ccad.png to /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/5cf5db49df178f9357603f945752a1ef.png
-React On Rails: Symlinking /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/8970f5e1e92aea933b502a2d73976b76-877bde3739dc7080c3fb00ee9012db6f21ed0dbbf11cd596dbb6e1a35bfb71f9.png to /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/8970f5e1e92aea933b502a2d73976b76.png
-React On Rails: Symlinking /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/ecb4572a5e478b107dfcb60c16a7eefa-6d1ab3741d5a164dc2aab48bb74429aebe2e2e29606feca581081697624dc18c.ttf to /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/ecb4572a5e478b107dfcb60c16a7eefa.ttf
-React On Rails: Symlinking /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/ecb4572a5e478b107dfcb60c16a7eefa-6d1ab3741d5a164dc2aab48bb74429aebe2e2e29606feca581081697624dc18c.ttf.gz to /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/ecb4572a5e478b107dfcb60c16a7eefa.ttf.gz
-React On Rails: Symlinking /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/fbd0d00cc9b670f05c17893a40da08d0-5731789fd0d7847a582b52b55a83e7a0ad4684acd5a9b487557635a08c112d0e.svg to /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/fbd0d00cc9b670f05c17893a40da08d0.svg
-React On Rails: Symlinking /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/fbd0d00cc9b670f05c17893a40da08d0-5731789fd0d7847a582b52b55a83e7a0ad4684acd5a9b487557635a08c112d0e.svg.gz to /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/fbd0d00cc9b670f05c17893a40da08d0.svg.gz
-React On Rails: Symlinking /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/fc2dcaaf2057331ff76c5d37e1aa7056-efba50c701b697fc8160603b9e876adcf47511f35af68701db285272c965a45f.svg to /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/fc2dcaaf2057331ff76c5d37e1aa7056.svg
-React On Rails: Symlinking /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/fc2dcaaf2057331ff76c5d37e1aa7056-efba50c701b697fc8160603b9e876adcf47511f35af68701db285272c965a45f.svg.gz to /Users/justin/shakacode/react_on_rails/spec/dummy/public/assets/fc2dcaaf2057331ff76c5d37e1aa7056.svg
-```

data/docs/outdated/rails3.md

@@ -1,9 +0,0 @@
-# Rails 3
-
-* Please let us know if you find any issues with Rails 3.
-* Rails 3 is confirmed to work up with versions up to 6.8.x.
-* We are not testing it for new releases. If you find an issue, you will have to submit a PR to get it fixed.
-
-## Known Issues
-
-1. If you do not skip bootstrap for the generator, you cannot generate a working app, as bootstrap-sass does not support Rails 3, or at least the version we're using.

data/docs/rails/convert-rails-5-api-only-app.md

@@ -1,19 +0,0 @@
-# Convert Rails 5 API only app to a Rails app
-
-1. Go to the directory where you created your app
-
-```bash
-$ rails new your-current-app-name
-```
-
-Rails will start creating the app and will skip the files you have already created. If there is some conflict then it will stop and you need to resolve it manually. be careful at this step as it might replace you current code in conflicted files.
-
-2. Resolve conflicts
-
-```
-1. Press "d" to see the difference
-2. If it is only adding lines then press "y" to continue
-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/guides/installation-into-an-existing-rails-app/)

data/docs/rails/rails-engine-integration.md

@@ -1,32 +0,0 @@
-## In your engine
-
-+ At the top of `config/initializers/react_on_rails.rb`
-```ruby
-ActiveSupport.on_load(:action_view) do
-  include ReactOnRailsHelper
-end
-```
-+ In your `<engine_name>.gemspec`:
-```ruby
-s.add_dependency 'react_on_rails', '~> 6'
-```
-+ In your `lib/<engine_name>.rb` (the entry point for your engine)
-```ruby
-require "react_on_rails"
-```
-## In the project including your engine
-
-Place `gem 'react_on_rails', '~> 6'` before the gem pointing at your engine in your gemfile.
-
-Requiring `react_on_rails` and including the helper will get rid of any issues where react on rails or react_component is undefined.
-
-As far as solving the assets issue, `lib/tasks/assets.rake` in `react_on_rails` would somehow have to know that `react_on_rails` was included in an engine, and decide the path accordingly. This might be impossible, especially in the case of multiple engines using `react_on_rails` in a single application.
-
-Another solution would be to detach this rake task from the `rails assets:precompile` task. This can be done by adding `REACT_ON_RAILS_PRECOMPILE=false` to your environment. If you do so, then react assets will have to be bundled separately from `rails assets:precompile`.
-
-# Github Issues
-
-* [Integration with an engine #342](https://github.com/shakacode/react_on_rails/issues/342)
-* [Feature: target destination option for the install generator #459](https://github.com/shakacode/react_on_rails/issues/459)
-* [Integration with Rails 5 Engines #562](https://github.com/shakacode/react_on_rails/issues/562)
-* [Run inside a Rails engine? #257](https://github.com/shakacode/react_on_rails/issues/257)

data/docs/rails/rails_view_rendering_from_inline_javascript.md

@@ -1,36 +0,0 @@
-# Using ReactOnRails in JavaScript
-You can easily render React components in your JavaScript with `render` method that returns a [reference to the component](https://facebook.github.io/react/docs/more-about-refs.html) (virtual DOM element).
-
-```js
-/**
- * ReactOnRails.render("HelloWorldApp", {name: "Stranger"}, 'app');
- *
- * Does this:
- *   ReactDOM.render(React.createElement(HelloWorldApp, {name: "Stranger"}),
- *     document.getElementById('app'))
- *
- * @param name Name of your registered component
- * @param props Props to pass to your component
- * @param domNodeId
- * @param hydrate [optional] Pass truthy to update server rendered html. Default is falsy
- * @returns {virtualDomElement} Reference to your component's backing instance
- */
-ReactOnRails.render(componentName, props, domNodeId)
-```
-
-## Why do we need this?
-Imagine that we have some event with jQuery, it allows us to set component state manually.
-
-```html
-<input id="input" type="range" min="0" max="100" />
-<div id="root"></div>
-
-<script>
-  var input = $("#input");
-  var component = ReactOnRails.render("componentName", { value: input.val() }, "root");
-
-  input.on("change", function(e) {
-    component.setState({ value: input.val() });
-  });
-</script>
-```

data/docs/rails/turbolinks.md

@@ -1,124 +0,0 @@
-# Turbolinks and Turbo
-
-## Updated to support Turbo
-* See [PR 1374](https://github.com/shakacode/react_on_rails/pull/1374).
-* Ability to use with Turbo (@hotwired/turbo), as Turbolinks gets obsolete.
-
-To configure turbo the following option can be set:
-  `ReactOnRails.setOptions({ turbo: true })`
-
-Turbo is not auto-detected like older Turbolinks.
-
-*Below docs maybe outdated*
-
-* See [Turbolinks on Github](https://github.com/rails/turbolinks)
-* React on Rails currently supports 2.5.x of Turbolinks and 5.0.0 of Turbolinks 5.
-* You may include Turbolinks either via yarn (recommended) or via the gem.
-
-## Why Turbolinks?
-As you switch between Rails HTML controller requests, you will only load the HTML and you will
-not reload JavaScript and stylesheets. This definitely can make an app perform better, even if
-the JavaScript and stylesheets are cached by the browser, as they will still require parsing.
-
-## Requirements for Using Turbolinks
-1. You are **not using [react-router](https://github.com/ReactTraining/react-router)** or you are prepared to deal with some potential issues with where react-router and Turbolinks overlaps.
-2. You are **using one JS and one CSS file** throughout your app. Otherwise, you will have to figure out how best to handle multiple JS and CSS files throughout the app given Turbolinks.
-
-## Why Not Turbolinks
-1. [react-router](https://github.com/ReactTraining/react-router) handles the back and forward buttons, as does TurboLinks. You *might* be able to make this work. *Please share your findings.*
-1. You want to do code splitting to minimize the JavaScript loaded.
-
-## More Information
-* CSRF tokens need thorough checking with Turbolinks5. Turbolinks5 changes the head element by JavaScript (not only body) on page changes with the correct csrf meta tag, but if the JS code parsed this from head when several windows were opened, then our specs were not all passing. I didn't look details however, may be it is app code related, not library code. Anyway it may need additional check because there is CSRF helper in ReactOnRails and it need to work with Turbolinks5.
-* Turbolinks5 send requests without the `Accept: */*` in the header, only exactly like `Accept: text/html` which makes Rails behave a bit specifically compared to normal and mime-parsing, which is skipped by when Rails see */*. For some more details on Rails and */* can read [Mime Type Resolution in Rails](http://blog.bigbinary.com/2010/11/23/mime-type-resolution-in-rails.html)
-* If you're using multiple Webpack bundles, be sure to ensure that there are no name conflicts between JS objects or redux store paths.
-
-### Install Checklist
-1. Include turbolinks via yarn as shown in the [react-webpack-rails-tutorial](https://github.com/shakacode/react-webpack-rails-tutorial/blob/8a6c8aa2e3b7ae5b08b0a9744fb3a63a2fe0f002/client/webpack.client.base.config.js#L22) or include the gem "turbolinks".
-1. Included the proper "track" tags when you include the javascript and stylesheet:
-  ```erb
-    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => 'reload' %>
-    <%= javascript_include_tag 'application', 'data-turbolinks-track' => 'reload' %>
-  ```
-  NOTE: for Turbolinks 2.x, use 'data-turbolinks-track' => true
-1. Add turbolinks to your `application.js` file:
-   ```javascript
-   //= require turbolinks
-   ```
-
-## Turbolinks 5
-Turbolinks 5 is now being supported. React on Rails will automatically detect which version of Turbolinks you are using and use the correct event handlers.
-
-For more information on Turbolinks 5: [https://github.com/turbolinks/turbolinks](https://github.com/turbolinks/turbolinks)
-
-## Turbolinks from NPM
-
-See the [instructions on installing from NPM](https://github.com/turbolinks/turbolinks#installation-using-npm).
-
-```js
-import Turbolinks from "turbolinks";
-Turbolinks.start();
-```
-
-### async script loading
-Generally async script loading can be done like:
-```erb
-  <%= javascript_include_tag 'application', async: Rails.env.production? %>
-```
-If you use ```document.addEventListener("turbolinks:load", function() {...});``` somewhere in your code, you will notice, that Turbolinks 5 does not fire ```turbolinks:load``` on initial page load. A quick workaround is to use ```defer``` instead of ```async```:
-```erb
-  <%= javascript_include_tag 'application', defer: Rails.env.production? %>
-```
-More information on this issue can be found here: https://github.com/turbolinks/turbolinks/issues/28
-
-When loading your scripts asynchronously you may experience, that your Components are not registered correctly. Call ```ReactOnRails.reactOnRailsPageLoaded()``` to re-initialize like so:
-```
-  document.addEventListener("turbolinks:load", function() {
-    ReactOnRails.reactOnRailsPageLoaded();
-  });
-```
-
-## Troubleshooting
-To turn on tracing of Turbolinks events, put this in your registration file, where you register your components.
-
-```js
-   ReactOnRails.setOptions({
-     traceTurbolinks: true,
-     turbo: true,
-   });
-```
-
-Rather than setting the value to true, you could set it to TRACE_TURBOLINKS, and then you could place this in your `webpack.client.base.config.js`:
-
-Define this const at the top of the file:
-```js
-  const devBuild = process.env.NODE_ENV !== 'production';
-```
-
-Add this DefinePlugin option:
-```js
-  plugins: [
-   new webpack.DefinePlugin({
-     TRACE_TURBOLINKS: devBuild,
-   }),
-```
-
-At Webpack compile time, the value of devBuild is inserted into your file.
-
-Once you do that, you'll see messages prefixed with **TURBO:** like this in the browser console:
-
-Turbolinks Classic:
-```
-TURBO: WITH TURBOLINKS: document page:before-unload and page:change handlers installed. (program)
-TURBO: reactOnRailsPageLoaded
-```
-
-Turbolinks 5:
-```
-TURBO: WITH TURBOLINKS 5: document turbolinks:before-render and turbolinks:render handlers installed. (program)
-TURBO: reactOnRailsPageLoaded
-```
-
-We've noticed that Turbolinks doesn't work if you use the ruby gem version of jQuery and jQuery ujs. Therefore we recommend using the node packages instead. See the [tutorial app](https://github.com/shakacode/react-webpack-rails-tutorial) for how to accomplish this.
-
-![2016-02-02_10-38-07](https://cloud.githubusercontent.com/assets/1118459/12760060/6546e254-c999-11e5-828b-a8aaa473e5bd.png)

data/docs/react-on-rails-pro/react-on-rails-pro.md

@@ -1,43 +0,0 @@
-## 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, Shakapacker, 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).

data/docs/testimonials/hvmn.md

@@ -1,25 +0,0 @@
-# HVMN Testimonial, Written by Paul Benigeri, October 12, 2018
-
-For some years, we used React on Rails for server-side rendering at [HVMN](https://hvmn.com). Our entire backend was already built in Rails, and we love React. As a content & e-commerce site, server-side rendering is critical, for UX performance and SEO crawler indexing.
-
-During the 12 months leading up to our React on Rails Pro transition, our traffic grew 10x. Our team of 2 engineers was focused on shipping features, and we started to face performance issues. We had some fragment caching of our React server rending, but it didn’t work that well.
-
-I discussed our growing pains with Justin, and as it turned out, ShakaCode just came out with React on Rails Pro and set it up on [egghead.io](https://egghead.io). The performance improvements were impressive, and Justin’s team was an ideal partner to help with the integration.
-
-We decided to give it a shot. Over three weeks, the ShakaCode team helped us migrate to React on Rails Pro, set up Webpack v4, migrated our entire asset pipeline to Webpack v4.
-
-Results were great. Our blog and product pages are 80-90% faster after that effort. The improved fragment caching was quick to set up and made a huge dent in our average server response times. We also observed an additional drop in response times when ShakaCode shipped the standalone Node server-side React renderer.
-
-Working with ShakaCode was a pleasure. Justin is one of the smartest Rails architects I know, and his team was responsive and productive.
-
-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.
-
-If you have any questions, please reach out.
-
-Paul Benigeri, Head of E-Commerce
-
-[paul@hvmn.com](mailto:paul@hvmn.com), [LinkedIn](https://www.linkedin.com/in/benigeri/)
-
-Related 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)
-
-[![image](https://user-images.githubusercontent.com/1118459/46911126-577abd00-ceee-11e8-86c6-6703ff80fc2f.png)](https://www.linkedin.com/in/benigeri/)

data/docs/testimonials/resortpass.md

@@ -1,13 +0,0 @@
-# ResortPass Testimonial, by Leora Juster, December 10, 2018
-
-Many can write code that "works." Even fewer can write sophisticated code that both works and reflects a deep understanding of the technologies and paradigms involved. Only a select few can do the aforementioned while assisting in managing the expectations and time constraints of less technically informed members of software product teams to make the best design decisions possible. 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. The code and CSS files are well-organized and contain repeatable patterns easy to understand, allowing my team to build on what has already been accomplished. I learned a great deal from my interactions with Justin and his team, as they are just as great teachers as they are developers, and feel like I get to continually learn from them as I build on top of their code. Their different support and pro plan options make it easy to build a continuous professional relationship despite fluctuations in my team's funding, and their team is always extremely personable, punctual, and professional. 
-
-Leora Juster, Full-Stack Lead Software Developer
-
-[LinkedIn](https://www.linkedin.com/in/leora-juster-38933050)
-
-![image](https://user-images.githubusercontent.com/1118459/50050877-30399b00-00ab-11e9-9e52-2977de45ccae.png)
-
-[ResortPass](https://resortpass.com/)
-
-[![2018-12-15_20-48-35](https://user-images.githubusercontent.com/1118459/50050866-03858380-00ab-11e9-8588-461112f8045b.png)](https://resortpass.com/)

data/docs/testimonials/testimonials.md

@@ -1,28 +0,0 @@
-# Testimonials
-# [HVMN Testimonial, Written 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.
-
-Full writeup [here](https://www.shakacode.com/react-on-rails/docs/testimonials/hvmn/).
-
----
-
-# [Leora from ResortPass](https://www.shakacode.com/react-on-rails/docs/testimonials/resortpass/), December 10, 2018
-
-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.
-
-Full writeup [here](https://www.shakacode.com/react-on-rails/docs/testimonials/resortpass/).
-
----
-
-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)
-
----
-
-From Kyle Maune of Cooper Aerial, May 4, 2018
-
-![image](https://user-images.githubusercontent.com/1118459/40891236-9b0b406e-671d-11e8-80ee-c026dbd1d5a2.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).

data/jest.config.js

@@ -1,4 +0,0 @@
-module.exports = {
-  preset: 'ts-jest/presets/js-with-ts',
-  testEnvironment: 'jsdom',
-};