Skip to content

Commit

Permalink
Add a "Usage Guide" docs page (#105)
Browse files Browse the repository at this point in the history
* Change naming, format things

* Add incomplete usage guide page

* Finish filling out usage guide
  • Loading branch information
markerikson committed Feb 2, 2019
1 parent e2a05b6 commit 04cdb02
Show file tree
Hide file tree
Showing 7 changed files with 543 additions and 13 deletions.
6 changes: 3 additions & 3 deletions README.md
Expand Up @@ -14,7 +14,7 @@

### Purpose

The `redux-starter-kit` package is intended to help address three common concerns about Redux:
The Redux Starter Kit package is intended to help address three common concerns about Redux:

- "Configuring a Redux store is too complicated"
- "I have to add a lot of packages to get Redux to do anything useful"
Expand All @@ -26,7 +26,7 @@ This package is _not_ intended to solve every possible concern about Redux, and

### What's Included

`redux-starter-kit` includes:
Redux Starter Kit includes:

- A `configureStore()` function with simplified configuration options. It can automatically combine your slice reducers, adds whatever Redux middleware you supply, includes `redux-thunk` by default, and enables use of the Redux DevTools Extension.
- A `createReducer()` utility that lets you supply a lookup table of action types to case reducer functions, rather than writing switch statements. In addition, it automatically uses the [`immer` library](https://github.com/mweststrate/immer) to let you write simpler immutable updates with normal mutative code, like `state.todos[3].completed = true`.
Expand All @@ -36,6 +36,6 @@ This package is _not_ intended to solve every possible concern about Redux, and

## Documentation

The `redux-starter-kit` docs are now published at **https://redux-starter-kit.js.org**.
The Redux Starter Kit docs are now published at **https://redux-starter-kit.js.org**.

We're currently expanding and rewriting our docs content - check back soon for more updates!
6 changes: 3 additions & 3 deletions docs/api/createAction.md
Expand Up @@ -40,10 +40,10 @@ let action = increment()
action = increment(3)
// returns { type: 'counter/increment', payload: 3 }

increment.toString()
console.log(increment.toString())
// 'counter/increment'

`The action type is: ${increment}`
console.log(`The action type is: ${increment}`)
// 'The action type is: counter/increment'
```

Expand All @@ -67,7 +67,7 @@ This works because object keys that are not natively supported by JavaScript (li

In principle, Redux lets you use any kind of value as an action type. Instead of strings, you could theoretically use numbers, [symbols](https://developer.mozilla.org/en-US/docs/Glossary/Symbol), or anything else ([although it's recommended that the value should at least be serializable](https://redux.js.org/faq/actions#why-should-type-be-a-string-or-at-least-serializable-why-should-my-action-types-be-constants)).

However, `redux-starter-kit` rests on the assumption that you use string action types. Specifically, some of its features rely on the fact that with strings, the `toString()` method of an `createAction()` action creator returns the matching action type. This is not the case for non-string action types because `toString()` will return the string-converted type value rather than the type itself.
However, Redux Starter Kit rests on the assumption that you use string action types. Specifically, some of its features rely on the fact that with strings, the `toString()` method of an `createAction()` action creator returns the matching action type. This is not the case for non-string action types because `toString()` will return the string-converted type value rather than the type itself.

```js
const INCREMENT = Symbol('increment')
Expand Down
4 changes: 2 additions & 2 deletions docs/api/getDefaultMiddleware.md
Expand Up @@ -51,15 +51,15 @@ const store = configureStore({

### Development

One of the goals of `redux-starter-kit` is to provide opinionated defaults and prevent common mistakes. As part of that,
One of the goals of Redux Starter Kit is to provide opinionated defaults and prevent common mistakes. As part of that,
`getDefaultMiddleware` includes some middleware that are added **in development builds of your app only** to
provide runtime checks for two common issues:

- [`redux-immutable-state-invariant`](https://github.com/leoasis/redux-immutable-state-invariant): deeply compares
state values for mutations. It can detect mutations in reducers during a dispatch, and also mutations that occur between
dispatches (such as in a component or a selector). When a mutation is detect, it will throw an error and indicate the key
path for where the mutated value was detected in the state tree.
- `serializable-state-invariant-middleware`: a custom middleware created specifically for use in `redux-starter-kit`. Similar in
- `serializable-state-invariant-middleware`: a custom middleware created specifically for use in Redux Starter Kit. Similar in
concept to `redux-immutable-state-invariant`, but deeply checks your state tree and your actions for non-serializable values
such as functions, Promises, Symbols, and other non-plain-JS-data values. When a non-serializable value is detected, a
console error will be printed with the key path for where the non-serializable value was detected.
Expand Down
2 changes: 1 addition & 1 deletion docs/api/otherExports.md
Expand Up @@ -7,7 +7,7 @@ hide_title: true

# Other Exports

`redux-starter-kit` exports some of its internal utilities, and re-exports additional functions from other dependencies as well.
Redux Starter Kit exports some of its internal utilities, and re-exports additional functions from other dependencies as well.

## Internal Exports

Expand Down
8 changes: 4 additions & 4 deletions docs/introduction/quick-start.md
Expand Up @@ -9,7 +9,7 @@ hide_title: true

## Purpose

The **`redux-starter-kit`** package is intended to help address three common concerns about Redux:
The **Redux Starter Kit** package is intended to help address three common concerns about Redux:

- "Configuring a Redux store is too complicated"
- "I have to add a lot of packages to get Redux to do anything useful"
Expand All @@ -20,12 +20,12 @@ We can't solve every use case, but in the spirit of [`create-react-app`](https:/
This package is _not_ intended to solve every possible concern about Redux, and is deliberately limited in scope. It does _not_ address concepts like "reusable encapsulated Redux modules", data fetching, folder or file structures, managing entity relationships in the store, and so on.

That said, **these tools should be beneficial to all Redux users**. Whether you're a brand new Redux user setting up your
first project, or an experienced user who wants to simplify an existing application, **`redux-starter-kit`** can help
first project, or an experienced user who wants to simplify an existing application, **Redux Starter Kit** can help
you make your Redux code better.

## What's Included

`redux-starter-kit` includes:
Redux Starter Kit includes:

- A [`configureStore()` function](../api/configureStore.md) with simplified configuration options. It can automatically combine your slice reducers, adds whatever Redux middleware you supply, includes `redux-thunk` by default, and enables use of the Redux DevTools Extension.
- A [`createReducer()` utility](../api/createReducer.md) that lets you supply a lookup table of action types to case reducer functions, rather than writing switch statements. In addition, it automatically uses the [`immer` library](https://github.com/mweststrate/immer) to let you write simpler immutable updates with normal mutative code, like `state.todos[3].completed = true`.
Expand All @@ -35,7 +35,7 @@ you make your Redux code better.

## Installation

`redux-starter-kit` is available as a package on NPM for use with a module bundler or in a Node application:
Redux Starter Kit is available as a package on NPM for use with a module bundler or in a Node application:

```bash
npm install --save redux-starter-kit
Expand Down

0 comments on commit 04cdb02

Please sign in to comment.