0.2.2 • Published 5 years ago

redux-dopomoga v0.2.2

Weekly downloads
3
License
ISC
Repository
github
Last release
5 years ago

Redux-dopomoga

Build Status

redux-dopomoga is a library that aims to reduce boilerplates.

Getting started

Install

$ npm install --save redux-dopomoga

or

$ yarn add redux-dopomoga

Usage Example

Creating constants:

import { createConstants } from 'redux-dopomoga/constants';

const productUpdateConstants = createConstants('PRODUCT_UPDATE');

It will creates object with 4 fields (REQUEST, SUCCESS, FAILURE, CANCEL). To get access to the constants use predefined library's constants:

import { REQUEST } from 'redux-dopomoga/constants';

const productUpdateRequestConstant = productUpdateConstants[REQUEST];

// productUpdateRequestConstant === 'PRODUCT_UPDATE_REQUEST'

Creating actions:

import { createActions } from 'redux-dopomoga/actions';

const productUpdateActions = createActions(productUpdateConstants);

To perform a specific type of action, call one of object property:

productUpdateActions.request(payload); // it will creates { type: 'PRODUCT_UPDATE_REQUEST', error: false, payload: payload }
productUpdateActions.success(payload); // it will creates { type: 'PRODUCT_UPDATE_SUCCESS', error: false, payload: payload }
productUpdateActions.failure(error); // it will creates { type: 'PRODUCT_UPDATE_FAILURE', error: error }. NOTE error should be instance of Error or `false`.
productUpdateActions.cancel(payload); // it will creates { type: 'PRODUCT_UPDATE_CANCEL', error: false, payload: payload }

Creating sagas:

MakeRequest

We are suing axios to make XHR. To make request use makeRequest.

import { makeRequest } from 'redux-dopomoga/sagas';

function* updateProduct(reduxAction) {
  yield makeRequest({
    url: '/api/product-update',
    method: 'post',
    action: reduxAction, // read note #1
    paramsGetter: () => ({}), // read note #2
    actions: productUpdateActions, // read note #3
    types: productUpdateConstants, // read note #3
  });
}
  • note #1 action: reduxAction We need action to get default data for request. You can share an action from any place you want.

  • note #2 paramsGetter: () => ({}) By default makeRequest uses action.payload as data for request, but if you want to add something you can use paramsGetter. It could be regular function or another saga, result of the function will be mixed with request params in the following way {url: '...', method: '...', ...paramsGetterResult}, therefore you have to explicitly set data in returned value of paramsGetter function.

  • note #3 actions: productUpdateActions and types: productUpdateConstants Using this actions and constants, we can control future behavior of saga and retrieve the response.

On the action success of productUpdate (productUpdateConstants[SUCCESS]) we will get response.data of our request.

function* someSaga() {
  // ...
  const action = yield take(productUpdateConstants[SUCCESS]);
  // action === { type: 'PRODUCT_UPDATE_SUCCESS', payload: 'any server response', error: false }
}

In a similar way you can take an error via FAILURE constant.

RequestHandlerSaga

This method uses makeRquest and adds ability to cancel a request. You can use it in you'r watcher saga.

export default function* moduleWatcherSaga() {
  yield all([
    fork(requestHandlerSaga, {
      url: '/api/product-update',
      method: 'post',
      actions: productUpdateActions,
      types: productUpdateConstants,
    }),
  ]);
  // and then just dispatch `productUpdateActions.request()` anywhere
}
0.2.2

5 years ago

0.2.1

5 years ago

0.2.0

5 years ago

0.1.0

5 years ago