React monitor hook

A library that provides a hook for monitoring multipule endpoints with the specific interval.
This hook uses fetch and Promise.allSettled to retrive resources and manage interval IDs for the developer.

!demo

Installation and usage

The easiest way to use use-react-monitor is to install it from npm.

``s
npm i use-react-monitor
`

Then use it in your app

`javascript

import React, { useEffect } from 'react';
import useMonitor from 'use-react-monitor';

const Tester = () => {
const interval = 3000;
const {results, status, lastTimes} = useMonitor(
{ urls:['http://rem-rest-api.herokuapp.com/api/users',
'http://rem-rest-api.herokuapp.com/api/users',
'http://rem-rest-api.herokuapp.com/api/users'],
freshRate: interval});

return (


)
}

export default Tester

`

$3

` javascript

import React, {memo} from 'react';
import useMonitor, {monitoredPropsAreEqual} from 'use-react-monitor';

const Tester = () => {
const interval = 3000;
const {results, status, lastTimes} = useMonitor(
{ urls:['http://rem-rest-api.herokuapp.com/api/users',
'http://rem-rest-api.herokuapp.com/api/users'],
freshRate: interval});

return (
<>
{}

)
}

const Results = ({ results, status}) => {
const refCount = React.useRef(0);
refCount.current++;
return (


);
};

const MemorizedResults = memo(Results, monitoredPropsAreEqual);

export default Tester

``

* The repository of the example to use use-react-monitor

Parameters

* urls
* freshRate (ms)

Release notes

$3

* 1.0.2: modify the readme.md
* 1.0.1: add a reference

$3

References

* How to create a customized React hook package and publish it to npm?
* eslint-plugin-react-hooks
* npm-link 與 Invalid hook call 錯誤
* SOLVING REACT HOOKS' INVALID HOOK CALL WARNING

About

* Author
* 100DaysOfCode
* Medium