Simple side-effect middleware for Redux
JavaScript
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
src
test
.babelrc
.editorconfig
.gitignore
.npmignore
.travis.yml
README.md
package.json

README.md

Build Status Coverage Status npm

redux-tap

Simple side-effect middleware for Redux.

$ npm install --save redux-tap

Usage

import { createStore, applyMiddleware } from 'redux';
import tap from 'redux-tap';
import rootReducer from './reducers';

// For example, select any action with metadata:
const selectMeta = action => action.meta;

// Once selected, access the selected value, action and store:
const middleware = tap(selectMeta, (meta, action, store) => {
  // In this case, we'll simply log to the console:
  console.log(meta, action, store);
});

// Note: this API requires redux@>=3.1.0
const store = createStore(
  rootReducer,
  applyMiddleware(middleware)
);

As a real-world example, you can use redux-tap to declaratively track analytics events:

import { createStore, applyMiddleware } from 'redux';
import tap from 'redux-tap';
import rootReducer from './reducers';
import { track } from 'my-analytics-lib';

const selectAnalytics = ({ meta }) => meta && meta.analytics;
const middleware = tap(selectAnalytics, ({ event, data }) => {
  track(event, data);
});

const store = createStore(
  rootReducer,
  applyMiddleware(middleware)
);

// Now, you can declare analytics metadata on any action:
dispatch({
  type: 'REPO_STARRED',
  payload: { id },
  meta: {
    analytics: {
      event: 'Repo Starred',
      data: { id }
    }
  }
});

License

MIT License