redux_rails 0.1.3 → 0.1.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 CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 47499912ebfcb4b6458a809851ce58e051413625
4
- data.tar.gz: b15c4bf9d2b82456e7a0d7a34a49e8533ae748d1
3
+ metadata.gz: '0458dcd23ed778b5909241bbc905235c77016732'
4
+ data.tar.gz: 56dd6816d30383dc66564fdc15eafc238740e943
5
5
  SHA512:
6
- metadata.gz: 79a79ef291e0c10c954b67273b19632cf43f45282bca22a11b23b6e8e930d80483a69b7326e7d9d99cf7dec6c1ceadfe91d37b2b9d696264c843b0a410ac9af4
7
- data.tar.gz: 5112f1d49cc2409d7eade0bcc242f72afb533848c861be0fdbc2d3c45ae47cc5a23c89eb40e3947dca2b54701f64b504049d73328d4005f85250f18a49b3a1cc
6
+ metadata.gz: 9447cf2697c8019fc1fdd5997548a6b2fb5fbdf67477e5807c155f96647f01ef1c87befaa42e7014c4aab52c04f0da8ea3574ce3b54f0f7bfcdb7f11e68a23f8
7
+ data.tar.gz: 1aafd80b82473c258bfbdbd8469bc2fb0e0a212bd743375ae454eda11b7a9c0c05c293fab6720706797aac6638aca837da2e6b46887598cf5eae47294c4248ea
data/README.md CHANGED
@@ -1,13 +1,14 @@
1
1
  # ReduxRails
2
2
 
3
3
  ## Highlights
4
- - install, component and container generator
4
+ - install, pack, component and container generator
5
5
  - creates a new pack tag for each `rails g redux_rails:install #{your_app_name}` command and installs the necessary lines to manifest.json. Allowing you to have several seperate React apps inside of a single rails project.
6
6
  - install component and container folders in any folder location from the command line with the necessary import/export/require lines.
7
7
  - react-router-dom
8
8
  - redux-devtools-extension
9
9
 
10
10
  ### Install generator
11
+ - Installs the following dependencies `yarn add react-redux redux redux-devtools-extension react-router-dom react-router-redux history`
11
12
  - Installs a new #{your_app_name}.jsx file in app/javascript/packs with additional Redux setup options commented out for modifications.
12
13
  ###### *if you leave #{your_app_name} blank. file, component and container names will default to 'app'*
13
14
  - Links it to public/packs/manifest.json
@@ -30,6 +31,9 @@
30
31
  * app/javascript/src/#{your_app_name}/containers/app/constants.js,
31
32
  * app/javascript/src/#{your_app_name}/containers/app/appReducer.js
32
33
 
34
+ ### Pack generator
35
+ #### Runs the Install generator without re-installing the javascript dependencies again
36
+
33
37
  ### Component generator
34
38
  #### Created folder/files
35
39
  * app/javascript/src/#{your_app_name}/components/app/#{your_component_name},
@@ -78,7 +82,7 @@ config.x.webpacker[:dev_server_host] = "http://127.0.0.1:8080"
78
82
 
79
83
  To create the packs/manifest.json run:
80
84
 
81
- $ ./bin/webpack-dev-server --host 127.0.0.1
85
+ $ bin/webpack-dev-server --host 127.0.0.1
82
86
 
83
87
  At this point, Rails has created a javascript friendly app for you. To render the sample react component rails creates for you follow these steps. Or to start using the redux_rails gem skip down to Usage.
84
88
 
@@ -109,29 +113,33 @@ Hello React!
109
113
  ## Usage
110
114
 
111
115
  ### Install generator
112
- Once your rails app is setup with the webpack=react option and the redux-rails gem is installed execute:
116
+ ###### *only run this once! If you wish to create additional pack files run `rails generate redux_rails:pack #{pack_name}`*
117
+ Once your rails app is setup with the webpack=react option and the redux-rails gem is installed and your `config/environments/development.rb` is updated execute:
113
118
  ###### *if you leave #{your_app_name} blank file, component and container names will default to 'app'*
