chowbea-axios - Type-safe Axios Client Generator

Type helpers let you extract request bodies, response types, and schema models directly from your OpenAPI spec. No manual type definitions needed.

Two Approaches

chowbea-axios gives you two ways to reference an endpoint when extracting types. Both produce identical types - it's purely a matter of preference.

You reference endpoints using the URL path template and HTTP method - exactly as they appear in your OpenAPI spec. This approach is intuitive if you think in terms of "I'm calling GET /users/{id}".

Helpers: ApiRequestBody, ApiResponseData, ApiPathParams, ApiQueryParams, ApiStatusCodes

Operation-Based

You reference endpoints using the operationId from your OpenAPI spec. This approach is cleaner if your API has well-named operations like getUserById or createOrder.

Helpers: ServerRequestBody, ServerRequestParams, ServerResponseType

Not sure which to use? Start with path-based - it's more explicit and doesn't require memorizing operation names.

Extract Request Body

type CreateUserInput = ApiRequestBody<"/users", "post">;
// { name: string; email: string }

type CreateUserInput = ServerRequestBody<"createUser">;
// { name: string; email: string }

Extract Response Type

type User = ApiResponseData<"/users/{id}", "get">;

// With specific status code
type CreatedUser = ApiResponseData<"/users", "post", 201>;

type User = ServerResponseType<"getUserById">;

// With specific status code
type NotFound = ServerResponseType<"getUserById", 404>;

Extract Parameters

Path Parameters

type UserParams = ApiPathParams<"/users/{id}">;
// { id: string | number }

Query Parameters

type ListQuery = ApiQueryParams<"/users", "get">;
// { limit?: number; offset?: number }

type Params = ServerRequestParams<"getUserById">;
// { path: { id: string }; query?: { include?: string[] } }

Combines both path and query params in one type.

Extract Status Codes

type UserStatusCodes = ApiStatusCodes<"/users/{id}", "get">;
// 200 | 404 | 500

Schema Models

Extract types from components.schemas:

type User = ServerModel<"User">;
type Post = ServerModel<"Post">;
type PaginatedUsers = ServerModel<"PaginatedUserResponse">;

Utility Helpers

Paths & Methods

type AllPaths = Paths;
// "/users" | "/users/{id}" | "/posts" | ...

type Method = HttpMethod;
// "get" | "post" | "put" | "delete" | "patch"

Better IDE Tooltips

// Expand shows full structure instead of type reference
type ExpandedUser = Expand<User & { posts: Post[] }>;

// ExpandRecursively goes through nested types
type DeepUser = ExpandRecursively<UserWithRelations>;

Examples

Form with typed state

type CreateUserInput = ApiRequestBody<"/users", "post">;

const [form, setForm] = useState<CreateUserInput>({
  name: "",
  email: "",
});

Custom hook with typed response

type User = ApiResponseData<"/users/{id}", "get">;

function useUser(id: string) {
  const [user, setUser] = useState<User | null>(null);
  // ...
}

Service layer

type User = ServerModel<"User">;
type CreateInput = ServerRequestBody<"createUser">;

export const userService = {
  create: (input: CreateInput) => api.post("/users", input),
  getById: (id: string) => api.get("/users/{id}", { id }),
};

Type Helpers