# Redux Preboiled

![](https://3542556397-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-L_JX1-xEvmVOqi2q8Vs%2Fuploads%2Fgit-blob-17c03233a281d564b4eafee9a7c37ef8e648686d%2Flogo.png?alt=media)

*Pre-cooked Redux helpers, served à la carte.*

Redux Preboiled is a collection of general-purpose [Redux](https://redux.js.org/) helper functions. It helps you reduce boilerplate when writing reducers, action creators, and tests.

* **Served *****à la carte*****.** Each of Preboiled's helpers can be used stand-alone. Just pick and use the ones you want and ignore the rest. If your build setup does [tree shaking](https://developers.google.com/web/fundamentals/performance/optimizing-javascript/tree-shaking/), the unused helpers won't even be added to your application's build output.
* **Minimal magic.** Preboiled avoids clever "magic" tricks which minimize boilerplate at the expense of understandability. Instead, it favors simple, composable functions with easy-to-understand semantics and implementations.
* **TypeScript-friendly.** Redux Preboiled is written in [TypeScript](https://www.typescriptlang.org/). Its helpers are designed to be easy to type and amenable to automatic type inference, making it easy to write type-safe Redux code.

## A First Taste

The following snippet uses a bunch of Redux Preboiled's helpers to define a simple Redux counter module with support for `increment` and `multiply` actions. It is about half the size of the equivalent vanilla Redux code.

```js
import {
  chainReducers,
  createAction,
  onAction,
  withInitialState
} from 'redux-preboiled'

const increment = createAction('increment')
const multiply = createAction('multiply').withPayload()

const counterReducer = chainReducers(
  withInitialState(0),
  onAction(increment, state => state + 1),
  onAction(multiply, (state, action) => state * action.payload)
)

// Example usage:

import { createStore } from 'redux'

const store = createStore(counterReducer)
store.dispatch(increment())
store.dispatch(increment())
store.dispatch(multiply(2))
store.getState()
// => 4
```

* `createAction` generates various types of action creator functions with minimal cerenomy. The specified action type value is made available as an action creator property (`increment.type` and `mutliply.type` in this example), making separate action type constants unnecessary. See the [Actions](https://redux-preboiled.js.org/guides/actions) guide.
* The `onAction`, `withInitialState` and `chainReducers` helpers can be combined as a less noisy alternative to the classic `switch` reducer pattern. In TypeScript, the type of the sub-reducers' `action` parameters are automatically inferred from the action creators passed to `onAction`, improving type safety and editor auto-completion. See the [Reducers](https://redux-preboiled.js.org/guides/reducers) guide.

## Next Steps

The [Getting Started](https://redux-preboiled.js.org/guides/getting-started) guide shows you how to install and use Redux Preboiled. Follow the links to the other guides for a tour through Redux Preboiled's helpers. You can also look at the repository's [examples](https://github.com/denisw/redux-preboiled/tree/master/examples) directory.

For reference documentation, see the [API docs](https://redux-preboiled.js.org/api/api).