Zap Studio

Overview

Understand what fetch solves, how it validates responses, and when to use each API surface.

A small fetch wrapper with Standard Schema response validation.

Why fetch?

TypeScript can describe the data you expect from an API, but it cannot prove the API actually returned that shape. Without runtime validation, fetch code often ends with unchecked assertions.

Before

type User = {
  id: number;
  name: string;
};

const response = await fetch("/api/users/1");
const data = await response.json();

const user = data as User;

The compiler trusts the assertion even if the server returns { id: "1" }.

After

With @zap-studio/fetch, the response is parsed and validated before it is returned.

import { api } from "@zap-studio/fetch";
import { z } from "zod";

const UserSchema = z.object({
  id: z.number(),
  name: z.string(),
});

const user = await api.get("/api/users/1", UserSchema);

The returned value is inferred from the schema.

What You Get

  • Raw fetch mode through $fetch(input, options).
  • Validated fetch mode through $fetch(input, schema, options).
  • HTTP method helpers through api.get, api.post, api.put, api.patch, and api.delete.
  • Configured clients through createFetch(...).
  • Runtime validation with any Standard Schema-compatible validator.
  • Structured errors with FetchError and the shared ValidationError.

Core Concepts

  • Use json when the request body should be JSON-stringified.
  • Use native body when you want standard fetch behavior.
  • Use searchParams for query params.
  • Use throwOnFetchError: false to handle non-ok responses yourself.
  • Use throwOnValidationError: false to receive Standard Schema result objects instead of throwing.
Edit on GitHub

Last updated on

On this page