114
119
 
115
120
  $ rails generate redux_rails:install #{your_app_name}
116
121
 
117
122
  This will install the following files:
118
- ```
119
- app/javascript/src,
120
- app/javascript/src/#{your_app_name}/reducer.js, "this is for your combineReducer"
121
-
122
- app/javascript/src/#{your_app_name}/components,
123
- app/javascript/src/#{your_app_name}/components/#{your_app_name},
124
- app/javascript/src/#{your_app_name}/components/#{your_app_name}/#{your_app_name}.js,
125
- app/javascript/src/#{your_app_name}/components/#{your_app_name}/#{your_app_name}.scss
126
-
127
- app/javascript/src/#{your_app_name}/containers,
128
- app/javascript/src/#{your_app_name}/containers/#{your_app_name},
129
- app/javascript/src/#{your_app_name}/containers/#{your_app_name}/#{your_app_name}.js,
130
- app/javascript/src/#{your_app_name}/containers/#{your_app_name}/action.js,
131
- app/javascript/src/#{your_app_name}/containers/#{your_app_name}/actionTypes.js,
132
- app/javascript/src/#{your_app_name}/containers/#{your_app_name}/constants.js,
133
- app/javascript/src/#{your_app_name}/containers/#{your_app_name}/#{your_app_name}Reducer.js
134
- ```
123
+ ###### src section
124
+ - `app/javascript/src`
125
+ - `app/javascript/src/#{your_app_name}/reducer.js` *"this is for your combineReducer"*
126
+ ###### components section
127
+ - `app/javascript/src/#{your_app_name}/components`
128
+ - `app/javascript/src/#{your_app_name}/components/#{your_app_name}`
129
+ - `app/javascript/src/#{your_app_name}/components/#{your_app_name}/#{your_app_name}.js`
130
+ - `app/javascript/src/#{your_app_name}/components/#{your_app_name}/#{your_app_name}.scss`
131
+ ###### containers section
132
+ - `app/javascript/src/#{your_app_name}/containers`
133
+ - `app/javascript/src/#{your_app_name}/containers/#{your_app_name}`
134
+ - `app/javascript/src/#{your_app_name}/containers/#{your_app_name}/#{your_app_name}.js`
135
+ - `app/javascript/src/#{your_app_name}/containers/#{your_app_name}/action.js`
136
+ - `app/javascript/src/#{your_app_name}/containers/#{your_app_name}/actionTypes.js`
137
+ - `app/javascript/src/#{your_app_name}/containers/#{your_app_name}/constants.js`
138
+ - `app/javascript/src/#{your_app_name}/containers/#{your_app_name}/#{your_app_name}Reducer.js`
139
+
140
+ and adds and installs these dependencies to your package.json file:
141
+
142
+ `react-redux` `redux` `redux-devtools-extension` `react-router-dom` `react-router-redux` `history`
135
143
 
136
144
  Once the install generator is finished:
137
145
  1. add the following pack_tags to the file you want the react component to be rendered in
@@ -144,10 +152,36 @@ Once the install generator is finished:
144
152
  #{your_app_name} component!
145
153
  find me in find me in app/javascript/src/#{your_app_name}/components/#{your_app_name}#{your_app_name}.js
