# cache-fetcher

> A dead simple data fetcher

Latest version **0.6.1** (published 2023-08-17) · MIT license · 0 weekly downloads

## Install

```sh
npm install cache-fetcher
pnpm add cache-fetcher
yarn add cache-fetcher
bun add cache-fetcher
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.6.1 |
| Published | 2023-08-17 |
| First published | 2023-08-12 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 31.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Frolleks |
| Maintainers | frolleks |
| Keywords | cache-fetcher, fetch, http, requests |

## Links

- npm: https://www.npmjs.com/package/cache-fetcher
- Repository: https://github.com/frolleks/cache-fetcher
- Homepage: https://cache-fetcher.vercel.app
- Issues: https://github.com/frolleks/cache-fetcher/issues
- npm.io page: https://npm.io/package/cache-fetcher

## Dependencies (1)

- [redaxios](https://npm.io/package/redaxios.md) ^0.5.1

## Alternatives

- [launchdarkly-js-client-sdk](https://npm.io/package/launchdarkly-js-client-sdk.md) — 2.5M weekly downloads
- [@elastic/elasticsearch](https://npm.io/package/@elastic/elasticsearch.md) — 2.1M weekly downloads
- [@c8y/client](https://npm.io/package/@c8y/client.md) — 15.3K weekly downloads
- [@signaldb/maverickjs](https://npm.io/package/@signaldb/maverickjs.md) — 1.7K weekly downloads
- [@bbc/http-transport-cache](https://npm.io/package/@bbc/http-transport-cache.md) — 1.2K weekly downloads

## Recent versions

- 0.6.1 (latest) — 2023-08-17
- 0.6.0 — 2023-08-17
- 0.5.2 — 2023-08-16
- 0.5.1 — 2023-08-16
- 0.5.0 — 2023-08-16
- 0.4.3 — 2023-08-13
- 0.4.2 — 2023-08-13
- 0.4.1 — 2023-08-13
- 0.4.0 — 2023-08-13
- 0.3.5 — 2023-08-13
- 0.3.4 — 2023-08-13
- 0.3.3 — 2023-08-13
- 0.3.2 — 2023-08-13
- 0.3.1 — 2023-08-13
- 0.3.0 — 2023-08-13
- … 7 more at https://npm.io/package/cache-fetcher/versions

## README

# cache-fetcher

[![npm](https://img.shields.io/npm/v/cache-fetcher)](https://npmjs.org/package/cache-fetcher)
![npm](https://img.shields.io/npm/dm/cache-fetcher)

A dead simple and opinionated data fetcher for JavaScript, React, and Solid.js.

## Installation

**npm:** `npm i cache-fetcher`

**yarn:** `yarn add cache-fetcher`

**pnpm:** `pnpm add cache-fetcher`

## Usage

### JavaScript

Simply import it,

```js
import * as cacheFetcher from "cache-fetcher";
```

and make a request.

```js
const res = await cacheFetcher.get(
  "https://jsonplaceholder.typicode.com/todos/1"
);

if (res.isLoading) console.log("Loading...");
else console.log(res.data);

if (res.error) console.log(res.error);

// or like this:

const { data, isLoading, error } = await cacheFetcher.get(
  "https://jsonplaceholder.typicode.com/todos/1"
);

if (isLoading) console.log("Loading...");
else console.log(data);

if (error) console.log(error);
```

### React

Import the `useCacheFetcher` hook,

```js
import { useCacheFetcher } from "cache-fetcher/react";
```

and make a request.

```jsx
function MyComponent() {
  // Let's say you want to fetch some data from this URL
  const url = "https://api.example.com/data";

  // Just call the useCacheFetcher hook with that URL
  const { data, isLoading, error } = useCacheFetcher(url);

  // Now you can handle the various states your data might be in:
  if (isLoading) {
    return <div>Loading...</div>;
  }

  if (error) {
    return <div>Error: {error?.message}</div>;
  }

  // Render your data!
  return (
    <div>
      <h1>Data Loaded!</h1>
      <pre>{JSON.stringify(data, null, 2)}</pre>
    </div>
  );
}

export default MyComponent;
```

### Solid.js

Import the `createCacheFetcher` function,

```js
import { createCacheFetcher } from "cache-fetcher/solid";
```

and make a request.

```jsx
function MyComponent() {
  // Let's say you want to fetch some data from this URL
  const url = "https://api.example.com/data";

  // Just call the createCacheFetcher function with that URL
  const { data, isLoading, error } = createCacheFetcher(url);

  // Now you can handle the various states your data might be in:
  if (isLoading) {
    return <div>Loading...</div>;
  }

  if (error) {
    return <div>Error: {error?.message}</div>;
  }

  // Render your data!
  return (
    <div>
      <h1>Data Loaded!</h1>
      <pre>{JSON.stringify(data, null, 2)}</pre>
    </div>
  );
}
```

---
_Source: https://npm.io/package/cache-fetcher · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._