1 | # redux-leaves
|
2 |
|
3 | Write once. Reduce anywhere.
|
4 |
|
5 | ![Travis (.org)](https://img.shields.io/travis/richardcrng/redux-leaves.svg)
|
6 | [![Coverage Status](https://coveralls.io/repos/github/richardcrng/redux-leaves/badge.svg?branch=buttons)](https://coveralls.io/github/richardcrng/redux-leaves?branch=buttons)
|
7 | ![David](https://img.shields.io/david/richardcrng/redux-leaves.svg)
|
8 | [![install size](https://packagephobia.now.sh/badge?p=redux-leaves)](https://packagephobia.now.sh/result?p=redux-leaves)
|
9 | [![npm version](https://badge.fury.io/js/redux-leaves.svg)](https://badge.fury.io/js/redux-leaves)
|
10 | [![Maintainability](https://api.codeclimate.com/v1/badges/371605931cb9f824e25c/maintainability)](https://codeclimate.com/github/richardcrng/redux-leaves/maintainability)
|
11 |
|
12 | #### Getting started
|
13 | - [30 second demo](#30-second-demo)
|
14 | - [Motivation](docs/motivation.md)
|
15 |
|
16 | #### API reference
|
17 | - [Core: `reduxLeaves(initialState, reducers)`](docs/README.md)
|
18 |
|
19 | ## 30 second demo
|
20 |
|
21 | ### Write once.
|
22 | ```bash
|
23 | npm install --save redux-leaves
|
24 | ```
|
25 |
|
26 | ```js
|
27 | import { createStore } from 'redux'
|
28 | import reduxLeaves from 'redux-leaves'
|
29 |
|
30 | // 1. Define initialState
|
31 | const initialState = {
|
32 | counter: 1,
|
33 | list: ['first'],
|
34 | nested: { arbitrarily: { deep: 0 } }
|
35 | }
|
36 |
|
37 | // 2. (Optional) Define custom reducers dictionary
|
38 | const reducersDict = {
|
39 | double: leafState => leafState * 2,
|
40 | appendToEach: (leafState, action) => leafState.map(str => str.concat(action.payload)),
|
41 | countKeys: (leafState, action, wholeState) => Object.keys(wholeState).length
|
42 | }
|
43 |
|
44 | // 3. Grab reducer and actions from reduxLeaves, then create the Redux store
|
45 | const [reducer, actions] = reduxLeaves(initialState, reducersDict)
|
46 | const store = createStore(reducer)
|
47 | ```
|
48 |
|
49 | ### Reduce anywhere.
|
50 |
|
51 | ```js
|
52 | // *** KEY ***
|
53 | // Default: an action creator that ships with Redux-Leaves by default
|
54 | // Custom: an action creator generated by the custom reducersDict
|
55 |
|
56 | // Default: increment state.counter
|
57 | store.dispatch(actions.counter.create.increment())
|
58 | console.log(store.getState().counter) // 2
|
59 |
|
60 | // Custom: double state.counter
|
61 | store.dispatch(actions.counter.create.double())
|
62 | console.log(store.getState().counter) // 4
|
63 |
|
64 | // Default: push 'second' to state.list
|
65 | store.dispatch(actions.list.create.push('second'))
|
66 | console.log(store.getState().list) // ['first', 'second']
|
67 |
|
68 | // Custom: append ' item' to each element in state.list
|
69 | store.dispatch(actions.list.create.appendToEach(' item'))
|
70 | console.log(store.getState().list) // ['first item', 'second item']
|
71 |
|
72 | // Default: assign true to key 'newKey' at the top-level of state
|
73 | store.dispatch(actions.create.assign({ newKey: true }))
|
74 | console.log(store.getState().newKey) // true
|
75 |
|
76 | // Custom: update state.nested.arbitrarily.deep with state's number of top-level keys
|
77 | store.dispatch(actions.nested.arbitrarily.deep.create.countKeys())
|
78 | console.log(store.getState().nested.arbitrarily.deep) // 4
|
79 |
|
80 | console.log(store.getState())
|
81 | /*
|
82 | {
|
83 | counter: 4,
|
84 | list: ['first item', ' second item'],
|
85 | nested: { arbitrarily: { deep: 4 } }
|
86 | }
|
87 | */
|
88 | ```
|
89 |
|
90 | ## Testing
|
91 |
|
92 | To run all tests locally:
|
93 |
|
94 | ```bash
|
95 | git clone git@github.com:richardcrng/redux-leaves.git
|
96 | cd redux-leaves && npm run test a
|
97 | ```
|
98 |
|
99 | All tests are located alongside their relevant documentation in the [docs](/docs) folder. |
\ | No newline at end of file |