Awesome
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 }
}
}
});