https://github.com/frolleks/cache-fetcher
A dead simple data fetcher for JavaScript, React, and Solid.js
https://github.com/frolleks/cache-fetcher
cache-fetcher http nodejs react requests solid
Last synced: about 1 year ago
JSON representation
A dead simple data fetcher for JavaScript, React, and Solid.js
- Host: GitHub
- URL: https://github.com/frolleks/cache-fetcher
- Owner: frolleks
- License: mit
- Created: 2023-08-12T12:41:39.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2023-08-17T03:39:14.000Z (over 2 years ago)
- Last Synced: 2025-02-08T16:47:54.145Z (about 1 year ago)
- Topics: cache-fetcher, http, nodejs, react, requests, solid
- Language: TypeScript
- Homepage: https://cache-fetcher.vercel.app/
- Size: 103 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# cache-fetcher
[](https://npmjs.org/package/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
Loading...;
}
if (error) {
return
Error: {error?.message};
}
// Render your data!
return (
Data Loaded!
{JSON.stringify(data, null, 2)}
);
}
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
Loading...;
}
if (error) {
return
Error: {error?.message};
}
// Render your data!
return (
Data Loaded!
{JSON.stringify(data, null, 2)}
);
}
```