react_on_rails 11.1.7 → 11.3.1.beta.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (55) hide show
  1. checksums.yaml +4 -4
  2. data/.eslintrc +8 -2
  3. data/.prettierignore +1 -0
  4. data/.prettierrc +20 -0
  5. data/.release-it.json +3 -0
  6. data/.travis.yml +10 -9
  7. data/CHANGELOG.md +60 -3
  8. data/CONTRIBUTING.md +2 -10
  9. data/Gemfile +1 -2
  10. data/Gemfile.rails32 +0 -1
  11. data/README.md +30 -14
  12. data/SUMMARY.md +6 -2
  13. data/docs/additional-reading/{hot-reloading-rails-development.md → hot-reloading-rails-development-asset-pipeline.md} +2 -12
  14. data/docs/additional-reading/images.md +1 -1
  15. data/docs/additional-reading/rails_view_rendering_from_inline_javascript.md +2 -1
  16. data/docs/additional-reading/upgrade-webpacker-v3-to-v4.md +10 -0
  17. data/docs/api/view-helpers-api.md +12 -8
  18. data/docs/basics/configuration.md +4 -4
  19. data/docs/basics/generator-details.md +1 -1
  20. data/docs/basics/minitest-configuration.md +31 -0
  21. data/docs/basics/react-server-rendering.md +3 -1
  22. data/docs/basics/recommended-project-structure.md +24 -1
  23. data/docs/basics/rspec-configuration.md +2 -2
  24. data/docs/basics/upgrading-react-on-rails.md +11 -1
  25. data/docs/basics/webpack-configuration.md +11 -0
  26. data/docs/misc-pending/code-splitting.md +2 -2
  27. data/docs/misc-pending/manual-installation-overview.md +1 -1
  28. data/docs/testimonials/hvmn.md +25 -0
  29. data/docs/testimonials/resortpass.md +13 -0
  30. data/docs/testimonials/testimonials.md +28 -0
  31. data/docs/tutorial.md +123 -11
  32. data/lib/generators/react_on_rails/dev_tests_generator.rb +1 -0
  33. data/lib/generators/react_on_rails/install_generator.rb +2 -0
  34. data/lib/react_on_rails.rb +1 -0
  35. data/lib/react_on_rails/assets_precompile.rb +3 -0
  36. data/lib/react_on_rails/configuration.rb +2 -1
  37. data/lib/react_on_rails/git_utils.rb +2 -0
  38. data/lib/react_on_rails/helper.rb +71 -70
  39. data/lib/react_on_rails/json_output.rb +1 -1
  40. data/lib/react_on_rails/locales_to_js.rb +2 -0
  41. data/lib/react_on_rails/react_component/render_options.rb +4 -0
  42. data/lib/react_on_rails/server_rendering_js_code.rb +42 -0
  43. data/lib/react_on_rails/server_rendering_pool/ruby_embedded_java_script.rb +44 -14
  44. data/lib/react_on_rails/utils.rb +5 -1
  45. data/lib/react_on_rails/version.rb +1 -1
  46. data/lib/react_on_rails/version_checker.rb +4 -1
  47. data/lib/react_on_rails/webpacker_utils.rb +9 -1
  48. data/package-scripts.yml +46 -0
  49. data/package.json +24 -15
  50. data/rakelib/release.rake +3 -2
  51. data/react_on_rails.gemspec +1 -1
  52. data/webpackConfigLoader.js +2 -2
  53. data/yarn.lock +4431 -1689
  54. metadata +18 -10
  55. data/docs/testimonials.md +0 -11
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: f438e5ff9e6b2697d00f7232f748c3829b53099f5e048c68db7df913e7b0e778
4
- data.tar.gz: a285c7806a308fafb386dd1e9800a3650349a0d38ff09c03ec190ee3f795075f
3
+ metadata.gz: fac1458d15f951224259dc1408c2950af8914d7dbc9529220a01a3e2665add94
4
+ data.tar.gz: d8b5e6d03dbc89385892b8e22db377c8639c8fe15d466db802c86d762f0cee39
5
5
  SHA512:
6
- metadata.gz: 153503d0d3913c8bdd74f818d5892da1d14aace2de687aa44b6539772dcef49d8555a4265f5ce56f531ea4fad428f882f0e66cf99e6149a7af1dd708e0c22201
7
- data.tar.gz: 6766c004cbd7358501179fadfffe8e5c50682be85b38bcc5c147e5c72f92a15f2a1afcf6cf36303fe2f9e45e2b22cf6cf38234d93b63da3cc7cf1ba2b309d271
6
+ metadata.gz: c44ef75d3c44f87ee3be8037136fc11154a59fcaae31d223446a7e50621a4773955de4f61f36d7d2e062bb49ca60c771ce853278b21197d4c7842c1162bfb71f
7
+ data.tar.gz: ed423208f616c125bf8ff20e42a522ca9107df7f04cb7181815dc422886b066147c766804e2d58f1051604902186fdce05929237b17e5056cca1cdcaf96131fe
data/.eslintrc CHANGED
@@ -1,8 +1,11 @@
1
1
  ---
2
- extends: eslint-config-shakacode
2
+ extends:
3
+ - eslint-config-shakacode
4
+ - prettier
5
+ - prettier/react
3
6
 
4
7
  plugins:
5
- - react
8
+ - prettier
6
9
 
7
10
  globals:
8
11
  __DEBUG_SERVER_ERRORS__: true
@@ -15,6 +18,9 @@ env:
15
18
 
16
19
  rules:
17
20
  no-console: 0
21
+ function-paren-newline: 0
22
+ object-curly-newline: 0
23
+
18
24
 
19
25
  # https://github.com/benmosher/eslint-plugin-import/issues/340
20
26
  import/no-extraneous-dependencies: 0
@@ -0,0 +1 @@
1
+ node_modules
@@ -0,0 +1,20 @@
1
+ printWidth: 110
2
+ tabWidth: 2
3
+ useTabs: false
4
+ semi: true
5
+ singleQuote: true
6
+ trailingComma: all
7
+ bracketSpacing: true
8
+ jsxBracketSameLine: false
9
+ parser: flow
10
+
11
+ overrides:
12
+ - files: "*.@(css|scss)"
13
+ options:
14
+ parser: css
15
+ singleQuote: false
16
+ printWidth: 120
17
+ - files: "*.@(json)"
18
+ options:
19
+ parser: json
20
+ printWidth: 100
@@ -0,0 +1,3 @@
1
+ {
2
+ "requireCleanWorkingDir": false
3
+ }
@@ -4,10 +4,9 @@ language: ruby
4
4
 
5
5
  rvm:
6
6
  # Rails 5 requires 2.2
7
- - 2.3.1
8
- - 2.4.1
9
- - 2.5.0
10
- - 2.2.6
7
+ - 2.5.3
8
+ - 2.6.0
9
+ - 2.2.10
11
10
  services:
12
11
  - docker
13
12
 
@@ -36,7 +35,7 @@ before_install:
36
35
  - "/sbin/start-stop-daemon --start --quiet --pidfile /tmp/custom_xvfb_99.pid --make-pidfile --background --exec /usr/bin/Xvfb -- :99 -ac -screen scn 1600x1200x16"
37
36
 
38
37
  install:
39
- - travis_retry gem install bundler
38
+ - travis_retry gem install bundler -v '<2' # Ruby 2.2 and Rails 3.2 & 4.2 depend on bundler 1.x.
40
39
  - travis_retry nvm install 8.11.3
41
40
  - node -v
42
41
  - travis_retry npm i -g yarn
@@ -54,13 +53,15 @@ script:
54
53
  matrix:
55
54
  exclude:
56
55
  - gemfile: spec/dummy_no_webpacker/Gemfile.rails32
57
- rvm: 2.3.1
56
+ rvm: 2.3.8
58
57
  - gemfile: spec/dummy_no_webpacker/Gemfile.rails32
59
- rvm: 2.4.1
58
+ rvm: 2.4.5
60
59
  - gemfile: spec/dummy_no_webpacker/Gemfile.rails32
61
- rvm: 2.5.0
60
+ rvm: 2.5.3
61
+ - gemfile: spec/dummy_no_webpacker/Gemfile.rails32
62
+ rvm: 2.6.0
62
63
  - gemfile: spec/dummy/Gemfile
