Grip-use-fetch

A lightweight custom React hook for fetching data from APIs with optional caching. The useFetch hook simplifies data fetching by managing loading states, caching, errors, and request cancellation using the Fetch API and AbortController.

Features

• Data Fetching: Simplifies fetching data from any API endpoint.
• Loading State: Automatically tracks whether the request is in progress.
• Error Handling: Captures errors and displays meaningful error messages.
• Caching: Optional local storage caching of fetched data to improve performance.
• Request Cancellation: Cancels fetch requests when the component unmounts to prevent memory leaks.

Parameters

url: (String) The API endpoint you want to fetch data from. options: (Object) Optional configuration options for the fetch request. You can pass method, headers, body, etc. useCache: (Boolean) Optional flag to enable or disable local storage caching (default is true)

Return Values

data: (Object) The data returned from the API or from the cache. loading: (Boolean) true while the request is loading, false once it has completed. error: (String|null) Error message, if the fetch fails. Otherwise, it will be null.

Request Cancellation

The useFetch hook automatically handles fetch cancellation using the AbortController. When the component using the hook unmounts or the URL changes, the request is cancelled to prevent memory leaks

Useage

import useFetch from 'grip-use-fetch';

const Component = () => {
 const { data, loading, error } = useFetch('https://api.example.com');

 if (loading) return <p>Loading...</p>;
 if (error) return <p>Error: {error}</p>;

 return <div>{JSON.stringify(data)}</div>;
};
```javascript


## License : MIT 

### Key Points:
- **Installation**: Provides the necessary npm install command.
- **Usage**: Shows how to use the hook with a basic example.
- **Parameters**: Explains what each parameter does.
- **Features**: Highlights caching and request cancellation.
- **Customization**: Shows how to pass custom options for more complex requests.

This `README.md` provides a clear guide on how to install and use the `useFetch` hook effectively.

## Installation

To install the package, run:

```bash
npm install grip-use-fetch