146
154
  ```
155
+ ### Pack generator
156
+ The Pack generator takes a single name argument
157
+ ###### *if you leave #{your_app_name} blank file, component and container names will default to 'app'*
158
+ To create a new Pack file run:
159
+
160
+ $ rails generate pack #{your_app_name}
161
+
162
+ This will generate a new React app inside of the `app/javascript/src` folder. Including a new `pack/#{your_app_name}.jsx` file and links to `public/packs/manifest.json`. Includes the following folder and files:
163
+
164
+ ###### src section
165
+ - `app/javascript/src`
166
+ - `app/javascript/src/#{your_app_name}/reducer.js` *"this is for your combineReducer"*
167
+ ###### components section
168
+ - `app/javascript/src/#{your_app_name}/components`
169
+ - `app/javascript/src/#{your_app_name}/components/#{your_app_name}`
170
+ - `app/javascript/src/#{your_app_name}/components/#{your_app_name}/#{your_app_name}.js`
171
+ - `app/javascript/src/#{your_app_name}/components/#{your_app_name}/#{your_app_name}.scss`
172
+ ###### containers section
173
+ - `app/javascript/src/#{your_app_name}/containers`
174
+ - `app/javascript/src/#{your_app_name}/containers/#{your_app_name}`
175
+ - `app/javascript/src/#{your_app_name}/containers/#{your_app_name}/#{your_app_name}.js`
176
+ - `app/javascript/src/#{your_app_name}/containers/#{your_app_name}/action.js`
177
+ - `app/javascript/src/#{your_app_name}/containers/#{your_app_name}/actionTypes.js`
178
+ - `app/javascript/src/#{your_app_name}/containers/#{your_app_name}/constants.js`
179
+ - `app/javascript/src/#{your_app_name}/containers/#{your_app_name}/#{your_app_name}Reducer.js`
180
+
147
181
 
148
182
  ### Component generator
149
183
  The Component generator takes two arguments (the new Component name and the desired install location)
150
- ###### *if you leave #{your_app_name} blank file, component and container names will default to 'app'*
184
+ ###### *if you leave #{your_app_name} or #{your_component_name} blank file, component and container names will default to 'app'*
151
185
  To create a new component run:
152
186
 
153
187
  $ rails generate component #{your_component_name} #{your_app_name}
@@ -159,7 +193,7 @@ This will generate a new folder inside of your components folder with the follow
159
193
 
160
194
  ### Container generator
161
195
  The Container generator takes two arguments (the new Container name and the desired install location)
162
- ###### *if you leave #{your_app_name} blank file, component and container names will default to 'app'*
196
+ ###### *if you leave #{your_app_name} or #{your_container_name} blank file, component and container names will default to 'app'*
163
197
  To create a new container run:
164
198
 
165
199
  $ rails generate container #{your_container_name} #{your_app_name}
