← ClaudeAtlas

http-clientslisted

HTTP clients for frontend and Node.js. Covers Axios, Fetch API, ky, and ofetch. Includes interceptors, error handling, retry logic, and auth token management. Use for configuring API clients and HTTP communication. USE WHEN: user mentions "HTTP client", "Fetch API", "ky", "ofetch", "HTTP wrapper", "retry logic", "token refresh", asks about "which HTTP client to use", "HTTP request library", "API client setup", "request interceptors" DO NOT USE FOR: Axios-specific questions - use `axios` instead; GraphQL - use `graphql-codegen` instead; tRPC - use `trpc` instead; WebSocket connections
claude-dev-suite/claude-dev-suite · ★ 33 · AI & Automation · score 80
Install: claude install-skill claude-dev-suite/claude-dev-suite
# HTTP Clients Core Knowledge > **Full Reference**: See [advanced.md](advanced.md) for token refresh flow, retry with exponential backoff, request cancellation, and type-safe API client patterns. > **Deep Knowledge**: Use `mcp__documentation__fetch_docs` with technology: `http-clients` for comprehensive documentation. ## Axios Setup ```typescript import axios, { AxiosError, InternalAxiosRequestConfig } from 'axios'; const api = axios.create({ baseURL: process.env.NEXT_PUBLIC_API_URL, timeout: 10000, headers: { 'Content-Type': 'application/json' }, }); // Request interceptor - add auth token api.interceptors.request.use( (config: InternalAxiosRequestConfig) => { const token = localStorage.getItem('accessToken'); if (token) { config.headers.Authorization = `Bearer ${token}`; } return config; }, (error) => Promise.reject(error) ); // Response interceptor - handle errors api.interceptors.response.use( (response) => response, (error: AxiosError) => { if (error.response?.status === 401) { window.location.href = '/login'; } return Promise.reject(error); } ); ``` ## Fetch API Wrapper ```typescript class ApiError extends Error { constructor(public status: number, public statusText: string, public data?: unknown) { super(`${status}: ${statusText}`); } } async function fetchWithTimeout(url: string, options: RequestInit & { timeout?: number } = {}): Promise<Response> { const { timeout = 10000, ...fetchOptions }