Skip to content

Commit 04f676b

Browse files
committed
Add hot reloading example
1 parent d6200bd commit 04f676b

File tree

14 files changed

+213
-0
lines changed

14 files changed

+213
-0
lines changed

examples/hot-reloading/.babelrc

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{
2+
presets: ['es2015', 'react'],
3+
plugins: ['transform-decorators-legacy', 'syntax-decorators'],
4+
ignore: [
5+
'**/nuclear-js-react-addons/**',
6+
]
7+
}

examples/hot-reloading/.gitignore

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
dist
2+
node_modules

examples/hot-reloading/index.html

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<!doctype html>
2+
<html>
3+
<head>
4+
<title>NuclearJS Hot Reloading</title>
5+
</head>
6+
7+
<body style="padding: 30px;">
8+
<div id="root"></div>
9+
<script src="http://localhost:3000/dist/app.js"></script>
10+
</body>
11+
</html>
12+

examples/hot-reloading/npm-debug.log

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
0 info it worked if it ends with ok
2+
1 verbose cli [ '/Users/jordan/.nvm/versions/node/v5.0.0/bin/node',
3+
1 verbose cli '/Users/jordan/.nvm/versions/node/v5.0.0/bin/npm',
4+
1 verbose cli 'start' ]
5+
2 info using [email protected]
6+
3 info using [email protected]
7+
4 verbose stack Error: missing script: start
8+
4 verbose stack at run (/Users/jordan/.nvm/versions/node/v5.0.0/lib/node_modules/npm/lib/run-script.js:148:19)
9+
4 verbose stack at /Users/jordan/.nvm/versions/node/v5.0.0/lib/node_modules/npm/lib/run-script.js:58:5
10+
4 verbose stack at /Users/jordan/.nvm/versions/node/v5.0.0/lib/node_modules/npm/node_modules/read-package-json/read-json.js:345:5
11+
4 verbose stack at checkBinReferences_ (/Users/jordan/.nvm/versions/node/v5.0.0/lib/node_modules/npm/node_modules/read-package-json/read-json.js:309:45)
12+
4 verbose stack at final (/Users/jordan/.nvm/versions/node/v5.0.0/lib/node_modules/npm/node_modules/read-package-json/read-json.js:343:3)
13+
4 verbose stack at then (/Users/jordan/.nvm/versions/node/v5.0.0/lib/node_modules/npm/node_modules/read-package-json/read-json.js:113:5)
14+
4 verbose stack at ReadFileContext.<anonymous> (/Users/jordan/.nvm/versions/node/v5.0.0/lib/node_modules/npm/node_modules/read-package-json/read-json.js:284:20)
15+
4 verbose stack at ReadFileContext.callback (/Users/jordan/.nvm/versions/node/v5.0.0/lib/node_modules/npm/node_modules/graceful-fs/graceful-fs.js:76:16)
16+
4 verbose stack at FSReqWrap.readFileAfterOpen [as oncomplete] (fs.js:324:13)
17+
5 verbose cwd /Users/jordan/code/nuclear/examples/hot-reloading
18+
6 error Darwin 14.4.0
19+
7 error argv "/Users/jordan/.nvm/versions/node/v5.0.0/bin/node" "/Users/jordan/.nvm/versions/node/v5.0.0/bin/npm" "start"
20+
8 error node v5.0.0
21+
9 error npm v3.3.6
22+
10 error missing script: start
23+
11 error If you need help, you may report this error at:
24+
11 error <https://github.com/npm/npm/issues>
25+
12 verbose exit [ 1, true ]

examples/hot-reloading/package.json

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
{
2+
"name": "nuclear-js-hot-reloading-example",
3+
"version": "1.0.0",
4+
"description": "Hot Reloading with NuclearJS",
5+
"main": "index.js",
6+
"scripts": {
7+
"start": "node webpack-server.js",
8+
"test": "echo \"Error: no test specified\" && exit 1"
9+
},
10+
"author": "Jordan Garcia",
11+
"license": "MIT",
12+
"dependencies": {
13+
"react": "^0.14.3",
14+
"react-dom": "^0.14.3"
15+
},
16+
"devDependencies": {
17+
"babel-cli": "^6.3.17",
18+
"babel-core": "^6.3.21",
19+
"babel-loader": "^6.2.0",
20+
"babel-plugin-syntax-decorators": "^6.3.13",
21+
"babel-plugin-transform-decorators": "^6.3.13",
22+
"babel-plugin-transform-decorators-legacy": "^1.3.4",
23+
"babel-preset-es2015": "^6.3.13",
24+
"babel-preset-react": "^6.3.13",
25+
"babel-preset-stage-0": "^6.3.13",
26+
"react-hot-loader": "^1.3.0",
27+
"webpack": "^1.12.9",
28+
"webpack-dev-server": "^1.12.1"
29+
}
30+
}
Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
export function increment(reactor) {
2+
reactor.dispatch('increment')
3+
}
4+
5+
export function decrement(reactor) {
6+
reactor.dispatch('decrement')
7+
}
Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
import React, { Component, PropTypes } from 'react'
2+
3+
class Counter extends Component {
4+
render() {
5+
const { increment, decrement, counter } = this.props
6+
return (
7+
<p>
8+
Clicked: {counter} times
9+
{' '}
10+
<button onClick={increment}>+</button>
11+
{' '}
12+
<button onClick={decrement}>-</button>
13+
</p>
14+
)
15+
}
16+
}
17+
18+
Counter.propTypes = {
19+
increment: PropTypes.func.isRequired,
20+
decrement: PropTypes.func.isRequired,
21+
counter: PropTypes.number.isRequired
22+
}
23+
24+
export default Counter
Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import React, { Component } from 'react'
2+
import { connect } from 'nuclear-js-react-addons'
3+
import Counter from '../components/Counter'
4+
import { increment, decrement } from '../actions/counter'
5+
6+
@connect(props => ({
7+
counter: ['counter']
8+
}))
9+
export default class AppContainer extends Component {
10+
render() {
11+
let { reactor, counter } = this.props
12+
return <Counter
13+
counter={counter}
14+
increment={increment.bind(null, reactor)}
15+
decrement={decrement.bind(null, reactor)}
16+
/>
17+
}
18+
}

examples/hot-reloading/src/main.js

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
import React from 'react'
2+
import { render } from 'react-dom'
3+
import { Provider } from 'nuclear-js-react-addons'
4+
import App from './containers/App'
5+
import reactor from './reactor'
6+
debugger
7+
8+
render(
9+
<Provider reactor={reactor}>
10+
<App />
11+
</Provider>,
12+
document.getElementById('root')
13+
)

examples/hot-reloading/src/reactor.js

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
import { Reactor } from 'nuclear-js'
2+
import * as stores from './stores'
3+
4+
const reactor = new Reactor({
5+
debug: true,
6+
})
7+
reactor.registerStores(stores)
8+
9+
if (module.hot) {
10+
// Enable Webpack hot module replacement for reducers
11+
module.hot.accept('./stores', () => {
12+
reactor.replaceStores(require('./stores'))
13+
})
14+
}
15+
16+
export default reactor

0 commit comments

Comments
 (0)