Move object spread docs around

Author: gaearon

docs/README.md

@@ -23,6 +23,7 @@
   * Next Steps
 * [Recipes](/docs/recipes/README.md)
   * [Migrating to Redux](/docs/recipes/MigratingToRedux.md)
+  * [Using Object Spread Operator](/docs/recipes/UsingObjectSpreadOperator.md)
   * [Reducing Boilerplate](/docs/recipes/ReducingBoilerplate.md)
   * [Server Rendering](/docs/recipes/ServerRendering.md)
   * [Writing Tests](/docs/recipes/WritingTests.md)

docs/Troubleshooting.md

@@ -93,7 +93,7 @@ Finally, to update objects, you’ll need something like `_.extend` from Undersc
 
 Make sure that you use `Object.assign` correctly. For example, instead of returning something like `Object.assign(state, newData)` from your reducers, return `Object.assign({}, state, newData)`. This way you don’t override the previous `state`.
 
-You can also enable [ES7 object spread proposal](https://github.com/sebmarkbage/ecmascript-rest-spread) with [Babel transform-object-rest-spread plugin](http://babeljs.io/docs/plugins/transform-object-rest-spread/):
+You can also enable the [object spread operator proposal](recipes/UsingObjectSpreadOperator.md) for a more succinct syntax:
 
 ```js
 // Before:
@@ -113,7 +113,7 @@ return [
 ]
 ```
 
-Note that experimental language features are subject to change, and it’s unwise to rely on them in large codebases.
+Note that experimental language features are subject to change.
 
 #### Don’t forget to call [`dispatch(action)`](api/Store.md#dispatch)
 

docs/advanced/README.md

@@ -6,6 +6,5 @@ In the [basics walkthrough](../basics/README.md), we explored how to structure a
 * [Async Flow](AsyncFlow.md)
 * [Middleware](Middleware.md)
 * [Usage with React Router](UsageWithReactRouter.md)
-* [Object Spread Operator](ObjectSpreadOperator.md)
 * [Example: Reddit API](ExampleRedditAPI.md)
 * [Next Steps](NextSteps.md)

docs/api/createStore.md

@@ -46,7 +46,7 @@ console.log(store.getState())
 
 * It is up to you to choose the state format. You can use plain objects or something like [Immutable](http://facebook.github.io/immutable-js/). If you’re not sure, start with plain objects.
 
-* If your state is a plain object, make sure you never mutate it! For example, instead of returning something like `Object.assign(state, newData)` from your reducers, return `Object.assign({}, state, newData)`. This way you don’t override the previous `state`. You can also write `return { ...state, ...newData }` if you enable [ES7 object spread proposal](https://github.com/sebmarkbage/ecmascript-rest-spread) with [Babel transform-object-rest-spread plugin](http://babeljs.io/docs/plugins/transform-object-rest-spread/).
+* If your state is a plain object, make sure you never mutate it! For example, instead of returning something like `Object.assign(state, newData)` from your reducers, return `Object.assign({}, state, newData)`. This way you don’t override the previous `state`. You can also write `return { ...state, ...newData }` if you enable the [object spread operator proposal](../recipes/UsingObjectSpreadOperator.md).
 
 * For universal apps that run on the server, create a store instance with every request so that they are isolated. Dispatch a few data fetching actions to a store instance and wait for them to complete before rendering the app on the server.
 

docs/basics/Reducers.md

@@ -99,7 +99,7 @@ function todoApp(state = initialState, action) {
 
 Note that:
 
-1. **We don’t mutate the `state`.** We create a copy with [`Object.assign()`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/assign). `Object.assign(state, { visibilityFilter: action.filter })` is also wrong: it will mutate the first argument. You **must** supply an empty object as the first parameter. You can also enable the experimental [object spread syntax](https://github.com/sebmarkbage/ecmascript-rest-spread) proposed for ES7 to write `{ ...state, ...newState }` instead.
+1. **We don’t mutate the `state`.** We create a copy with [`Object.assign()`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/assign). `Object.assign(state, { visibilityFilter: action.filter })` is also wrong: it will mutate the first argument. You **must** supply an empty object as the first parameter. You can also enable the [object spread operator proposal](../recipes/UsingObjectSpreadOperator.md) to write `{ ...state, ...newState }` instead.
 
 2. **We return the previous `state` in the `default` case.** It’s important to return the previous `state` for any unknown action.
 

docs/introduction/PriorArt.md

@@ -13,7 +13,7 @@ Redux was inspired by several important qualities of Flux. Like Flux, Redux pres
 
 Unlike Flux, **Redux does not have the concept of a Dispatcher**. This is because it relies on pure functions instead of event emitters, and pure functions are easy to compose and don’t need an additional entity managing them. Depending on how you view Flux, you may see this as either a deviation or an implementation detail. Flux has often been [described as `(state, action) => state`](https://speakerdeck.com/jmorrell/jsconf-uy-flux-those-who-forget-the-past-dot-dot-dot-1). In this sense, Redux is true to the Flux architecture, but makes it simpler thanks to pure functions.
 
-Another important difference from Flux is that **Redux assumes you never mutate your data**. You can use plain objects and arrays for your state just fine, but mutating them inside the reducers is strongly discouraged. You should always return a new object, which is easy with the [object spread syntax proposed for ES7](https://github.com/sebmarkbage/ecmascript-rest-spread) and implemented in [Babel](http://babeljs.io), or with a library like [Immutable](https://facebook.github.io/immutable-js).
+Another important difference from Flux is that **Redux assumes you never mutate your data**. You can use plain objects and arrays for your state just fine, but mutating them inside the reducers is strongly discouraged. You should always return a new object, which is easy with the [object spread operator proposal](../recipes/UsingObjectSpreadOperator.md), or with a library like [Immutable](https://facebook.github.io/immutable-js).
 
 While it is technically *possible* to [write impure reducers](https://github.com/reactjs/redux/issues/328#issuecomment-125035516) that mutate the data for performance corner cases, we actively discourage you from doing this. Development features like time travel, record/replay, or hot reloading will break. Moreover it doesn’t seem like immutability poses performance problems in most real apps, because, as [Om](https://github.com/omcljs/om) demonstrates, even if you lose out on object allocation, you still win by avoiding expensive re-renders and re-calculations, as you know exactly what changed thanks to reducer purity.
 

docs/recipes/README.md

@@ -3,6 +3,7 @@
 These are some use cases and code snippets to get you started with Redux in a real app. They assume you understand the topics in [basic](../basics/README.md) and [advanced](../advanced/README.md) tutorials.
 
 * [Migrating to Redux](MigratingToRedux.md)
+* [Using Object Spread Operator](UsingObjectSpreadOperator.md)
 * [Reducing Boilerplate](ReducingBoilerplate.md)
 * [Server Rendering](ServerRendering.md)
 * [Writing Tests](WritingTests.md)

docs/advanced/ObjectSpreadOperator.md renamed to docs/recipes/UsingObjectSpreadOperator.md

@@ -1,11 +1,11 @@
-# Object Spread Operator
+# Using Object Spread Operator
 
 Since one of the core tenants of Redux is to never mutate state, you’ll often find yourself using [`Object.assign()`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/assign) to create
 copies of objects with new or updated values. For example, in the `todoApp` below `Object.assign()` is used to return a new
 `state` object with an updated `visibilityFilter` property:
 
 ```js
-  function todoApp(state = initialState, action) {
+function todoApp(state = initialState, action) {
   switch (action.type) {
     case SET_VISIBILITY_FILTER:
       return Object.assign({}, state, {
@@ -36,24 +36,23 @@ function todoApp(state = initialState, action) {
 The advantage of using the object spread syntax becomes more apparent when you’re composing complex objects. Below `getAddedIds` maps an array of `id` values to an array of objects with values returned from `getProduct` and `getQuantity`.
 
 ```js
-  return getAddedIds(state.cart).map(id => Object.assign(
-    {},
-    getProduct(state.products, id),
-    {
-      quantity: getQuantity(state.cart, id)
-    }
-  ))
-  ```
-
+return getAddedIds(state.cart).map(id => Object.assign(
+  {},
+  getProduct(state.products, id),
+  {
+    quantity: getQuantity(state.cart, id)
+  }
+))
+```
 
 Object spread lets us simplify the above `map` call to:
 
 ```js
-  return getAddedIds(state.cart).map(id => ({
-    ...getProduct(state.products, id),
-    quantity: getQuantity(state.cart, id)
-  }))
-  ```
+return getAddedIds(state.cart).map(id => ({
+  ...getProduct(state.products, id),
+  quantity: getQuantity(state.cart, id)
+}))
+```
 
 Since the object spread syntax is still a Stage 2 proposal for ECMAScript you’ll need to use a transpiler such as [Babel](http://babeljs.io/) to use it in production. You can use your existing `es2015` preset, install [`babel-plugin-transform-object-read-spread`](http://babeljs.io/docs/plugins/transform-object-rest-spread/) and add it individually to the `plugins` array in your `.babelrc`.
 
@@ -63,3 +62,5 @@ Since the object spread syntax is still a Stage 2 proposal for ECMAScript you’
   "plugins": ["transform-object-rest-spread"]
 }
 ```
+
+Note that this is still an experimental language feature proposal so it may change in the future. Nevertheless some large projects such as [React Native](https://github.com/facebook/react-native) already use it extensively so it is safe to say that there will be a good automated migration path if it changes.