smart-fetch-js

A modern, lightweight wrapper around fetch with built-in retry, timeout, caching, and React support.

Designed for simplicity, performance, and real-world applications.

✨ Features

• ⚡ Simple and intuitive API
• 🔁 Automatic retry on failure
• ⏱ Timeout support with AbortController
• 🧠 Built-in caching system
• 📦 JSON parsing included
• ⚛️ React hook included
• 🧠 TypeScript support
• 🚀 Zero dependencies

📦 Installation

npm install smart-fetch-js

🚀 Basic Usage

import { smartFetch } from "smart-fetch-js"

const data = await smartFetch("https://api.example.com/users", {
  retry: 3,
  timeout: 5000,
  cache: true
})

console.log(data)

⚙️ Options

| Option | Type | Default | Description | | ------- | ------- | ------- | ---------------------------------- | | method | string | GET | HTTP method | | headers | object | {} | Custom request headers | | body | any | — | Request body (auto JSON stringify) | | retry | number | 0 | Number of retry attempts | | timeout | number | 8000 | Request timeout in ms | | cache | boolean | false | Enable in-memory caching |

⚛️ React Usage

import { useSmartFetch } from "smart-fetch-js"

function App() {
  const { data, loading, error } = useSmartFetch(
    "https://api.example.com/users"
  )

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

  return (
    <ul>
      {data.map(user => (
        <li key={user.id}>{user.name}</li>
      ))}
    </ul>
  )
}

🧠 Examples

Retry failed requests

await smartFetch("/api/data", { retry: 3 })

Timeout request

await smartFetch("/api/data", { timeout: 3000 })

Enable cache

await smartFetch("/api/data", { cache: true })

📁 Project Structure

src/
├── core/
│   └── smartFetch.ts
├── react/
│   └── useSmartFetch.ts
└── index.ts

🛠 Development

npm install
npm run build

📄 License

MIT © Guillaume Tech

⭐ Support

If you find this package useful, consider giving it a star on GitHub.