# react-redux-api-middleware

> Loading - Success - Error, Redux pattern. Just a little bit less boilerplate. ``` npm install react-redux-api-middleware ```

Latest version **0.0.5** (published 2019-04-06) · MIT license · 0 weekly downloads

## Install

```sh
npm install react-redux-api-middleware
pnpm add react-redux-api-middleware
yarn add react-redux-api-middleware
bun add react-redux-api-middleware
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.5 |
| Published | 2019-04-06 |
| First published | 2019-02-21 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 32.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | andrejjurkin |

## Links

- npm: https://www.npmjs.com/package/react-redux-api-middleware
- npm.io page: https://npm.io/package/react-redux-api-middleware

## Dependencies (1)

- [redux-thunk](https://npm.io/package/redux-thunk.md) ^2.3.0

## Recent versions

- 0.0.5 (latest) — 2019-04-06
- 0.0.4 — 2019-04-06
- 0.0.3 — 2019-04-06
- 0.0.2 — 2019-02-21
- 0.0.1 — 2019-02-21

## README

# Redux API Middleware
Loading - Success - Error, Redux pattern. Just a little bit less boilerplate.
```
npm install react-redux-api-middleware
```

## How does it work
1. Create a Redux action and specify network request details.
```
const FETCH_USERS = createActionSet('FETCH_USERS');

const action = () => ({
  [API_CALL]: {
    url: '/some/endpoint',
    method: 'GET',
    actions: FETCH_USERS,
  },
});

```
2. Once you dispatch an action, middleware will perform a network request and dispatch Loading, Success or Error actions.
```
function userReducer(state, action) {
  switch(action.type) {
    case: FETCH_USERS.LOADING:
      // Do something with the loading state
      return state;
    case FETCH_USERS.SUCESS: {
      // Do something with the response
      return {
        ...state,
        users: action.response,
      }
    }
    case FETCH_USERS.ERROR: {
      return {
        ...state,
        someErrorMessage: action.error,
      }
    }
    ...
  }
}
```
3. Profit

---
_Source: https://npm.io/package/react-redux-api-middleware · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._