@@ -0,0 +1,129 @@
1
+ class PackGenerator < Rails::Generators::NamedBase
2
+ source_root File.expand_path('../templates', __FILE__)
3
+ argument :name, :type => :string, :default => "app"
4
+
5
+ def create_src_directory
6
+ empty_directory("app/javascript/src")
7
+ empty_directory("app/javascript/src/#{name}")
8
+ end
9
+
10
+ def create_reducer_base_file
11
+ create_file "app/javascript/src/#{name}/reducer.js",
12
+ "import { combineReducers } from 'redux'
13
+ import #{name}Reducer from './containers/#{name}/#{name}Reducer.js'
14
+
15
+ const rootReducer = combineReducers({
16
+ #{name}Reducer
17
+ })
18
+
19
+ export default rootReducer"
20
+ end
21
+
22
+ def create_component_base_files
23
+ empty_directory("app/javascript/src/#{name}/components")
24
+ empty_directory("app/javascript/src/#{name}/components/#{name}")
25
+ create_file "app/javascript/src/#{name}/components/#{name}/#{name}.js",
26
+ "import React from 'react';
27
+ import './#{name}.scss';
28
+
29
+ const #{name} = () => (
30
+ <div className='#{name}'>
31
+ <h1>#{name} component!</h1>
32
+ <p>find me in app/javascript/src/#{name}/components/#{name}/#{name}.js</p>
33
+ </div>
34
+ )
35
+
36
+ export default #{name};"
37
+ create_file "app/javascript/src/#{name}/components/#{name}/#{name}.scss",
38
+ ".#{name} {
39
+
40
+ }"
41
+ end
42
+
43
+ def create_container_base_files
44
+ empty_directory("app/javascript/src/#{name}/containers")
45
+ empty_directory("app/javascript/src/#{name}/containers/#{name}")
46
+ create_file "app/javascript/src/#{name}/containers/#{name}/#{name}.js",
47
+ "import * as actions from './actions';
48
+ import * as constants from './constants';
49
+ import #{name}Reducer from './#{name}Reducer';
50
+
51
+ export default { actions, constants, #{name}Reducer };"
52
+ create_file "app/javascript/src/#{name}/containers/#{name}/actions.js",
53
+ "// import {} from './constants';
54
+ //import * as t from './actionTypes';
55
+
56
+ //export const someAction = (text) => ({
57
+ // type: t.SOME_ACTION,
58
+ // payload: { text }
59
+ //});"
60
+ create_file "app/javascript/src/#{name}/containers/#{name}/actionTypes.js",
61
+ "//export const SOME_ACTION = '#{name}/SOME_ACTION';"
62
+
63
+ create_file "app/javascript/src/#{name}/containers/#{name}/constants.js",
64
+ "// export const SOME_CONST = 'SOME_CONST';"
65
+
66
+ create_file "app/javascript/src/#{name}/containers/#{name}/#{name}Reducer.js",
67
+ "const #{name}Reducer = (state = {}, action) => {
68
+ switch (action.type) {
69
+ default:
70
+ return state;
71
+ }
72
+ };
73
+
74
+ export default #{name}Reducer;"
75
+ end
76
+
77
+ def create_pack
78
+ create_file "app/javascript/packs/#{name}.jsx",
79
+ "// add <%= javascript_pack_tag '#{name}' %> and <%= stylesheet_pack_tag '#{name}' %> to the html.erb file you would like your React App to be rendered.
80
+
81
+ import React from 'react'
82
+ import { render } from 'react-dom'
83
+ import { Provider } from 'react-redux'
84
+ import { createStore, combineReducers, applyMiddleware } from 'redux'
85
+
86
+ //this allows you to use the redux devtool in chrome
87
+ import { devToolsEnhancer } from 'redux-devtools-extension'
88
+
89
+ import { BrowserRouter as Router, Route, Link } from 'react-router-dom'
90
+
91
+ import #{name} from '../src/#{name}/components/#{name}/#{name}.js'
92
+
93
+ import rootReducer from '../src/#{name}/reducer'
94
+
95
+ //this is for devToolsEnhancer otherwise would be 'let store = createStore(rootReducer)'
96
+ let store = createStore(rootReducer, /* preloadedState, */ devToolsEnhancer(
97
+ // Specify name here, actionsBlacklist, actionsCreators and other options if needed
98
+ ));
99
+ console.log(store.getState())
100
+
101
+ // Note that subscribe() returns a function for unregistering the listener
102
+ let unsubscribe = store.subscribe(() =>
103
+ console.log(store.getState())
104
+ )
105
+
106
+ // Stop listening to state updates
107
+ unsubscribe()
108
+
109
+ document.addEventListener('DOMContentLoaded', () => {
110
+ render(
111
+ <Provider store={store}>
112
+ <Router>
113
+ <div>
114
+ <Route path=\"/\" component={#{name}} />
115
+ </div>
116
+ </Router>
117
+ </Provider>,
118
+ document.body.appendChild(document.createElement('div')),
119
+ )
120
+ })"
121
+ end
122
+
123
+ def insert_into_manifest
124
+ inject_into_file "public/packs/manifest.json", " \"#{name}.js\" : \"http://0.0.0.0:8080/packs/#{name}.js\",\n", :after => "{\n"
125
+
126
+ inject_into_file "public/packs/manifest.json", " \"#{name}.css\" : \"http://0.0.0.0:8080/packs/#{name}.css\",\n", :after => "\"#{name}.js\" : \"http://0.0.0.0:8080/packs/#{name}.js\",\n"
127
+ end
128
+
129
+ end
@@ -15,7 +15,7 @@ module ReduxRails
15
15
  def create_reducer_base_file
