react_rails_webpack 2.0.3 → 2.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/README.md +13 -7
- data/lib/react_rails_webpack/version.rb +1 -1
- metadata +1 -1
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: a2e0e208bffed31ac0fea62fccf7ff0f3b6fba56
|
4
|
+
data.tar.gz: 53ae37a29df2cda276e2e0ccd8e75238657c2e79
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: d662fff84b84af5030fd960e0e9e93e460b81af1155dcfcdb9250395b2138757aad7b6d28dd7ea691eb238e5c79ebd7ea5fcbc7d370dbe9101d1745bbbffeb35
|
7
|
+
data.tar.gz: 73ce7f41b6ab4f01b50d886a537d3332f76bcd0aeb8bae1b420483abd114a58b68516683ee36ccfb247c36d330298749dbfc7bc1fd4d3443364e9308a71797cf
|
data/README.md
CHANGED
@@ -16,7 +16,13 @@ A set of Rails generators that create all the necessary boilerplate code (with e
|
|
16
16
|
3. Run `bundle install`
|
17
17
|
4. Run `rails g react_rails_webpack:install` ([further explanation of what this does](#how-does-this-work))
|
18
18
|
|
19
|
-
##
|
19
|
+
## Requirements
|
20
|
+
|
21
|
+
- Rails version 4 or greater
|
22
|
+
- node version 4 or greater
|
23
|
+
- npm version 3 or greater
|
24
|
+
|
25
|
+
## See the demo components in action
|
20
26
|
|
21
27
|
### On webpack dev server
|
22
28
|
|
@@ -37,7 +43,7 @@ A set of Rails generators that create all the necessary boilerplate code (with e
|
|
37
43
|
|
38
44
|
Further explanation of what this does [here](#how-does-this-work).
|
39
45
|
|
40
|
-
###
|
46
|
+
### Set up an example page in your Rails app
|
41
47
|
|
42
48
|
`rails g react_rails_webpack:create_example_page`
|
43
49
|
|
@@ -123,14 +129,14 @@ export default {
|
|
123
129
|
- Wherever you want this component to render in your view, put a call to the `react_component` helper method with the components name and props, like so:
|
124
130
|
|
125
131
|
```ruby
|
126
|
-
render_component
|
132
|
+
render_component :CheckoutForm, { customerName: 'Harper' }
|
127
133
|
```
|
128
134
|
|
129
|
-
NOTE: Unless you're sure you know what you're doing, do not edit anything in the [client/app](lib/react_rails_webpack/client/app) folder except [the availableComponents file](lib/react_rails_webpack/client/app/availableComponents.js)). Those files are where the integration works it's magic (though of course feel free to read the files to check out how everything works).
|
135
|
+
NOTE: Unless you're sure you know what you're doing, do not edit anything in the [client/app](lib/react_rails_webpack/client/src/app) folder except [the availableComponents file](lib/react_rails_webpack/client/src/app/availableComponents.js)). Those files are where the integration works it's magic (though of course feel free to read the files to check out how everything works).
|
130
136
|
|
131
137
|
## Working with the Webpack Dev Server
|
132
138
|
|
133
|
-
`npm run start` will start a webpack development server with hot reloading that is completely independent of your Rails app. You can see the output of this server on any computer or mobile device on your local network by going to the appropriate url (which you can find by running `
|
139
|
+
`npm run start` will start a webpack development server with hot reloading that is completely independent of your Rails app. You can see the output of this server on any computer or mobile device on your local network by going to the appropriate url (which you can find by running `rake react_rails_webpack:print_server_info`). Any changes you make to your component files will be pushed immediately to all devices looking at the page.
|
134
140
|
|
135
141
|
## How does this work?
|
136
142
|
|
@@ -140,7 +146,7 @@ When you run the install generator like this:
|
|
140
146
|
|
141
147
|
This gem will setup a basic react integration with some example components (one standard react component and one using react with redux) under [a client folder](lib/react_rails_webpack/client) in your project's root.
|
142
148
|
|
143
|
-
The meat of the integration with Rails is in [the client/app folder](lib/react_rails_webpack/client/app), and [the app.js file](lib/react_rails_webpack/client/app.js). When your page loads in Rails, the `react_component` method creates divs that looks like this:
|
149
|
+
The meat of the integration with Rails is in [the client/app folder](lib/react_rails_webpack/client/src/app), and [the app.js file](lib/react_rails_webpack/client/src/app.js). When your page loads in Rails, the `react_component` method creates divs that looks like this:
|
144
150
|
|
145
151
|
```html
|
146
152
|
<div class="react-component-target" data-componentname="ComponentName" data-componentprops="{myProp: 'some value'}">
|
@@ -184,7 +190,7 @@ Assuming `react_component` finds a component that matches the it's given, it wil
|
|
184
190
|
|
185
191
|
Remember, while your changes to components will hot reload when you use the webpack dev server, they will not show up at all in your Rails app until you run the `npm run build` command. And they do NOT hot-reload when run in the context of your Rails app.
|
186
192
|
|
187
|
-
### Forgetting to add components to the
|
193
|
+
### Forgetting to add components to the [client/src/app/availableComponents.js](lib/react_rails_webpack/client/src/app/availableComponents.js) file
|
188
194
|
|
189
195
|
Components will not be accessible from Rails if you forget to add them here.
|
190
196
|
|