Skip to content

Commit 13f1025

Browse files
committed
style(redux): fix textlint error
1 parent 0e5d228 commit 13f1025

1 file changed

Lines changed: 21 additions & 17 deletions

File tree

ja/Redux/README.md

Lines changed: 21 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -5,12 +5,13 @@
55
[Redux][]はJavaScriptアプリケーションのStateを管理するライブラリで、
66
[React](https://github.com/facebook/react "React")などと組み合わせアプリケーションを作成するために利用されています。
77

8-
Reduxは[Flux](https://facebook.github.io/flux/ "Flux")アーキテクチャに類似する仕組みであるため、事前にFluxについて学習していると良いです。
8+
Reduxは[Flux](https://facebook.github.io/flux/ "Flux")アーキテクチャに類似する仕組みです。
9+
そのため、事前にFluxについて学習していると良いです。
910

1011
Reduxには[Three Principles](http://redux.js.org/docs/introduction/ThreePrinciples.html "Three Principles | Redux")(以下、三原則)と呼ばれる3つの制約の上で成立しています。
1112

1213
- Single source of truth
13-
- アプリケーション全体のStateは一つのStateツリーとして保存される
14+
- アプリケーション全体のStateは1つのStateツリーとして保存される
1415
- State is read-only
1516
- StateはActionを経由しないと書き換えることができない
1617
- Changes are made with pure functions
@@ -28,10 +29,12 @@ _Middleware_ という名前からも分かるように、[connect](../connect/R
2829

2930
## どう書ける?
3031

31-
3行でReduxの仕組みを書くと以下のようになります
32+
簡潔にReduxの仕組みを書くと以下のようになります
3233

33-
- 操作を表現するオブジェクトをActionと呼ぶ - 一般にコマンドパターンのコマンドと同様のもの
34-
- Actionを受け取りStateを書き換える関数を _Reducer_ と呼ぶ - ReducerはStoreに事前に登録する
34+
- 操作を表現するオブジェクトをActionと呼ぶ
35+
- 一般的なコマンドパターンのコマンドと同様のもの
36+
- Actionを受け取りStateを書き換える関数を _Reducer_ と呼ぶ
37+
- ReducerはStoreへ事前に登録する
3538
- ActionをDispatch(`store.dispatch(action)`)することで、ActionをReducerへ通知する
3639

3740
Reduxの例として次のようなコードを見てみます。
@@ -48,9 +51,11 @@ Reduxの例として次のようなコードを見てみます。
4851

4952
上記の処理のうち、 3から4の間が _Middleware_ が処理する場所となっています。
5053

51-
`dispatch(action)` -> (_Middleware_ の処理) -> reducerにより新しいStateの作成 -> (Stateが変わったら) -> `subscribe`で登録したコールバックを呼ぶ
54+
```
55+
dispatch(action) -> (_Middleware_ の処理) -> reducerにより新しいStateの作成 -> (Stateが変わったら) -> subscribeで登録したコールバックを呼ぶ
56+
```
5257

53-
次は _Middleware_ はどういう拡張を行えるのかを見ていきます
58+
次は _Middleware_ によりどのような拡張ができるのかを見ていきます
5459

5560
## Middleware
5661

@@ -73,8 +78,8 @@ const createStoreWithMiddleware = applyMiddleware(createLogger())(createStore);
7378
この時、見た目上は `store` に対して _Middleware_ が適用されているように見えますが、
7479
実際には`store.dispatch`に対して適用され、拡張された`dispatch`メソッドが作成されています。
7580

76-
これにより、以下のように`dispatch`を実行する際に _Middleware_ の処理が実行されてから、
77-
実際に`dispatch`されるというのがReduxの _Middleware_ による拡張のポイントになっています
81+
これにより、`dispatch`を実行する際に _Middleware_ の処理を挟む事ができます。
82+
これがReduxの _Middleware_ による拡張ポイントになっています
7883

7984
```js
8085
store.dispatch({
@@ -83,7 +88,7 @@ store.dispatch({
8388
});
8489
```
8590

86-
さきほどの`logger.js`を見てみます
91+
先ほどの`logger.js`をもう一度見てみます
8792

8893
```js
8994
export default function createLogger(options = defaultOptions) {
@@ -119,7 +124,7 @@ const middleware = (store) => {
119124

120125
ただ単に関数を返す関数(高階関数)を作っているだけだと分かります。
121126

122-
これを踏まえて logger.js をもう一度見てみると、`next(action)` の前後にログ表示を挟んでいることが分かります。
127+
これを踏まえて`logger.js`をもう一度見てみると、`next(action)` の前後にログ表示を挟んでいることが分かります。
123128

124129
[import, logger.js](../../src/Redux/logger.js)
125130

@@ -135,26 +140,25 @@ const middleware = (store) => {
135140

136141
## 実装してみよう
137142

138-
- [ ] TODO
139143
- [ ] DispatcherベースのMiddleware
140144

141145
## どういう事に向いてる?
142146

143-
- [ ] TODO
144147
- アスペクト的に前後に処理を挟むことができる
145148
- ログへの利用
146-
- 値自体は直接操作するわけではないが、受取るデータは変換できる
149+
- 値自体は直接操作できない
150+
- 受取るデータは変換できる
147151

148152
## どういう事に向いていない?
149153

150154
- [ ] TODO
151155
- 変換の仕組み上、書き換え等を行うプラグインを扱いにくい
152156

153-
## この仕組みを使ってるもの
157+
## この仕組みを使っているもの
154158

155159
- Connectに似ている
156-
- _Middleware_もStateそのものを直接書き換える事はできません
157-
- この部分が類似の仕組みを持つ[connect](../connect/README.md)との違いになっています
160+
- _Middleware_もStateそのものを直接書き換える事はできません
161+
- この部分が類似の仕組みを持つ[connect](../connect/README.md)との違いになっています
158162

159163

160164

0 commit comments

Comments
 (0)