fetch-gold

Overview

Rather than import one of the popular full-featured HTTP client libraries, I set out to learn and use the native JavaScript Fetch API.

The result is this concise HTTP request wrapper package; it covers 100% of my requirements and is used in all my web apps.

Installation

$ npm i fetch-gold

OR

$ bun i fetch-gold

Usage & Examples

Example 1

a-component.ts

// Import just the single method needed in this component.
import { get } from 'fetch-gold'

const getData = async (url: string): Promise<void> => {
  const response = await get(url)
  if (response.ok) {
    // Assign the JSON response payload to a variable.
    const data = await response.json()
  }
}

await getData('/some/api/endpoint')

Example 2

b-component.ts

// Import the http object to access multiple HTTP methods.
//
// The following methods are available via the http object:
//  - get
//  - post
//  - patch
//  - put
//  - Delete (capitalized cuz delete is reserved)
//
// Though there are other HTTP methods, these cover all
// major use cases.
import { http } from 'fetch-gold'

const getData = async (url: string): Promise<void> => {
  const response = await http.get(url)
  if (response.ok) {
    // Assign the JSON payload to the data variable.
    const data = await response.json()
  }
}

const createItem = async (url: string): Promise<void> => {
  const postData = { name: 'Debussy', piece: 'string quartet' }

  // Add optional request header. Except for the get()
  // method, the following header is automatically
  // included in each request:
  //
  //   'content-type': 'application/json'
  const headers = { authorization: 'jwt token'}
  const response = await http.post(url, postData, headers)

  // Get the HTTP response status code and text.
  const { status, statusText } = response
}

await getData('/some/api/endpoint')
await createItem('/another/api/endpoint')

Fetch API Documentation

https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API

Credits

G. Gold

August 2025

Have fun!