Skip to content

Commit 5876977

Browse files
authored
Clean up some wording and links
1 parent 534356f commit 5876977

File tree

1 file changed

+10
-5
lines changed

1 file changed

+10
-5
lines changed

docs/GettingStarted.md

+10-5
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
# Getting Started
22

3-
[React-Redux](https://github.com/reduxjs/react-redux) is the official [React](https://reactjs.org/) binding for [Redux](https://redux.js.org/). ​​It lets your React components read data from a Redux store, and dispatch actions to the store to update data.
3+
[React-Redux](https://github.com/reduxjs/react-redux) is the official [React](https://reactjs.org/) binding for [Redux](https://redux.js.org/). It lets your React components read data from a Redux store, and dispatch actions to the store to update data.
44

55
## Installation
66

@@ -284,9 +284,11 @@ ReactDOM.render(<TodoApp />, rootElement);
284284

285285
</details>
286286

287+
<br />
288+
287289
**The Redux Store**
288290

289-
We have also created the Redux as follows. To learn about designing your Redux store, [the official Redux docs](https://redux.js.org/basics) has an excellent guide.
291+
The Redux portion of the application has been set up using the [patterns recommended in the Redux docs](https://redux.js.org):
290292

291293
- Store
292294
- `todos`: A normalized reducer of todos. It contains a `byIds` map of all todos and a `allIds` that contains the list of all ids.
@@ -308,7 +310,7 @@ We have also created the Redux as follows. To learn about designing your Redux s
308310
- `getTodos` is slightly more complex. It takes all the `id`s from `allIds`, finds each todo in `byIds`, and returns the final array of todos
309311
- `getTodosByVisibilityFilter` filters the todos according to the visibility filter
310312

311-
Once again you may expand the code below or check out this CodeSandbox here [Todo App (UI + Unconnected Redux)](https://codesandbox.io/s/6vwyqrpqk3).
313+
Once again you may expand the code below or check out this CodeSandbox here: [Todo App (UI + Unconnected Redux)](https://codesandbox.io/s/6vwyqrpqk3).
312314

313315
<details>
314316
<summary>Expand Code</summary>
@@ -473,7 +475,9 @@ export const SET_FILTER = "SET_FILTER";
473475

474476
</details>
475477

476-
We now show how to connect this store to our app using React-Redux.
478+
<br />
479+
480+
We will now show how to connect this store to our app using React-Redux.
477481

478482
### Providing the Store
479483

@@ -656,7 +660,7 @@ const TodoList = // ... UI component implementation
656660
export default connect(state => ({ todos: getTodos(state) }))(TodoList);
657661
```
658662

659-
So that provides with a motivation to write selector functions for complex computation. You may further optimize the performance by using [Reselect](https://github.com/reduxjs/reselect) to write “memoized” selectors that can skip unnecessary work. See [this Redux’s docs page on Computing Derived Data](https://redux.js.org/recipes/computingderiveddata#sharing-selectors-across-multiple-components) for more information on using selectors.
663+
We recommend encapsulating any complex lookups or computations of data in selector functions. In addition, you can further optimize the performance by using [Reselect](https://github.com/reduxjs/reselect) to write “memoized” selectors that can skip unnecessary work. (See [the Redux docs page on Computing Derived Data](https://redux.js.org/recipes/computingderiveddata#sharing-selectors-across-multiple-components) and the blog post [Idiomatic Redux: Using Reselect Selectors for Encapsulation and Performance](https://blog.isquaredsoftware.com/2017/12/idiomatic-redux-using-reselect-selectors/) for more information on why and how to use selector functions.)
660664

661665
Now that our `<TodoList />` is connected to the store. It should receive the list of todos, map over them, and pass each todo to the `<Todo />` component. `<Todo />` will in turn render them to the screen. Now try adding a todo. It should come up on our todo list!
662666

@@ -830,6 +834,7 @@ Now we've finished a very simple example of a todo app with React-Redux. All our
830834
- [Higher Order Components in Depth](https://medium.com/@franleplant/react-higher-order-components-in-depth-cf9032ee6c3e)
831835
<!-- - [Presentational and Container Components](https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0) -->
832836
- [Computing Derived Data](https://redux.js.org/recipes/computingderiveddata#sharing-selectors-across-multiple-components)
837+
- [Idiomatic Redux: Using Reselect Selectors for Encapsulation and Performance](https://blog.isquaredsoftware.com/2017/12/idiomatic-redux-using-reselect-selectors/)
833838

834839
## Get More Help
835840

0 commit comments

Comments
 (0)