63
- rvm: 2.2.6
64
+ rvm: 2.2.10
64
65
 
65
66
  notifications:
66
67
  slack:
@@ -1,7 +1,7 @@
1
1
  # Change Log
2
2
  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.
3
3
 
4
- 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.
4
+ 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.
5
5
 
6
6
  ## Need Help Migrating?
7
7
  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 [ShakaCode Pro Support](https://www.shakacode.com/work/shakacode-pro-support.pdf).
@@ -15,6 +15,59 @@ Please follow the recommendations outlined at [keepachangelog.com](http://keepac
15
15
  Changes since last non-beta release.
16
16
 
17
17
  *Please add entries here for your pull requests that are not yet released.*
18
+ ### [11.3.1] - 2020-10-01
19
+ #### Fixed
20
+ Update the init per backport of 12.0.3. [PR 1331](https://github.com/shakacode/react_on_rails/pull/1331)
21
+ by [justin808](https://github.com/justin808).
22
+
23
+ * Should fix issue 1330.
24
+ * Component not loading in Chrome, DOMContentLoaded not called.
25
+ * https://github.com/shakacode/react_on_rails/issues/1330
26
+
27
+ So long as the document is not loading, we can assume:
28
+ The document has finished loading and the document has been parsed
29
+ but sub-resources such as images, stylesheets and frames are still loading.
30
+ If lazy asynch loading is used, such as with loadable-components, then the init
31
+ function will install some handler that will properly know when to do hyrdation.
32
+
33
+
34
+ ### [11.3.0] - 2019-04-20
35
+ #### Added
36
+ - Added method for retrieving any option from `render_options` [PR 1213](https://github.com/shakacode/react_on_rails/pull/1213)
37
+ by [ashgaliyev](https://github.com/ashgaliyev).
38
+
39
+ - html_options can now has option for 'tag' to add dynamically html element. like this: `html_options: { tag: "span" }`.
40
+ [PR 1208](https://github.com/shakacode/react_on_rails/pull/1208) by [tahsin352](https://github.com/tahsin352).
41
+
42
+ ### [11.2.2] - 2018-12-24
43
+ #### Improved
44
+ - rails_context can more easily be called from controller methods. The mandatory param of server_side has been made optional.
45
+
46
+ ### [11.2.1] - 2018-12-06
47
+ ## MIGRATION for v11.2
48
+ - If using **React on Rails Pro**, upgrade react_on_rails_pro to a version >= 1.3.
49
+
50
+ #### Improved
51
+ - To support React v16, updated API for manually calling `ReactOnRails.render(name, props, domNodeId, hydrate)`. Added 3rd @param hydrate Pass truthy to update server rendered html. Default is falsey Any truthy values calls hydrate rather than render. [PR 1159](https://github.com/shakacode/react_on_rails/pull/1159) by [justin808](https://github.com/justin808) and [coopersamuel](https://github.com/coopersamuel).
52
+
53
+ - Enabled the use of webpack-dev-server with Server-side rendering. [PR 1173](https://github.com/shakacode/react_on_rails/pull/1173) by [justin808](https://github.com/justin808) and [judahmeek](https://github.com/judahmeek).
54
+
55
+ #### Changed
56
+ - Changed the default for:
57
+ ```rb
58
+ config.raise_on_prerender_error = Rails.env.development?
59
+ ```
60
+
61
+ Thus, developers will need to fix server rendering errors before continuing.
62
+ [PR 1145](https://github.com/shakacode/react_on_rails/pull/1145) by [justin808](https://github.com/justin808).
63
+
64
+ ### 11.2.0 - 2018-12-06
65
+ Do not use. Unpublished. Caused by an issue with the release script.
66
+
67
+ ### [11.1.8] - 2018-10-14
68
+
69
+ #### Improved
70
+ - Improved tutorial and support for HMR when using `rails/webpacker` for Webpack configuration. [PR 1156](https://github.com/shakacode/react_on_rails/pull/1156) by [justin808](https://github.com/justin808).
18
71
 
19
72
  ### [11.1.7] - 2018-10-10
20
73
  #### Fixed
@@ -45,7 +98,7 @@ Changes since last non-beta release.
45
98
 
46
99
  #### Fixed
47
100
  - Tests now properly exit if the config.build_test_command fails!
48
- - Source path for project using Webpacker would default to "app/javascript" even if when the node_modules
101
+ - Source path for project using Webpacker would default to "app/javascript" even if when the node_modules
49
102
  directory was set to "client". Fix now makes the configuration of this crystal clear.
50
103
  - renamed method RenderOptions.has_random_dom_id? to RenderOptions.random_dom_id? for rubocop rule.
51
104
  [PR 1133](https://github.com/shakacode/react_on_rails/pull/1133) by [justin808](https://github.com/justin808)
@@ -834,7 +887,11 @@ Best done with Object destructing:
834
887
  ##### Fixed
835
888
  - Fix several generator related issues.
836
889
 
837
- [Unreleased]: https://github.com/shakacode/react_on_rails/compare/11.1.7...master
890
+ [Unreleased]: https://github.com/shakacode/react_on_rails/compare/11.3.0...master
891
+ [11.3.0]: https://github.com/shakacode/react_on_rails/compare/11.2.2...11.3.0
892
+ [11.2.2]: https://github.com/shakacode/react_on_rails/compare/11.2.1...11.2.2
893
+ [11.2.1]: https://github.com/shakacode/react_on_rails/compare/11.1.8...11.2.1
894
+ [11.1.8]: https://github.com/shakacode/react_on_rails/compare/11.1.7...11.1.8
838
895
  [11.1.7]: https://github.com/shakacode/react_on_rails/compare/11.1.6...11.1.7
839
896
  [11.1.6]: https://github.com/shakacode/react_on_rails/compare/11.1.5...11.1.6
840
897
  [11.1.5]: https://github.com/shakacode/react_on_rails/compare/11.1.4...11.1.5
@@ -107,7 +107,7 @@ cd spec/dummy
107
107
  yarn
108
108
  ```
109
109
 
110
- Note, yarn will run the `postinstall` script of `spec/dummy/client` which runs `yarn link` to setup a sym link to the parent package.
110
+ Note, yarn will run the `postinstall` script of `spec/dummy/client` which runs `yarn link` to set up a sym link to the parent package.
111
111
 
112
112
  #### Example: Testing NPM changes with the dummy app
113
113
  1. Add `console.log('Hello!')` [here](https://github.com/shakacode/react_on_rails/blob/master/node_package/src/clientStartup.js#L181) in `react_on_rails/node_package/src/clientStartup.js` to confirm we're getting an update to the node package.
@@ -127,14 +127,6 @@ _Note: running `npm i` automatically builds the npm package before installing. H
127
127
  ### Prereqs
128
128
  After checking out the repo, making sure you have rvm and nvm setup (setup ruby and node), cd to `spec/dummy` and run `bin/setup` to install ruby dependencies. You can also run `bin/console` for an interactive prompt that will allow you to experiment.
129
129
 
130
- Additionally, our RSpec tests use the poltergeist web driver. You will need to install the phantomjs node module:
131
-
132
- ```sh
133
- yarn global add phantomjs-prebuilt
134
- ```
135
-
136
- Note this *must* be installed globally for the dummy test project rspec runner to see it properly.
137
-
138
130
  ### Local Node Package
139
131
  Because the example and dummy apps rely on the react-on-rails node package, they should link directly to your local version to pick up any changes you may have made to that package. To achieve this, switch to the dummy app's root directory and run this command below which runs something like [this script](spec/dummy/package.json#L14)
140
132
 
@@ -171,7 +163,7 @@ spec/dummy.
171
163
 
172
164
  ```sh
173
165
  # Optionally change default selenium_firefox driver
174
- export DRIVER=poltergeist
166
+ export DRIVER=selenium_firefox
175
167
  cd react_on_rails/
176
168
  yarn run dummy:spec
177
169
  ```
data/Gemfile CHANGED
@@ -30,12 +30,11 @@ gem "web-console", group: :development
30
30
  # below are copied from spec/dummy/Gemfile
31
31
  gem "capybara"
32
32
  gem "capybara-screenshot"
33
- gem "chromedriver-helper"
34
33
  gem "launchy"
35
- gem "poltergeist"
36
34
  gem "rspec-rails"
37
35
  gem "rspec-retry"
38
36
  gem "selenium-webdriver"
37
+ gem "webdrivers", "~> 3.0"
39
38
  gem "webpacker"
40
39
 
41
40
  gem "equivalent-xml", github: "mbklein/equivalent-xml"
@@ -65,7 +65,6 @@ group :test do
65
65
  gem "chromedriver-helper"
66
66
  gem "generator_spec"
67
67
  gem "launchy"
68
- gem "poltergeist"
69
68
  gem "rspec-rails"
70
69
  gem "rspec-retry"
71
70
  gem "selenium-webdriver"
data/README.md CHANGED
@@ -1,12 +1,10 @@
1
1
  # ReactOnRails
2
2
 
3
- [![License](https://img.shields.io/badge/license-mit-green.svg)](./LICENSE.md) [![Build Status](https://travis-ci.org/shakacode/react_on_rails.svg?branch=master)](https://travis-ci.org/shakacode/react_on_rails) [![Codeship Status for shakacode/react_on_rails](https://app.codeship.com/projects/cec6c040-971f-0134-488f-0a5146246bd8/status?branch=master)](https://app.codeship.com/projects/187011) [![Gem Version](https://badge.fury.io/rb/react_on_rails.svg)](https://badge.fury.io/rb/react_on_rails) [![npm version](https://badge.fury.io/js/react-on-rails.svg)](https://badge.fury.io/js/react-on-rails) [![Code Climate](https://codeclimate.com/github/shakacode/react_on_rails/badges/gpa.svg)](https://codeclimate.com/github/shakacode/react_on_rails) [![Coverage Status](https://coveralls.io/repos/shakacode/react_on_rails/badge.svg?branch=master&service=github)](https://coveralls.io/github/shakacode/react_on_rails?branch=master)
3
+ [![License](https://img.shields.io/badge/license-mit-green.svg)](./LICENSE.md) [![Build Status](https://travis-ci.org/shakacode/react_on_rails.svg?branch=master)](https://travis-ci.org/shakacode/react_on_rails) [![Gem Version](https://badge.fury.io/rb/react_on_rails.svg)](https://badge.fury.io/rb/react_on_rails) [![npm version](https://badge.fury.io/js/react-on-rails.svg)](https://badge.fury.io/js/react-on-rails) [![Code Climate](https://codeclimate.com/github/shakacode/react_on_rails/badges/gpa.svg)](https://codeclimate.com/github/shakacode/react_on_rails) [![Coverage Status](https://coveralls.io/repos/shakacode/react_on_rails/badge.svg?branch=master&service=github)](https://coveralls.io/github/shakacode/react_on_rails?branch=master) [![](https://ruby-gem-downloads-badge.herokuapp.com/react_on_rails?type=total)](https://rubygems.org/gems/react_on_rails)
4
4
 
5
5
  React on Rails integrates Rails with (server rendering of) Facebook's [React](https://github.com/facebook/react) front-end framework.
6
6
 
7
- Intersted in optimizing your webpack setup for React on Rails including code splitting with react-router v4, webpack v4, and react-loadable? [Contact me](mailto:justin@shakacode.com).
8
-
9
- ShakaCode is **[currently looking to hire](http://www.shakacode.com/about/#work-with-us)** like-minded 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 getting into [Reason](https://reasonml.github.io/)!
7
+ Interested in optimizing your webpack setup for React on Rails including code splitting with react-router v4, webpack v4, and react-loadable with server side rendering? [Contact Justin Gordon](mailto:justin@shakacode.com).
10
8
 
11
9
  # Intro
12
10
 
@@ -16,14 +14,16 @@ To provide an opinionated and optimal framework for integrating Ruby on Rails wi
16
14
 
17
15
  ## Features and Why React on Rails?
18
16
 
19
- Given that rails/webpacker gem already provides basic React integration, why would you use "React on Rails"? Server rendering, often used for SEO and performance, is not offered by rails/webpacker.
17
+ Given that rails/webpacker gem already provides basic React integration, why would you use "React on Rails"?
20
18
 
21
- 1. The 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 1request to your API.
22
- 1. [Redux](https://github.com/reactjs/redux) and [React Router](https://github.com/reactjs/react-router) integration.
19
+ 1. Server rendering, often used for SEO crawler indexing and UX performance, is not offered by rails/webpacker.
20
+ 1. The 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.
21
+ 1. [Redux](https://github.com/reactjs/redux) and [React Router](https://github.com/reactjs/react-router) integration with server-side-rendering.
23
22
  1. [Internationalization (I18n) and (localization)](https://github.com/shakacode/react_on_rails/blob/master/docs/basics/i18n.md)
24
- 1. [RSpec Test Helpers Configuration](docs/basics/rspec-configuration.md) to ensure your Webpack bundles are ready for tests.
23
+ 1. [RSpec Test Helpers Configuration](docs/basics/rspec-configuration.md) to ensure your Webpack bundles are ready for tests. _(and for [Minitest](docs/basics/minitest-configuration.md))._
25
24
  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/).
26
- 1. [Reason ML Support](https://github.com/shakacode/reason-react-on-rails-example)
25
+ 1. [Reason ML Support](https://github.com/shakacode/reason-react-on-rails-example).
26
+
27
27
 
28
28
  See the [react-webpack-rails-tutorial](https://github.com/shakacode/react-webpack-rails-tutorial) for an example of a live implementation and code.
29
29
 
@@ -35,8 +35,9 @@ _Requires creating a free account._
35
35
 
36
36
  React on Rails Pro provides Node server rendering and other performance enhancements for React on Rails.
37
37
 
38
- ![2018-09-11_10-31-11](https://user-images.githubusercontent.com/1118459/45467845-5bcc7400-b6bd-11e8-91e1-e0cf806d4ea4.png)
38
+ [![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)
39
39
 
40
+ * [HVMN Testimonial, by Paul Benigeri, October 12, 2018](./docs/testimonials/hvmn.md)
40
41
  * [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)
41
42
  * [Egghead React on Rails Pro Deployment Highlights](https://github.com/shakacode/react_on_rails/wiki/Egghead-React-on-Rails-Pro-Deployment-Highlights)
42
43
 
@@ -59,6 +60,14 @@ Please [email me (Justin Gordon), the creator of React on Rails](mailto:justin@s
59
60
 
60
61
  ## Testimonials for Hiring ShakaCode and our "Pro Support"
61
62
 
63
+ [HVMN Testimonial, Written by Paul Benigeri, October 12, 2018](./docs/testimonials/hvmn.md)
64
+
65
+ > 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.
66
+
67
+ [ResortPass Testimonial, by Leora Juster, December 10, 2018](./docs/testimonials/resortpass.md)
68
+
69
+ > 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.
70
+
62
71
  From Kyle Maune of Cooper Aerial, May 4, 2018
63
72
 
64
73
  ![image](https://user-images.githubusercontent.com/1118459/40891236-9b0b406e-671d-11e8-80ee-c026dbd1d5a2.png)
@@ -86,7 +95,7 @@ Note, the best way to understand how to use ReactOnRails is to study a few simpl
86
95
  1. Do the quick [tutorial](docs/tutorial.md).
87
96
  2. Add React on Rails to an existing Rails app per [the instructions](docs/basics/installation-into-an-existing-rails-app.md).
88
97
  3. Look at [spec/dummy](spec/dummy), a simple, no DB example.
89
- 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).
98
+ 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).
90
99
 
91
100
  ## Basic Installation
92
101
 
@@ -262,7 +271,7 @@ ReactOnRails will automatically detect a registered generator function. Thus, th
262
271
 
263
272
  Another reason to use a generator 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`.
264
273
 
265
- For server rendering, if you wish to return multiple HTML strings from a generator function, you may return an Object from your generator 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:
274
+ For server rendering, if you wish to return multiple HTML strings from a generator function, you may return an Object from your generator 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:
266
275
 
267
276
  ```js
268
277
  { renderedHtml: { componentHtml, customKey1, customKey2} }
@@ -288,7 +297,7 @@ Here are some highly recommended next articles to read:
288
297
  1. [How React on Rails Works](./docs/basics/how-react-on-rails-works.md)
289
298
  1. [Recommended Project Structure](./docs/basics/recommended-project-structure.md)
290
299
  1. [Webpack Configuration](./docs/basics/webpack-configuration.md)
291
- 1. [View Helpers API](./docs/view-helpers-api.md)
300
+ 1. [View Helpers API](./docs/api/view-helpers-api.md)
292
301
  1. [Caching and Performance: React on Rails Pro](https://github.com/shakacode/react_on_rails/wiki).
293
302
  1. [Deployment](docs/basics/deployment.md).
294
303
 
@@ -317,15 +326,22 @@ Bug reports and pull requests are welcome. See [Contributing](CONTRIBUTING.md) t
317
326
 
318
327
  # Supporters
319
328
 
320
- 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), and we use [BrowserStack](https://www.browserstack.com) to solve problems with oddball browsers.
329
+ 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.
321
330
 
322
331
  [![Scout](https://user-images.githubusercontent.com/1118459/41828269-106b40f8-77d0-11e8-8d19-9c4b167ef9d8.png)](https://scoutapp.com/)
323
332
  [![BrowserStack](https://cloud.githubusercontent.com/assets/1118459/23203304/1261e468-f886-11e6-819e-93b1a3f17da4.png)](https://www.browserstack.com)
333
+ [![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)
334
+
335
+ ## Clubhouse
336
+ 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/mvfd30S). 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/mvfd30S) you'll be supporting ShakaCode and, thus, React on Rails!
324
337
 
325
338
  *If you'd like to support React on Rails and have your company listed here, [get in touch](mailto:justin@shakacode.com).*
326
339
 
327
340
  Aloha and best wishes from Justin and the ShakaCode team!
328
341
 
342
+ # Work with Us
343
+ 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 getting into [Reason](https://reasonml.github.io/)!
344
+
329
345
  # License
330
346
 
331
347
  The gem is available as open source under the terms of the [MIT License](LICENSE.md).
data/SUMMARY.md CHANGED
@@ -6,12 +6,15 @@
6
6
  + [React on Rails Basic Installation Tutorial](./docs/tutorial.md)
7
7
  + [Webpack Configuration](./docs/basics/webpack-configuration.md)
8
8
  + [How React on Rails Works](./docs/basics/how-react-on-rails-works.md)
9
+ + [Client vs. Server Rendering](./docs/basics/client-vs-server-rendering.md)
10
+ + [React Server Rendering](./docs/basics/react-server-rendering.md)
9
11
  + [Recommended Project Structure](./docs/basics/recommended-project-structure.md)
10
12
  + [Generator Functions and the RailsContext](docs/basics/generator-functions-and-railscontext.md)
11
13
  + [Caching and Performance: React on Rails Pro](https://github.com/shakacode/react_on_rails/wiki).
12
14
  + [Deployment](docs/basics/deployment.md).
13
15
  + [React on Rails Internationalization (I18n, localization)](docs/basics/i18n.md)
14
16
  + [RSpec Test Helpers Configuration](docs/basics/rspec-configuration.md)
17
+ + [Minitest Configuration](docs/basics/minitest-configuration.md)
15
18
  + [Upgrading React on Rails](docs/basics/upgrading-react-on-rails.md)
16
19
 
17
20
  ## **API**
@@ -24,6 +27,7 @@
24
27
  + [Generator Details](docs/basics/generator-details.md)
25
28
  + [Updating Dependencies](./docs/additional-reading/updating-dependencies.md)
26
29
  + [Manual Installation Overview](docs/misc-pending/manual-installation-overview.md)
30
+ + [Upgrading from rails/webpacker v3 to v4](docs/additional-reading/upgrade-webpacker-v3-to-v4.md)
27
31
 
28
32
  ## **Rails**
29
33
  + [Rails Engine Integration](./docs/additional-reading/rails-engine-integration.md)
@@ -37,7 +41,7 @@
37
41
  + [Babel](./docs/additional-reading/babel.md)
38
42
  + [React Router](./docs/additional-reading/react-router.md)
39
43
  + [React & Redux](./docs/additional-reading/react-and-redux.md)
40
- + [Webpack Tips](./docs/additional-reading/webpack-tips.md)
44
+ + [Webpack Tips](./docs/additional-reading/webpack.md)
41
45
  + [Server Rendering Tips](./docs/additional-reading/server-rendering-tips.md)
42
46
  + [Code Splitting](docs/misc-pending/code-splitting.md)
43
47
  + [AngularJS Integration and Migration to React on Rails](./docs/additional-reading/angular-js-integration-migration.md)
@@ -50,7 +54,7 @@
50
54
  + [Setting up Hot Reloading during Rails Development, API docs](./docs/api/ruby-api-hot-reload-view-helpers.md)
51
55
  + [Developing with the Webpack Dev Server](./docs/additional-reading/webpack-dev-server.md)
52
56
  + [Webpack, the Asset Pipeline, and Using Assets w/ React](./docs/additional-reading/rails-assets-relative-paths.md)
53
- + [Hot Reloading of Assets For Rails Development](./docs/additional-reading/hot-reloading-rails-development.md)
57
+ + [Hot Reloading of Assets For Rails Development for Asset Pipeline](docs/additional-reading/hot-reloading-rails-development-asset-pipeline.md)
54
58
 
55
59
  ## **[CONTRIBUTING](CONTRIBUTING.md)**
56
60
  + [Generator Testing](./docs/contributor-info/generator-testing.md)
@@ -1,19 +1,9 @@
1
- # Live Reloading vs. Hot Reloading (aka HMR)
2
-
3
- The use of the [webpack-dev-server](https://webpack.js.org/configuration/dev-server/) provides "Live Reloading" by default. The difference between live and hot reloading is that live reloading will act similarly to hitting refresh in the browser. Hot reloading will attempt to preserve the state of any props.
4
-
5
- See the Webpack document [Hot Module Replacement](https://webpack.js.org/concepts/hot-module-replacement/) for more details on the concepts of live vs. hot reloading.
6
-
7
- The remainder of this document discusses HMR.
8
-
9
- # Using the Webpacker Webpack setup
10
-
11
- If you are using the default Webpacker setup of running the dev server with `bin/webpack-dev-server`, see the [Webpacker Webpack Dev Server discussion of HMR](https://github.com/rails/webpacker/blob/master/docs/webpack-dev-server.md#hot-module-replacement).
1
+ *This document should only be referenced if you're **NOT** using the current technique of the rails/webpacker helpers to place your client-side assets in your `/public` directory.*
12
2
 
13
3
 
14
4
  # Hot Reloading of Assets For Rails Development
15
5
 
16
- _Note, this document is not yet updated for React on Rails v8+. See [PR #865](https://github.com/shakacode/react_on_rails/pull/865) for a detailed example of doing hot reloading using V8+ with Webpack v2. Any volunteers to update this page? See [#772](https://github.com/shakacode/react_on_rails/issues/772) and [#361](https://github.com/shakacode/react-webpack-rails-tutorial/issues/361)._
6
+ _See [PR #865](https://github.com/shakacode/react_on_rails/pull/865) for a detailed example of doing hot reloading using V8+ with Webpack v2. See [#772](https://github.com/shakacode/react_on_rails/issues/772) and [#361](https://github.com/shakacode/react-webpack-rails-tutorial/issues/361)._
17
7
 
18
8
  ------
19
9
 
@@ -39,7 +39,7 @@ const assetLoaderRules = [
39
39
 
40
40
 
41
41
 
42
- A full example can be found at [spec/dummy/client/app/components/ImageExample/ImageExample.js](../../spec/dummy/client/app/components/ImageExample/ImageExample.js)
42
+ A full example can be found at [spec/dummy/client/app/components/ImageExample/ImageExample.jsx](../../spec/dummy/client/app/components/ImageExample/ImageExample.jsx)
43
43
 
44
44
  You are free to use images either in image tags or as background images in SCSS files. You can
45
45
  use a "global" location of /client/app/assets/images or a relative path to your JS or SCSS file, as
@@ -12,9 +12,10 @@ You can easily render React components in your JavaScript with `render` method t
12
12
  * @param name Name of your registered component
13
13
  * @param props Props to pass to your component
14
14
  * @param domNodeId
15
+ * @param hydrate [optional] Pass truthy to update server rendered html. Default is falsy
15
16
  * @returns {virtualDomElement} Reference to your component's backing instance
16
17
  */
17
- ReactOnRails.render(componentName, props, elementId)
18
+ ReactOnRails.render(componentName, props, domNodeId)
18
19
  ```
19
20
 
20
21
  ## Why do we need this?