Skip to content

Commit 238f9f8

Browse files
committed
Flesh out README.md
1 parent a6370cd commit 238f9f8

File tree

1 file changed

+32
-1
lines changed

1 file changed

+32
-1
lines changed

README.md

+32-1
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,41 @@
66

77
# redux-first-vue-routing
88

9-
A tiny Vue plugin that connects components with Redux.
9+
A tiny Vue plugin that connects components with Redux, an implementation of [redux-first-routing](https://github.com/mksarge/redux-first-routing).
1010

1111
New to Redux? [Start Here](https://redux.js.org/introduction/getting-started)
1212

13+
Achieve client-side routing *the Redux way*:
14+
15+
- Read location data from the store.
16+
- Update the location by dispatching navigation actions.
17+
- Let middleware handle the side-effect of history navigation.
18+
19+
> **Learn more: [An Introduction to the Redux-First Routing Model](https://medium.com/@mksarge/an-introduction-to-the-redux-first-routing-model-98926ebf53cb)**
20+
21+
![Redux-first routing](https://camo.githubusercontent.com/b08b1b78a08e0444ab451f692618d59da977e6a1/687474703a2f2f692e696d6775722e636f6d2f734169566c6b4d2e6a7067)
22+
1323
## Installation
1424

1525
`npm install redux-first-vue-routing`
26+
27+
## Usage
28+
29+
```
30+
import { applyMiddleware, createStore } from 'redux';
31+
import { middleware, reducer } from 'redux-first-vue-routing';
32+
import ReduxFirstVueRouting from 'redux-first-vue-routing';
33+
import Vue from 'vue';
34+
import VueRouter from 'vue-router';
35+
36+
// Create a Redux store, including the router reducer and the middleware.
37+
const store = createStore(rootReducer, {}, applyMiddleware(middleware));
38+
39+
// Create the router instance
40+
const router = new VueRouter({
41+
...
42+
});
43+
44+
// Install the plugin
45+
Vue.use(ReduxFirstVueRouting, { router, store });
46+
```

0 commit comments

Comments
 (0)