16
16
  create_file "app/javascript/src/#{name}/reducer.js",
17
17
  "import { combineReducers } from 'redux'
18
- import #{name}Reducer from './containers/#{name}/#{name}.js'
18
+ import #{name}Reducer from './containers/#{name}/#{name}Reducer.js'
19
19
 
20
20
  const rootReducer = combineReducers({
21
21
  #{name}Reducer
@@ -51,10 +51,10 @@ const #{name} = () => (
51
51
  create_file "app/javascript/src/#{name}/containers/#{name}/#{name}.js",
52
52
  "import * as actions from './actions';
53
53
  import * as constants from './constants';
54
- import #{name}Reducer from './reducer';
54
+ import #{name}Reducer from './#{name}Reducer';
55
55
 
56
56
  export default { actions, constants, #{name}Reducer };"
57
- create_file "app/javascript/src/#{name}/containers/#{name}/action.js",
57
+ create_file "app/javascript/src/#{name}/containers/#{name}/actions.js",
58
58
  "// import {} from './constants';
59
59
  //import * as t from './actionTypes';
60
60
 
@@ -130,5 +130,6 @@ document.addEventListener('DOMContentLoaded', () => {
130
130
 
131
131
  inject_into_file "public/packs/manifest.json", " \"#{name}.css\" : \"http://0.0.0.0:8080/packs/#{name}.css\",\n", :after => "\"#{name}.js\" : \"http://0.0.0.0:8080/packs/#{name}.js\",\n"
132
132
  end
133
+
133
134
  end
134
135
  end
@@ -1,3 +1,3 @@
1
1
  module ReduxRails
2
- VERSION = "0.1.3"
2
+ VERSION = "0.1.4"
3
3
  end
data/redux_rails.gemspec CHANGED
@@ -9,7 +9,7 @@ Gem::Specification.new do |spec|
9
9
  spec.authors = ["Luke Popwell"]
10
10
  spec.email = ["lukepopwell@mac.com"]
11
11
  spec.summary = %q{Setup React and Redux for Rails 5.1}
12
- spec.description = %q{Complete setup for React and Redux into Rails 5.1 pipeline or later. Includes initial install generator, component and container generator. Full description of install located at https://github.com/Luke-Popwell/redux_rails }
12
+ spec.description = %q{Complete setup for React and Redux into Rails 5.1 pipeline or later. Includes initial install generator, component and container generator. Full description of install located at "https://github.com/Luke-Popwell/redux_rails" }
13
13
  spec.homepage = "https://github.com/Luke-Popwell/redux_rails"
14
14
  spec.license = "MIT"
15
15
 
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: redux_rails
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.1.3
4
+ version: 0.1.4
5
5
  platform: ruby
6
6
  authors:
7
7
  - Luke Popwell
8
8
  autorequire:
9
9
  bindir: exe
10
10
  cert_chain: []
11
- date: 2017-07-16 00:00:00.000000000 Z
11
+ date: 2017-07-17 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: bundler
@@ -54,7 +54,7 @@ dependencies:
54
54
  version: '3.0'
55
55
  description: 'Complete setup for React and Redux into Rails 5.1 pipeline or later.
56
56
  Includes initial install generator, component and container generator. Full description
57
- of install located at https://github.com/Luke-Popwell/redux_rails '
57
+ of install located at "https://github.com/Luke-Popwell/redux_rails" '
58
58
  email:
59
59
  - lukepopwell@mac.com
60
60
  executables: []
@@ -71,6 +71,7 @@ files:
71
71
  - bin/setup
72
72
  - lib/generators/component/component_generator.rb
73
73
  - lib/generators/container/container_generator.rb
74
+ - lib/generators/pack/pack_generator.rb
74
75
  - lib/generators/redux_rails/install_generator.rb
75
76
  - lib/redux_rails.rb
76
77
  - lib/redux_rails/version.rb