Code.Design.Create.

Aesthetic design meets functionality, performance, and scalability.

Strong fetch

Strong-fetch is a basic wrapper around the fetch API that provides automatic AbortController handling.

You only need to provide a unique signalKey for each request and the rest is handled by the wrapper.

Main features:

  1. Automatic (and optional) AbortController handling
  2. A FetchError object that extends the Error object and includes the status of the error response for better exceptions handling
  3. Utilities for manually aborting requests if needed
  4. Automatic JSON response data handling
  5. TypeScript friendly

This is currently just a demo, but it might become a npm package in the future. To check the wrapper's source code, access the GitHub repositoryopens a new window and go into the strong-fetch folder. You can also see a live demo hereopens a new window.

Example usage:

import fetch, { type StrongFetchResponse } from 'strong-fetch'
import type { ProductResponse } from './types'

const searchProducts = (
  query: string
): Promise<StrongFetchResponse<ProductResponse>> => {
  return fetch(`https://dummyjson.com/products/search?q=${query}`, {
    signalKey: 'searchProducts'
  })
}

const results = await searchProducts('something')
/* 
  {
    data: ProductResponse
    status: number
    statusText: string
    headers: Record<string, string>
  }
*/