react-reqq-lite v0.2.3

Description

Easy redux setup for react.

Installation

npm install --save react-reqq-lite

its not a typo, its just thicc

Feature Logs:

0.1.0

• Initial Release, Optimized version of react-reqq

0.2.0

• Optimize useApiLoading
• Include Provider in export

Setup

Provider Setup

import { Provider, configureApi } from 'react-reqq-lite';

export const store = configureApi({
  endpoint: process.env.REACT_APP_END_POINT,
});

<Provider store={store}>
  ...
</Provider>

Import req

import { req } from 'react-reqq-lite'

GET

req.get({
  key: 'foo',
  url: '/users',
  params: {
    q: 'juan',
  }
});

How to get the data

useSelector of react-redux or use the helpers *see below.

import { useSelector } from 'react-redux';

const data = useSelector((state) => state.api.foo);

POST

req.post({
  key: 'foo',
  url: '/users',
  payload: {
    name: 'juan',
  }
});

PUT

req.put({
  key: 'foo',
  url: '/users/1',
  payload: {
    name: 'juan',
  }
});

PATCH

req.patch({
  key: 'foo',
  url: '/users/1',
  payload: {
    name: 'juan',
  }
});

REMOVE

req.remove({
  key: 'foo',
  url: '/users/1'
});

SET

req.set('isFoo', true);

React Hooks Helpers

useApiShow(key, id)

import { useApiShow } from 'react-reqq-lite';

const data = useApiShow('foo', '1');

useApiLoading(key, get|post|put|patch|remove|list|?id)

import { useApiLoading } from 'react-reqq-lite';

const isLoading = useApiLoading('foo', 'get');

Other

configureApi

• endpoint string - Root endpoint http://localhost:8000
• requestHeaders function - Set headers on request.
• onError function - When an error occured during request.

GET | POST | PUT | PATCH | REMOVE

  req.get({
    ...
    // Calls on success response
    onSuccess: () => { ... },

    // Calls on error response
    onError: () => { ... },
  });

GET

  req.get({
    ...
    // Transforms response before storing
    transform: () => {
      // transform data here
      return { ... };
    },

    // Cache response to local storage. `false` clears cache
    cache: true,
  });

Developed by Multisys Technologies Corporation