4
4
### built_redux
5
5
6
6
built_redux is a state management library written in dart that enforces immutability.
7
- built_redux stores can be built with middleware and nested reducers
7
+ built_redux stores can be built with middleware and nested reducers.
8
8
9
9
Inspired by [ redux] [ redux_git ]
10
10
11
11
Built using [ built_value] [ built_value_git ]
12
12
13
+ ### Framework bindings & examples
14
+
15
+ [ react-dart] [ react-dart ]
16
+
17
+ [ flutter] [ flutter ]
18
+
19
+ [ angular2] [ angular2 ]
20
+
21
+
13
22
### Using it in your project
14
23
15
24
> __ If you are not familiar with Redux or built_value__
@@ -24,7 +33,7 @@ Built using [built_value][built_value_git]
24
33
25
34
``` yaml
26
35
dependencies :
27
- built_redux : " ^0.1 .0"
36
+ built_redux : " ^1.0 .0"
28
37
` ` `
29
38
30
39
2. Create a script to run generators for generating built_values and additional built_redux classes.
@@ -54,13 +63,11 @@ Built using [built_value][built_value_git]
54
63
```
55
64
import 'package: built_redux /built_redux.dart';
56
65
57
- /**
58
- * This is a an implementation of ReduxActions. Actions are middleware and ui
59
- * components invoke a change to the redux store's state. By extending ReduxActions
60
- * the built_redux generator will generate the required boilerplate to create
61
- * each action and an ActionNames class.
62
- * /
63
- abstract class CounterActions extends ReduxActions {
66
+ // This is a an implementation of ReduxActions. Actions are middleware and ui
67
+ // components invoke a change to the redux store's state. By extending ReduxActions
68
+ // the built_redux generator will generate the required boilerplate to create
69
+ // each action and an ActionNames class.
70
+ abstract class CounterActions extends ReduxActions {
64
71
ActionDispatcher<int > increment;
65
72
ActionDispatcher<int > decrement;
66
73
@@ -69,12 +76,10 @@ import 'package:built_redux/built_redux.dart';
69
76
factory AppStateActions() => new _ $AppStateActions();
70
77
}
71
78
72
- /**
73
- * This is a BuiltReducer. It is essentially an implementation of built_value
74
- * with one extra getter named reducers. This getter is simply a map from action
75
- * name to a reducer function.
76
- * /
77
- abstract class Counter extends BuiltReducer<Counter, CounterBuilder>
79
+ // This is a BuiltReducer. It is essentially an implementation of built_value
80
+ // with one extra getter named reducers. This getter is simply a map from action
81
+ // name to a reducer function.
82
+ abstract class Counter extends BuiltReducer<Counter, CounterBuilder>
78
83
implements Built<Counter, CounterBuilder> {
79
84
/// [ count] value of the counter
80
85
int get count;
@@ -89,41 +94,36 @@ import 'package:built_redux/built_redux.dart';
89
94
}
90
95
91
96
92
- /**
93
- * These are reducers, a pure function with (state, action, builder) => state signature.
94
- * It describes how an action transforms the state into the next state.
95
- * You are required to builder passed, calling state.rebuild will NOT update
96
- * the state in your redux store.
97
- * /
97
+ // These are reducers, a pure function with (state, action, builder) => state signature.
98
+ // It describes how an action transforms the state into the next state.
99
+ // You are required to builder passed, calling state.rebuild will NOT update
100
+ // the state in your redux store.
98
101
increment(Counter state, Action<int > action, CounterBuilder builder) =>
99
102
builder..count = state.count + action.payload;
100
103
101
104
decrement(Counter state, Action<int > action, CounterBuilder builder) =>
102
105
builder..count = state.count - action.payload;
103
106
104
- /**
105
- * This is a reducer builder. Use of ReducerBuilder is not required, however it
106
- * is strongly recommended as it gives you static type checking to make sure
107
- * the payload for action name provided is the same as the expected payload
108
- * for the action provided to your reducer. Calling .build() returns the map
109
- * of action names to reducers.
110
- * /
111
- var _ reducer = (new ReducerBuilder<Counter, CounterBuilder>()
107
+ // This is a reducer builder. Use of ReducerBuilder is not required, however it
108
+ // is strongly recommended as it gives you static type checking to make sure
109
+ // the payload for action name provided is the same as the expected payload
110
+ // for the action provided to your reducer. Calling .build() returns the map
111
+ // of action names to reducers.
112
+ var _ reducer = (new ReducerBuilder<Counter, CounterBuilder>()
112
113
..add<int >(CounterActionsNames.increment, increment)
113
114
..add<int >(CounterActionsNames.decrement, decrement)).build();
114
115
115
116
// Create a Redux store holding the state of your app.
116
- // Its API is subscribe , state, actions.
117
+ // Its API contains three getters: stream , state, and actions.
117
118
var store = new Store<Counter, CounterBuilder, CounterActions>(
118
119
new Counter(),
119
120
new CounterActions(),
120
121
);
121
122
122
- // You can use subscribe () to update the UI in response to state changes.
123
- // Normally you'd use a view binding library (e.g. React Redux ) rather than subscribe () directly.
123
+ // You can use stream.listen () to update the UI in response to state changes.
124
+ // Normally you'd use a view binding library (e.g. [ flutter_built_redux ] ) rather than stream.listen () directly.
124
125
// However it can also be handy to persist the current state in the localStorage.
125
-
126
- store.subscribe((_ ) =>
126
+ store.stream.listen((_ ) =>
127
127
print(store.state);
128
128
)
129
129
@@ -136,27 +136,48 @@ store.actions.decrement(1);
136
136
// 2
137
137
```
138
138
139
+ ### Nested reducers
140
+
141
+ Nested reducers can be added to your BuiltReducer. In this example NestedCounter
142
+ is another BuiltReducer. In order for nested reducers to work you must mix in
143
+ {Built reducer name}ReduceChildren just like BaseCounterReduceChildren is below.
144
+ This class will be generated for you by the BuiltReduxGenerator.
145
+ ```
146
+ abstract class BaseCounter extends BuiltReducer<BaseCounter, BaseCounterBuilder>
147
+ with BaseCounterReduceChildren
148
+ implements Built<BaseCounter, BaseCounterBuilder> {
149
+ int get count;
150
+
151
+ NestedCounter get nestedCounter;
152
+
153
+ get reducer => _ baseReducer;
154
+
155
+ // Built value boilerplate
156
+ BaseCounter._ ();
157
+ factory BaseCounter([ updates(BaseCounterBuilder b)] ) =>
158
+ new _ $BaseCounter((BaseCounterBuilder b) => b
159
+ ..count = 1
160
+ ..nestedCounter = new NestedCounter().toBuilder());
161
+ }
162
+ ```
163
+
139
164
### Writing middleware
140
165
```
141
- /**
142
- * Actions to be handled by this middleware
143
- * /
144
- abstract class DoubleAction extends ReduxActions {
166
+ // Actions to be handled by this middleware
167
+ abstract class DoubleAction extends ReduxActions {
145
168
ActionDispatcher<int > increment;
146
169
147
170
DoubleAction._ ();
148
171
factory DoubleAction() => new _ $DoubleAction();
149
172
}
150
173
151
- /**
152
- * This is a middleware builder. Use of MiddlewareBuilder is not required, however
153
- * just like ReducerBuilder it is strongly recommended as it gives you static type checking to make sure
154
- * the payload for action name provided is the same as the expected payload
155
- * for the action provided to your reducer. It will also call next(action) for you
156
- * if an action not handled by this middlware is received. Calling .build() returns the
157
- * middleware function that can be passed to your store at instantiation.
158
- * /
159
- var doubleMiddleware = (new MiddlwareBuilder<Counter, CounterBuilder, CounterActions>()
174
+ // This is a middleware builder. Use of MiddlewareBuilder is not required, however
175
+ // just like ReducerBuilder it is strongly recommended as it gives you static type checking to make sure
176
+ // the payload for action name provided is the same as the expected payload
177
+ // for the action provided to your reducer. It will also call next(action) for you
178
+ // if an action not handled by this middlware is received. Calling .build() returns the
179
+ // middleware function that can be passed to your store at instantiation.
180
+ var doubleMiddleware = (new MiddlwareBuilder<Counter, CounterBuilder, CounterActions>()
160
181
..add<int >(DoubleActionNames.increment, _ doubleIt)).build();
161
182
162
183
_ doubleIt(MiddlewareApi<Counter, CounterBuilder, CounterActions> api, ActionHandler next, Action<int > action) {
@@ -192,7 +213,7 @@ var store = new Store<Counter, CounterBuilder, CounterActions>(
192
213
middleware: [ doubleMiddleware] ,
193
214
);
194
215
195
- store.subscribe(( ) =>
216
+ store.stream.listen(( _ ) =>
196
217
print(store.state);
197
218
)
198
219
@@ -205,30 +226,6 @@ store.actions.decrement(1);
205
226
// 4
206
227
```
207
228
208
- ### Nested reducers
209
-
210
- Nested reducers can be added to your BuiltReducer. In this example NestedCounter
211
- is another BuiltReducer. In order for nested reducers to work you must mix in
212
- {Built reducer name}ReduceChildren just like BaseCounterReduceChildren is below.
213
- This class will be generated for you by the BuiltReduxGenerator.
214
- ```
215
- abstract class BaseCounter extends BuiltReducer<BaseCounter, BaseCounterBuilder>
216
- with BaseCounterReduceChildren
217
- implements Built<BaseCounter, BaseCounterBuilder> {
218
- int get count;
219
-
220
- NestedCounter get nestedCounter;
221
-
222
- get reducer => _ baseReducer;
223
-
224
- // Built value boilerplate
225
- BaseCounter._ ();
226
- factory BaseCounter([ updates(BaseCounterBuilder b)] ) =>
227
- new _ $BaseCounter((BaseCounterBuilder b) => b
228
- ..count = 1
229
- ..nestedCounter = new NestedCounter().toBuilder());
230
- }
231
- ```
232
229
233
230
[built_value_blog]: https://medium.com/dartlang/darts-built-value-for-immutable-object-models-83e2497922d4
234
231
@@ -237,3 +234,11 @@ abstract class BaseCounter extends BuiltReducer<BaseCounter, BaseCounterBuilder>
237
234
[redux_git]: https://github.com/reactjs/redux
238
235
239
236
[redux_docs]: http://redux.js.org/
237
+
238
+ [react-dart]: https://github.com/davidmarne/react_built_redux
239
+
240
+ [flutter]: https://github.com/davidmarne/flutter_built_redux
241
+
242
+ [angular2]: https://github.com/davidmarne/angular_built_redux
243
+
244
+ [flutter_built_redux]: https://github.com/davidmarne/flutter_built_redux
0 commit comments