# redux-api

> Flux REST API for redux infrastructure

Latest version **0.12.0** (published 2020-02-25) · MIT license · 0 weekly downloads

## Install

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

## Health

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

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.12.0 |
| Published | 2020-02-25 |
| First published | 2015-08-12 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 2 |
| Unpacked size | 363.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 493 |
| Author | Efremov Alex |
| Maintainers | lexich |

## Links

- npm: https://www.npmjs.com/package/redux-api
- Repository: https://github.com/lexich/redux-api
- Homepage: https://github.com/lexich/redux-api#readme
- Issues: https://github.com/lexich/redux-api/issues
- npm.io page: https://npm.io/package/redux-api

## Dependencies (2)

- [qs](https://npm.io/package/qs.md) ^6.9.1
- [fast-apply](https://npm.io/package/fast-apply.md) 0.0.3

## Recent versions

- 0.12.0 (latest) — 2020-02-25
- 0.11.2 — 2017-12-29
- 0.11.1 — 2017-10-02
- 0.11.0 — 2017-07-31
- 0.10.8 — 2017-07-14
- 0.10.7 — 2017-07-10
- 0.10.6 — 2017-06-13
- 0.10.5 — 2017-05-18
- 0.10.4 — 2017-04-28
- 0.10.3 — 2017-03-30
- 0.10.2 — 2017-03-29
- 0.10.1 — 2017-03-29
- 0.10.0 — 2017-03-29
- 0.9.19 — 2017-03-29
- 0.9.18 — 2017-03-06
- … 55 more at https://npm.io/package/redux-api/versions

## README

### Redux-api
Flux REST API for redux infrastructure

[![Build Status](https://travis-ci.org/lexich/redux-api.svg)](https://travis-ci.org/lexich/redux-api)
[![NPM version](https://badge.fury.io/js/redux-api.svg)](http://badge.fury.io/js/redux-api)
[![Coverage Status](https://coveralls.io/repos/lexich/redux-api/badge.png?branch=master)](https://coveralls.io/r/lexich/redux-api?branch=master)

## Introduction
`redux-api` solves the problem of writing clients to communicate with backends. It generates [actions](http://redux.js.org/docs/basics/Actions.html) and [reducers](http://redux.js.org/docs/basics/Reducers.html) for making AJAX calls to API endpoints. You don't need to write a lot of [boilerplate code](http://redux.js.org/docs/advanced/ExampleRedditAPI.html) if you use `redux` and want to exchange data with server.

Inspired by [Redux-rest](https://github.com/Kvoti/redux-rest) and is intended to be used with [Redux](https://github.com/gaearon/redux).


## Documentation
See [DOCS.md](docs/DOCS.md) for API documentation.
## Use cases
* [AuthorizationJWT.md](docs/AuthorizationJWT.md) - example of JWT Authorization  
* [Scoping.md](docs/Scoping.md) - use scoping or using multiple redux-api instance without naming intersections.

## Install
With npm:
```sh
npm install redux-api --save
```
With bower:
```sh
bower install redux-api --save
```

If you don't use tools like webpack, browserify, etc and you want to load redux-api manually, the best way to add redux-api to your project is:
```js
<script src="(...)/redux-api.min.js"></script>
<script>
  window.ReduxApi = window["redux-api"];
  // or
  var ReduxApi = window["redux-api"];
  // initialization code
</script>
```

=======
## Remote calls

`redux-api` doesn't bind you to a technology to make AJAX calls. It uses configurable `adapters` - a pretty simple function which receives 2 arguments: `endpoint` and `options`, and returns a Promise as result. The default adapter uses [isomorphic-fetch](https://github.com/matthew-andrews/isomorphic-fetch), and has an implementation like this:
```js
function adapterFetch(url, options) {
  return fetch(url, options);
}
```

However, you are not tied to using isomorphic-fetch. For instance, if you prefer to use jQuery, you can use the following adapter:
```js
function adapterJquery(url, options) {
  return new Promise((success, error)=> {
    $.ajax({ ...options, url, success, error });
  });
}
```
This implementation allows you to make any request and process any response.

And of course you have to set up adapter to your `redux-api` instance before using.
```
  reduxApi(....).use("fetch", adapterFetch)
```

=======
## Examples
[examples/isomorphic](https://github.com/lexich/redux-api/tree/master/examples/isomorphic) - React + Redux + React-Router + Redux-api with webpack and express + github API

### Example
rest.js
```js
import "isomorphic-fetch";
import reduxApi, {transformers} from "redux-api";
import adapterFetch from "redux-api/lib/adapters/fetch";
export default reduxApi({
  // simple endpoint description
  entry: `/api/v1/entry/:id`,
  // complex endpoint description
  regions: {
    url: `/api/v1/regions`,
    // reimplement default `transformers.object`
    transformer: transformers.array,
    // base endpoint options `fetch(url, options)`
    options: {
      headers: {
        "Accept": "application/json"
      }
    }
  }
}).use("fetch", adapterFetch(fetch));
```

index.jsx
```js
import React, {PropTypes} from "react";
import { createStore, applyMiddleware, combineReducers } from "redux";
import thunk from "redux-thunk";
import { Provider, connect } from "react-redux";
import rest from "./rest"; //our redux-rest object

const createStoreWithMiddleware = applyMiddleware(thunk)(createStore);
const reducer = combineReducers(rest.reducers);
const store = createStoreWithMiddleware(reducer);

function select(state) {
  return { entry: state.entry, regions: state.regions };
}

class Application {
  static propTypes = {
    entry: PropTypes.shape({
      loading: PropTypes.bool.isRequired,
      data: PropTypes.shape({
        text: PropTypes.string
      }).isRequired
    }).isRequired,
    regions: PropTypes.shape({
      loading: PropTypes.bool.isRequired,
      data: PropTypes.array.isRequired
    }).isRequired,
    dispatch: PropTypes.func.isRequired
  };
  componentDidMount() {
    const {dispatch} = this.props;
    // fetch `/api/v1/regions
    dispatch(rest.actions.regions.sync());
    //specify id for GET: /api/v1/entry/1
    dispatch(rest.actions.entry({id: 1}));
  }
  render() {
    const {entry, regions} = this.props;
    const Regions = regions.data.map((item)=> <p>{ item.name }</p>)
    return (
      <div>
        Loading regions: { regions.loading }
        <Regions/>
        Loading entry: {entry.loading}
        <div>{{ entry.data.text }}</div>
      </div>
    );
  }
}

const SmartComponent = connect(select)(Application);

React.render(
  <Provider store={store}>
    <SmartComponent />
  </Provider>,
  document.getElementById("content")
);
```

### [Releases Changelog](https://github.com/lexich/redux-api/releases)

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