react-reqq-lite
v0.2.3
Published
Easy redux setup for react. ## Installation ### `npm install --save react-reqq-lite` *its not a typo, its just thicc*
Downloads
469
Readme
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