skills.rest
reactive
reactiveOFFICIAL
Explore all skills by this author →
Website𝕏@dataclientioGitHub

data-client-rest-setup

Migrates existing HTTP client code to @data-client/rest and configures a custom RestEndpoint base class.

2.0k|99|Updated Feb 15, 2019
Search Tags:#fetch#api-client#typeScript#reST#Axios#data-client#Migration
One-click install
npx skills add https://github.com/reactive/data-client --skill data-client-rest-setup
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: data-client-rest-setup
Source: https://github.com/reactive/data-client/tree/main/.agents/skills/data-client-rest-setup
Command: npx skills add https://github.com/reactive/data-client --skill data-client-rest-setup

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @data-client/rest, and includes references (resource) components.

What problem does it solve?

Adopting @data-client/rest in an existing project requires manually rewriting axios, fetch, ky, superagent, or got calls and reimplementing shared concerns like authentication, base URLs, and error handling. This Skill automates detection of existing HTTP patterns and guides the migration to declarative RestEndpoint definitions.

Core Features & Use Cases

  • HTTP Library Detection: Scans package.json and source imports to identify axios, raw fetch, ky, superagent, or got usage, including mixed codebases.
  • Guided Migration References: Provides per-library migration guides covering interceptors, error handling, timeouts, cancellation, CSRF, upload progress, and pagination.
  • Custom Base Class Generation: Creates a project-specific RestEndpoint subclass with urlPrefix, getHeaders, getRequestInit, process, and searchToString overrides based on detected patterns.
  • Use Case: A React app using axios with interceptors and bearer tokens can be migrated by running the included codemod, then generating a BaseEndpoint class that centralizes auth headers and error handling.

Quick Start

Ask the assistant to set up @data-client/rest in this project and migrate the existing HTTP client code.

Frequently Asked Questions about data-client-rest-setup

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I migrate from axios to @data-client/rest?▼

Run the included jscodeshift codemod to convert axios imports, instances, and method calls into RestEndpoint definitions. Then manually migrate interceptors to getHeaders or process overrides, and replace isAxiosError checks with NetworkError handling.

How do I migrate fetch calls to RestEndpoint?▼

Convert each fetch wrapper into a RestEndpoint with a path and schema. Move shared headers and base URLs into a base class via urlPrefix and getHeaders, since RestEndpoint parses JSON and throws NetworkError on non-2xx responses automatically.

Does @data-client/rest support authentication tokens from React context?▼

Yes, use hookifyResource to inject context-derived headers into every endpoint when tokens live in React context such as Okta or Auth0. For localStorage-based tokens, override getHeaders on a base RestEndpoint class instead.

Can I keep using Zod validation with @data-client/rest?▼

Yes, you can parse responses with Zod inside the process method while keeping an Entity schema for normalization. Alternatively, replace Zod schemas with Entity classes for types that benefit from caching, keeping Zod only for non-normalized responses.

How do I handle request timeouts and cancellation without axios cancelToken?▼

Pass signal: AbortSignal.timeout(ms) on the endpoint for timeouts, and use an AbortController signal for manual cancellation. In React components, use the useCancelling hook for automatic cancellation when parameters change.

Related Skills

Explore More Software Engineering Skills→
opzero1opzero1
3

http-client

Detect axios, ky, or fetch and apply matching TypeScript API templates.

Official
Advanced
prescottprueprescottprue
1

swr-openapi

Generate typed SWR hooks and client types from OpenAPI schemas.

Community
Advanced
alsk1992alsk1992
650

integrations

Manage REST APIs, WebSockets, and webhooks for trading bot data streams.

Community
Advanced
thinkeloquentthinkeloquent

react-data-fetching

Optimize React data fetching with caching, deduplication, and parallel requests.

Official
Advanced