Browse code
Update documentation to remove mention of middleware
Showing 3 changed files
... | ... |
@@ -48,7 +48,7 @@ See a simple [demo documentation site.](https://github.com/cjdev/routedux-docs-d |
48 | 48 |
|
49 | 49 |
```javascript |
50 | 50 |
import installBrowserRouter from 'routedux'; |
51 |
-import {createStore, compose, applyMiddleware} from 'redux'; |
|
51 |
+import {createStore, compose} from 'redux'; |
|
52 | 52 |
|
53 | 53 |
const LOAD_USER = 'LOAD_USER'; |
54 | 54 |
|
... | ... |
@@ -67,11 +67,10 @@ const routesConfig = [ |
67 | 67 |
['/', 'LOAD_ARTICLE', {slug: "home-content"}] |
68 | 68 |
]; |
69 | 69 |
|
70 |
-const {enhancer, middleware, init} = installBrowserRouter(routesConfig); |
|
70 |
+const {enhancer, init} = installBrowserRouter(routesConfig); |
|
71 | 71 |
|
72 | 72 |
const store = createStore(reduce, compose( |
73 |
- enhance, |
|
74 |
- applyMiddleware(middleware) |
|
73 |
+ enhance |
|
75 | 74 |
)); |
76 | 75 |
|
77 | 76 |
//when you are ready to handle the initial page load (redux-saga and similar libraries necessitate this being separte) |
... | ... |
@@ -44,7 +44,7 @@ simply removing the routing declaration, things will work as before.</p><p>As an |
44 | 44 |
application becomes easier to test, as rendering is a pure function of |
45 | 45 |
Redux state, and model logic and route actions are entirely |
46 | 46 |
encapsulated in Redux outside of the app.</p></section><section><h2>Demo Site</h2><p>We have a demo codebase at <a href="https://github.com/cjdev/routedux-docs-demo">demo repository</a>.</p></section><section><h2>Simple Routing in 25 lines</h2><pre><code class="javascript"><p>import installBrowserRouter from 'routedux'; |
47 |
-import {createStore, compose, applyMiddleware} from 'redux';</p><p>const LOAD_USER = 'LOAD_USER';</p><p>function currentUserId() { |
|
47 |
+import {createStore, compose} from 'redux';</p><p>const LOAD_USER = 'LOAD_USER';</p><p>function currentUserId() { |
|
48 | 48 |
return 42; |
49 | 49 |
};</p><p>function reduce(state = initialState(), action) { |
50 | 50 |
... |
... | ... |
@@ -53,9 +53,8 @@ import {createStore, compose, applyMiddleware} from 'redux';</p><p>const LOAD_US |
53 | 53 |
['/user/me', LOAD_USER, {id: currentUserId()}], |
54 | 54 |
['/article/:slug', 'LOAD_ARTICLE', {}], |
55 | 55 |
['/', 'LOAD_ARTICLE', {slug: "home-content"}] |
56 |
-];</p><p>const {enhancer, middleware} = installBrowserRouter(routesConfig);</p><p>const store = createStore(reduce, compose( |
|
57 |
- enhance, |
|
58 |
- applyMiddleware(middleware) |
|
56 |
+];</p><p>const {enhancer} = installBrowserRouter(routesConfig);</p><p>const store = createStore(reduce, compose( |
|
57 |
+ enhance |
|
59 | 58 |
));</p></code></pre><p>Any time a handled action fires the url in the address bar will change, and if the url in the address bar changes |
60 | 59 |
the corresponding action will fire (unless the action was initiated by a url change).</p></section><section><h2>Route matching precedence - which route matches best?</h2><p>Route precedence is a function of the type of matching done in each segment and the order in which the wildcard segments |
61 | 60 |
match. Exact matches are always preferred to wildcards moving from left to right.</p><pre><code class="javascript">const routesInOrderOfPrecedence = [ |
... | ... |
@@ -59,7 +59,7 @@ We have a demo codebase at ◊a[#:href "https://github.com/cjdev/routedux-docs-d |
59 | 59 |
◊pre{ |
60 | 60 |
◊code[#:class "javascript"]{ |
61 | 61 |
import installBrowserRouter from 'routedux'; |
62 |
-import {createStore, compose, applyMiddleware} from 'redux'; |
|
62 |
+import {createStore, compose} from 'redux'; |
|
63 | 63 |
|
64 | 64 |
const LOAD_USER = 'LOAD_USER'; |
65 | 65 |
|
... | ... |
@@ -78,11 +78,10 @@ const routesConfig = [ |
78 | 78 |
['/', 'LOAD_ARTICLE', {slug: "home-content"}] |
79 | 79 |
]; |
80 | 80 |
|
81 |
-const {enhancer, middleware} = installBrowserRouter(routesConfig); |
|
81 |
+const {enhancer} = installBrowserRouter(routesConfig); |
|
82 | 82 |
|
83 | 83 |
const store = createStore(reduce, compose( |
84 |
- enhance, |
|
85 |
- applyMiddleware(middleware) |
|
84 |
+ enhance |
|
86 | 85 |
)); |
87 | 86 |
}} |
88 | 87 |
|