diff --git a/README.md b/README.md index 4abf231..91735e0 100644 --- a/README.md +++ b/README.md @@ -10,7 +10,7 @@ smart people at [Hashrocket](http://hashrocket.com/). For a steady stream of TILs from a variety of rocketeers, checkout [til.hashrocket.com](https://til.hashrocket.com/). -_665 TILs and counting..._ +_666 TILs and counting..._ --- @@ -471,6 +471,7 @@ _665 TILs and counting..._ - [Quickly Search For A Component With React DevTools](react/quickly-search-for-a-component-with-react-devtools.md) - [Read Only Input Elements](react/read-only-input-elements.md) - [Rendering Multiple Nodes With Fragments](react/rendering-multiple-nodes-with-fragments.md) +- [Sync Your react-router State With Redux](react/sync-your-react-router-state-with-redux.md) - [Test Files In create-react-app](react/test-files-in-create-react-app.md) - [Upgrading To The Latest React In CodeSandbox](react/upgrading-to-the-latest-react-in-codesandbox.md) - [Use A Ref To Autofocus An Input](react/use-a-ref-to-autofocus-an-input.md) diff --git a/react/sync-your-react-router-state-with-redux.md b/react/sync-your-react-router-state-with-redux.md new file mode 100644 index 0000000..0549fa1 --- /dev/null +++ b/react/sync-your-react-router-state-with-redux.md @@ -0,0 +1,14 @@ +# Sync Your react-router State With Redux + +If you are building a React app that uses both `redux` and `react-router`, +you'll find that you are managing app state in two places. Most of your app +state is in `redux`. The router-specific state is component-state in the +`Router`. + +You can unify it all in `redux` with +[`react-router-redux`](https://github.com/ReactTraining/react-router/tree/master/packages/react-router-redux). + +You'll need to apply some middleware, combine `routerReducer` with the rest +of your reducers, and then swap out your `BrowserRouter` with a +`ConnectedRouter`. You can read about the details +[here](https://github.com/ReactTraining/react-router/tree/master/packages/react-router-redux).