Skip to content

Commit fb03dba

Browse files
ShMcKShMcK
committed
final check - steps 8-10
1 parent 20a12e0 commit fb03dba

File tree

5 files changed

+15
-15
lines changed

5 files changed

+15
-15
lines changed

‎README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -229,7 +229,7 @@ For simplicity in this example, we'll try putting our files together by function
229229

230230
##### Logger
231231

232-
We still haven't touched on one of the most powerful features of Redux: **middleware**.
232+
We still haven't worked with one of the most powerful features of Redux: **middleware**.
233233

234234
Middleware is triggered on each action.
235235

‎coderoad.json

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -431,7 +431,7 @@
431431
},
432432
{
433433
"title": "Logger",
434-
"description": "We still haven't touched on one of the most powerful features of Redux: **middleware**.\n\nMiddleware is triggered on each action.\n\n```\n1. Dispatch(action)\n -> 2. Middleware(state, action)\n -> 3. Reducer(state, action)\n -> 4. state\n```\n\nMiddleware is created with the `store`. In it's most basic form, middleware can look like the function below:\n\n```js\nconst store => next => action => {\n // do something magical here\n return next(action);\n // returns result of reducer called with action\n}\n```\n\nLet's try out the power of middleware with \"redux-logger\".",
434+
"description": "We still haven't worked with one of the most powerful features of Redux: **middleware**.\n\nMiddleware is triggered on each action.\n\n```\n1. Dispatch(action)\n -> 2. Middleware(state, action)\n -> 3. Reducer(state, action)\n -> 4. state\n```\n\nMiddleware is created with the `store`. In it's most basic form, middleware can look like the function below:\n\n```js\nconst store => next => action => {\n // do something magical here\n return next(action);\n // returns result of reducer called with action\n}\n```\n\nLet's try out the power of middleware with \"redux-logger\".",
435435
"tasks": [
436436
{
437437
"description": "import `applyMiddleware` in \"index.js\" from the \"redux\" package. It is a named import.",
@@ -443,7 +443,7 @@
443443
]
444444
},
445445
{
446-
"description": "set the second param in createStore to `applyMiddleware()`",
446+
"description": "set the second param in createStore to `applyMiddleware()`. See the [docs](http://redux.js.org/docs/api/applyMiddleware.html).",
447447
"tests": [
448448
"08/02"
449449
],
@@ -452,7 +452,7 @@
452452
]
453453
},
454454
{
455-
"description": "install \"redux-logger\" using npm",
455+
"description": "install \"redux-logger\" using npm. See the [docs](https://github.com/evgenyrodionov/redux-logger).",
456456
"tests": [
457457
"08/03"
458458
],
@@ -489,7 +489,7 @@
489489
]
490490
}
491491
],
492-
"onPageComplete": "Look in the console"
492+
"onPageComplete": "Look in the console to see how \"redux-logger\" works. Amazing. We'll learn more about middleware in step 10, but first let's add another action in the next step"
493493
},
494494
{
495495
"title": "Second Action",
@@ -524,7 +524,7 @@
524524
"09/03"
525525
],
526526
"hints": [
527-
"Try this: `import { sortByPopularity } from './pokemon';`"
527+
"Try this: `const sortByPopularity = require('./pokemon').sortByPopularity;`"
528528
]
529529
},
530530
{
@@ -578,14 +578,14 @@
578578
]
579579
}
580580
],
581-
"onPageComplete": "In the next step, we'll look at using **thunks** to call helpful async actions from within middleware"
581+
"onPageComplete": "As you can see, a thunk is just a function that returns another function. In the next step, we'll see how **thunks** can be used to create async middleware for multiple dispatches"
582582
},
583583
{
584584
"title": "Thunk",
585585
"description": "As we've seen in the previous steps, thunks sound more complicated than they really are. A thunk is just a function that returns a function.\n\nInside of middleware, we can determine if an action is returning a function.\n\n```js\nconst store => next => action => {\n if (typeof action === 'function') {\n // it's a thunk!\n }\n return next(action);\n}\n```\n\nIf it is a thunk, we can pass in two helpful params:\n - `store.dispatch`\n - `store.getState`\n\nAs we'll see, `dispatch` alone can allow us to create async or multiple actions.",
586586
"tasks": [
587587
{
588-
"description": "install \"redux-thunk\" as a dependency",
588+
"description": "install \"redux-thunk\" as a dependency. See the [docs](https://github.com/gaearon/redux-thunk).",
589589
"tests": [
590590
"10/01"
591591
],

‎tutorial/08/index.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
## Logger
2-
We still haven't touched on one of the most powerful features of Redux: **middleware**.
2+
We still haven't worked with one of the most powerful features of Redux: **middleware**.
33

44
Middleware is triggered on each action.
55

@@ -26,11 +26,11 @@ Let's try out the power of middleware with "redux-logger".
2626
@test('08/01')
2727
@action(open('src/index.js'))
2828

29-
+ set the second param in createStore to `applyMiddleware()`
29+
+ set the second param in createStore to `applyMiddleware()`. See the [docs](http://redux.js.org/docs/api/applyMiddleware.html).
3030
@test('08/02')
3131
@hint('Try this: `createStore(reducers, applyMiddleware());`')
3232

33-
+ install "redux-logger" using npm
33+
+ install "redux-logger" using npm. See the [docs](https://github.com/evgenyrodionov/redux-logger).
3434
@test('08/03')
3535
@hint('Try this: `npm install --save-dev redux-logger`')
3636

@@ -47,4 +47,4 @@ Let's try out the power of middleware with "redux-logger".
4747
@test('08/06')
4848
@hint('Try this: `applyMiddleware(logger)`')
4949

50-
@onPageComplete('Look in the console')
50+
@onPageComplete('Look in the console to see how "redux-logger" works. Amazing. We'll learn more about middleware in step 10, but first let's add another action in the next step')

‎tutorial/09/index.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ Let's setup a `SORT_BY_POPULARITY` action to be called after each vote.
3434

3535
+ import `sortByPopularity` in "src/index.js".
3636
@test('09/03')
37-
@hint('Try this: `import { sortByPopularity } from './pokemon';`')
37+
@hint('Try this: `const sortByPopularity = require('./pokemon').sortByPopularity;`')
3838

3939
+ in "src/index.js", dispatch a `sortByPopularity` action at the bottom of the page
4040
@test('09/04')
@@ -84,4 +84,4 @@ function sortByKey(key) {
8484
@hint('Try this: `sortByKey('votes')`')
8585
@hint('Try this: pokemon.sort(sortByKey('votes'))')
8686

87-
@onPageComplete('In the next step, we'll look at using **thunks** to call helpful async actions from within middleware')
87+
@onPageComplete('As you can see, a thunk is just a function that returns another function. In the next step, we'll see how **thunks** can be used to create async middleware for multiple dispatches')

‎tutorial/10/index.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ If it is a thunk, we can pass in two helpful params:
1818

1919
As we'll see, `dispatch` alone can allow us to create async or multiple actions.
2020

21-
+ install "redux-thunk" as a dependency
21+
+ install "redux-thunk" as a dependency. See the [docs](https://github.com/gaearon/redux-thunk).
2222
@test('10/01')
2323
@action(open('src/index.js'))
2424
@hint('Try this: `npm install --save redux-thunk`')

0 commit comments

Comments
 (0)