npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@pacote/ffetch

v7.0.2

Published

Fetch API wrapped in a TaskEither

Downloads

40

Readme

@pacote/ffetch

version minified minified + gzip

Fetch API wrapped in a TaskEither.

Installation

yarn add @pacote/ffetch

Usage

In its simplest form, ffetch works a lot like the Fetch API it wraps:

import { ffetch } from '@pacote/ffetch'

const response = await ffetch('https://goblindegook.com/api/kittens/1')()

console.log(result.value) // yields either an error or the response body

The function conveniently abstracts away concerns like response body parsing and some error handling.

However, the main difference and biggest selling point is that ffetch creates a TaskEither object which doesn't immediately run and allows chaining extra functionality. For example, you could more simply implement features like request cancellation and retrying around such an abstraction.

In the example above, executing ffetch(...)() returns a Promise like the Fetch API does. But instead of resolving to a successful response (or rejecting on error), this Promise resolves to an Either representation that holds the successfully obtained and parsed response (on the right) or any of the possible errors that can arise (on the left).

Whatever the result, it can be directly accessed via the value property, but Either also allows handling responses safely through mapping functions, all without resorting to (sometimes nested) try ... catch constructs. For example:

import { ffetch } from '@pacote/ffetch'
import { pipe } from 'fp-ts/function'
import { map, mapLeft, getOrElse } from 'fp-ts/lib/Either'

// Perform the request:
const response = await ffetch('https://goblindegook.com/api/kittens/1')()

// Handling success and failure responses separately:
pipe(
  response,
  map((body) => {
    /* handle successful response */
    return body
  }),
  mapLeft((error) => {
    /* handle request failure */
    return error
  })
)

// Get the successful response body falling back to some default value:
const okOrDefault = pipe(
  response,
  getOrElse(() => 'some default value')
)

Options

The module provides a createFetch() factory function that allows you to override the parsing functions for success and error responses respectively, as well as provide a Fetch API polyfill or replacement.

fetch: (input: Request | string, init?: RequestInit) => Promise<Response>

Provide a Fetch API polyfill or Fetch API-compatible implementation, as in Node environments where a Fetch API function is not globally available. For example:

import { createFetch } from '@pacote/ffetch'
import * as unfetch from 'unfetch'

const unffetch = createFetch({ fetch: unfetch })

await unffetch('https://goblindegook.com/api/kittens/1')()

parse: (r: Response) => Promise<T>

This option can be set to a function that takes a Response object and returns a Promise with its parsed payload.

As an example, you might want to use this to include response headers in the result, or parse binary responses:

import { createFetch } from '@pacote/ffetch'

const binaryFetch = createFetch({
  parse: (r) => r.blob(),
})

await binaryFetch('https://goblindegook.com/api/kittens/1')()

parseLeft: (r: Response) => Promise<E>

This option can be set to a function that takes a Response object and returns a Promise with its parsed payload. This function is used to parse non-ok responses.

For example, you mat set a custom parser to handle text bodies on 5xx class status codes but JSON content for other errors:

import { createFetch } from '@pacote/ffetch'

const customErrorHandlingFetch = createFetch({
  parseLeft: (r) => (r.status >= 500 ? r.text() : r.json()),
})

await customErrorHandlingFetch('https://goblindegook.com/api/kittens/1')()

License

MIT © Luís Rodrigues.