Merge branch 'master' into migrate-real-world-example-to-redux-react-router

Author: timdorr

CHANGELOG.md

@@ -150,6 +150,11 @@ Join the **#redux** channel of the [Reactiflux](http://reactiflux.com) Slack com
 
 Special thanks to [Jamie Paton](http://jdpaton.github.io) for handing over the `redux` NPM package name.
 
+### Change Log
+
+This project adheres to [Semantic Versioning](http://semver.org/).  
+Every release, along with the migration instructions, is documented on the Github [Releases](https://github.com/rackt/redux/releases) page.
+
 ### Patrons
 
 The work on Redux was [funded by the community](https://www.patreon.com/reactdx).  

README.md

@@ -36,4 +36,5 @@
   * [applyMiddleware](/docs/api/applyMiddleware.md)
   * [bindActionCreators](/docs/api/bindActionCreators.md)
   * [compose](/docs/api/compose.md)
+* [Change Log](/CHANGELOG.md)
 * [Patrons](/PATRONS.md)

docs/README.md

@@ -293,9 +293,9 @@ Remember that reducers are just functions, so you can use functional composition
 
 ## Async Action Creators
 
-Finally, how do we use the synchronous action creators we [defined earlier](#synchronous-action-creators) together with network requests? The standard way to do it with Redux is to use the [Redux Thunk middleware](https://github.com/gaearon/redux-thunk). It comes in a separate package called `redux-thunk`. We’ll explain how middleware works in general [later](Middleware.md); for now, there is just one important thing you need to know: by using this specific middleware, an action creator can return a function instead an action object. This way, the function creator becomes a [thunk](https://en.wikipedia.org/wiki/Thunk).
+Finally, how do we use the synchronous action creators we [defined earlier](#synchronous-action-creators) together with network requests? The standard way to do it with Redux is to use the [Redux Thunk middleware](https://github.com/gaearon/redux-thunk). It comes in a separate package called `redux-thunk`. We’ll explain how middleware works in general [later](Middleware.md); for now, there is just one important thing you need to know: by using this specific middleware, an action creator can return a function instead an action object. This way, the action creator becomes a [thunk](https://en.wikipedia.org/wiki/Thunk).
 
-When a function creator returns a function, that function will get executed by the Redux Thunk middleware. This function doesn’t need to be pure; it is thus allowed to have side effects, including executing asynchronous API calls. The function can also dispatch actions—like those synchronous actions we defined earlier.
+When an action creator returns a function, that function will get executed by the Redux Thunk middleware. This function doesn’t need to be pure; it is thus allowed to have side effects, including executing asynchronous API calls. The function can also dispatch actions—like those synchronous actions we defined earlier.
 
 We can still define these special thunk action creators inside our `actions.js` file:
 
@@ -355,7 +355,7 @@ export function fetchPosts(reddit) {
         dispatch(receivePosts(reddit, json))
       );
 
-      // Note: in a real world app, you also want to
+      // In a real world app, you also want to
       // catch any error in the network call.
   };
 }
@@ -390,15 +390,11 @@ import { createStore, applyMiddleware } from 'redux';
 import { selectReddit, fetchPosts } from './actions';
 import rootReducer from './reducers';
 
-const logger = createLogger({
-  level: 'info',
-  collapsed: true,
-  predicate (getState, action) => action.type
-});
+const loggerMiddleware = createLogger();
 
 const createStoreWithMiddleware = applyMiddleware(
   thunkMiddleware, // lets us dispatch() functions
-  logger // neat middleware that logs actions
+  loggerMiddleware // neat middleware that logs actions
 )(createStore);
 
 const store = createStoreWithMiddleware(rootReducer);

docs/advanced/AsyncActions.md

@@ -164,9 +164,11 @@ export default rootReducer;
 ```js
 import { createStore, applyMiddleware } from 'redux';
 import thunkMiddleware from 'redux-thunk';
-import loggerMiddleware from 'redux-logger';
+import createLogger from 'redux-logger';
 import rootReducer from './reducers';
 
+const loggerMiddleware = createLogger();
+
 const createStoreWithMiddleware = applyMiddleware(
   thunkMiddleware,
   loggerMiddleware

docs/advanced/ExampleRedditAPI.md

@@ -101,7 +101,7 @@ Note that:
 
 >##### Note on `Object.assign`
 
->[`Object.assign()`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/assign) is a part of ES6, but is not implemented by most browsers yet. You’ll need to either use a polyfill, a [Babel plugin](https://github.com/babel-plugins/babel-plugin-object-assign), or a helper from another library like [`_.assign()`](https://lodash.com/docs#assign).
+>[`Object.assign()`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/assign) is a part of ES6, but is not implemented by most browsers yet. You’ll need to either use a polyfill, a [Babel plugin](https://www.npmjs.com/package/babel-plugin-object-assign), or a helper from another library like [`_.assign()`](https://lodash.com/docs#assign).
 
 >##### Note on `switch` and Boilerplate
 

docs/basics/Reducers.md

@@ -80,7 +80,7 @@ open http://localhost:3000/
 
 It covers:
 
-* [Universal rendering](/docs/recipes/ServerRendering.md) with Redux and React
+* [Universal rendering](../recipes/ServerRendering.md) with Redux and React
 * Prefetching state based on input and via asynchronous fetches.
 * Passing state from the server to the client
 

docs/introduction/Examples.md

@@ -330,15 +330,15 @@ import expect from 'expect';
 import * as types from '../../constants/ActionTypes';
 import singleDispatch from '../../middleware/singleDispatch';
 
-const fakeStore = fakeData => ({
+const createFakeStore = fakeData => ({
   getState() {
     return fakeData;
   }
 });
 
 const dispatchWithStoreOf = (storeData, action) => {
   let dispatched = null;
-  const dispatch = singleDispatch(fakeStore(storeData))(actionAttempt => dispatched = actionAttempt);
+  const dispatch = singleDispatch(createFakeStore(storeData))(actionAttempt => dispatched = actionAttempt);
   dispatch(action);
   return dispatched;
 };

docs/recipes/WritingTests.md

@@ -1,3 +1,13 @@
 {
-  "stage": 2
+  "stage": 2,
+  "plugins" : [
+    "react-transform"
+  ],
+  "extra"  : {
+    "react-transform": [{
+      "target"  : "react-transform-webpack-hmr",
+      "imports" : ["react"],
+      "locals"  : ["module"]
+    }]
+  }
 }

examples/async/.babelrc

@@ -36,12 +36,13 @@
   "devDependencies": {
     "babel-core": "^5.6.18",
     "babel-loader": "^5.1.4",
+    "babel-plugin-react-transform": "^1.0.3",
     "expect": "^1.6.0",
     "jsdom": "^5.6.1",
     "mocha": "^2.2.5",
     "mocha-jsdom": "^1.0.0",
     "node-libs-browser": "^0.5.2",
-    "react-hot-loader": "^1.3.0",
+    "react-transform-webpack-hmr": "^0.1.4",
     "webpack": "^1.9.11",
     "webpack-dev-server": "^1.9.0"
   }

examples/async/package.json

@@ -19,7 +19,7 @@ module.exports = {
   module: {
     loaders: [{
       test: /\.js$/,
-      loaders: ['react-hot', 'babel'],
+      loaders: ['babel'],
       exclude: /node_modules/,
       include: __dirname
     }]

examples/async/webpack.config.js

@@ -1,3 +1,13 @@
 {
-  "stage": 2
+  "stage": 2,
+  "plugins" : [
+    "react-transform"
+  ],
+  "extra"  : {
+    "react-transform": [{
+      "target"  : "react-transform-webpack-hmr",
+      "imports" : ["react"],
+      "locals"  : ["module"]
+    }]
+  }
 }

examples/counter/.babelrc

@@ -25,12 +25,13 @@
   "devDependencies": {
     "babel-core": "^5.6.18",
     "babel-loader": "^5.1.4",
+    "babel-plugin-react-transform": "^1.0.3",
     "expect": "^1.6.0",
     "jsdom": "^5.6.1",
     "mocha": "^2.2.5",
     "mocha-jsdom": "^1.0.0",
     "node-libs-browser": "^0.5.2",
-    "react-hot-loader": "^1.3.0",
+    "react-transform-webpack-hmr": "^0.1.4",
     "webpack": "^1.9.11",
     "webpack-dev-server": "^1.9.0"
   }

examples/counter/package.json

@@ -19,7 +19,7 @@ module.exports = {
   module: {
     loaders: [{
       test: /\.js$/,
-      loaders: ['react-hot', 'babel'],
+      loaders: ['babel'],
       exclude: /node_modules/,
       include: __dirname
     }]

examples/counter/webpack.config.js

@@ -1,3 +1,13 @@
 {
-  "stage": 2
+  "stage": 2,
+  "plugins" : [
+    "react-transform"
+  ],
+  "extra"  : {
+    "react-transform": [{
+      "target"  : "react-transform-webpack-hmr",
+      "imports" : ["react"],
+      "locals"  : ["module"]
+    }]
+  }
 }

examples/real-world/.babelrc

@@ -32,8 +32,9 @@
   "devDependencies": {
     "babel-core": "^5.6.18",
     "babel-loader": "^5.1.4",
-    "react-hot-loader": "^1.3.0",
     "redux-devtools": "^2.1.2",
+    "babel-plugin-react-transform": "^1.0.3",
+    "react-transform-webpack-hmr": "^0.1.4",
     "webpack": "^1.9.11",
     "webpack-dev-server": "^1.9.0"
   }

examples/real-world/package.json

@@ -19,7 +19,7 @@ module.exports = {
   module: {
     loaders: [{
       test: /\.js$/,
-      loaders: ['react-hot', 'babel'],
+      loaders: ['babel'],
       exclude: /node_modules/,
       include: __dirname
     }]

examples/real-world/webpack.config.js

@@ -1,3 +1,13 @@
 {
-  "stage": 2
+  "stage": 2,
+  "plugins" : [
+    "react-transform"
+  ],
+  "extra"  : {
+    "react-transform": [{
+      "target"  : "react-transform-webpack-hmr",
+      "imports" : ["react"],
+      "locals"  : ["module"]
+    }]
+  }
 }

examples/todomvc/.babelrc

@@ -25,13 +25,14 @@
   "devDependencies": {
     "babel-core": "^5.6.18",
     "babel-loader": "^5.1.4",
+    "babel-plugin-react-transform": "^1.0.3",
     "expect": "^1.8.0",
     "jsdom": "^5.6.1",
     "mocha": "^2.2.5",
     "mocha-jsdom": "^1.0.0",
     "node-libs-browser": "^0.5.2",
     "raw-loader": "^0.5.1",
-    "react-hot-loader": "^1.3.0",
+    "react-transform-webpack-hmr": "^0.1.4",
     "style-loader": "^0.12.3",
     "todomvc-app-css": "^2.0.1",
     "webpack": "^1.9.11",

examples/todomvc/package.json

@@ -19,7 +19,7 @@ module.exports = {
   module: {
     loaders: [{
       test: /\.js$/,
-      loaders: ['react-hot', 'babel'],
+      loaders: ['babel'],
       exclude: /node_modules/,
       include: __dirname
     }, {

examples/todomvc/webpack.config.js

@@ -1,3 +1,13 @@
 {
-  "stage": 2
+  "stage": 2,
+  "plugins" : [
+    "react-transform"
+  ],
+  "extra"  : {
+    "react-transform": [{
+      "target"  : "react-transform-webpack-hmr",
+      "imports" : ["react"],
+      "locals"  : ["module"]
+    }]
+  }
 }

examples/universal/.babelrc

@@ -29,8 +29,9 @@
   "devDependencies": {
     "babel-core": "^5.8.22",
     "babel-loader": "^5.3.2",
+    "babel-plugin-react-transform": "^1.0.3",
     "babel-runtime": "^5.8.20",
-    "react-hot-loader": "^1.3.0",
+    "react-transform-webpack-hmr": "^0.1.4",
     "webpack": "^1.11.0",
     "webpack-dev-server": "^1.10.1"
   }

examples/universal/package.json

@@ -22,7 +22,7 @@ module.exports = {
   module: {
     loaders: [{
       test: /\.js$/,
-      loaders: ['react-hot', 'babel?optional=runtime'],
+      loaders: ['babel?optional=runtime'],
       exclude: /node_modules/,
       include: __dirname
     }]

examples/universal/webpack.config.js

@@ -15,8 +15,11 @@ function getErrorMessage(key, action) {
   );
 }
 
-function verifyStateShape(initialState, currentState) {
-  var reducerKeys = Object.keys(currentState);
+function verifyStateShape(inputState, outputState, action) {
+  var reducerKeys = Object.keys(outputState);
+  var argumentName = action && action.type === ActionTypes.INIT ?
+    'initialState argument passed to createStore' :
+    'previous state received by the reducer';
 
   if (reducerKeys.length === 0) {
     console.error(
@@ -26,25 +29,26 @@ function verifyStateShape(initialState, currentState) {
     return;
   }
 
-  if (!isPlainObject(initialState)) {
+  if (!isPlainObject(inputState)) {
     console.error(
-      'initialState has unexpected type of "' +
-      ({}).toString.call(initialState).match(/\s([a-z|A-Z]+)/)[1] +
-      '". Expected initialState to be an object with the following ' +
+      `The ${argumentName} has unexpected type of "` +
+      ({}).toString.call(inputState).match(/\s([a-z|A-Z]+)/)[1] +
+      `". Expected argument to be an object with the following ` +
       `keys: "${reducerKeys.join('", "')}"`
     );
     return;
   }
 
-  var unexpectedKeys = Object.keys(initialState).filter(
+  var unexpectedKeys = Object.keys(inputState).filter(
     key => reducerKeys.indexOf(key) < 0
   );
 
   if (unexpectedKeys.length > 0) {
     console.error(
       `Unexpected ${unexpectedKeys.length > 1 ? 'keys' : 'key'} ` +
-      `"${unexpectedKeys.join('", "')}" in initialState will be ignored. ` +
-      `Expected to find one of the known reducer keys instead: "${reducerKeys.join('", "')}"`
+      `"${unexpectedKeys.join('", "')}" found in ${argumentName}. ` +
+      `Expected to find one of the known reducer keys instead: ` +
+      `"${reducerKeys.join('", "')}". Unexpected keys will be ignored.`
     );
   }
 }
@@ -94,7 +98,6 @@ export default function combineReducers(reducers) {
   });
 
   var defaultState = mapValues(finalReducers, () => undefined);
-  var stateShapeVerified;
 
   return function combination(state = defaultState, action) {
     var finalState = mapValues(finalReducers, (reducer, key) => {
@@ -106,10 +109,7 @@ export default function combineReducers(reducers) {
     });
 
     if (process.env.NODE_ENV !== 'production') {
-      if (!stateShapeVerified) {
-        verifyStateShape(state, finalState);
-        stateShapeVerified = true;
-      }
+      verifyStateShape(state, finalState, action);
     }
 
     return finalState;