Does this skill support mutations like POST and DELETE?

Yes, the skill generates both useQuery for data fetching and useMutation for data modifications, including success callbacks for cache invalidation.

How does it ensure the data types are correct?

The skill performs a pre-flight check on your backend controllers to confirm the response shape and endpoint URL, ensuring TypeScript types match the actual API output.

Can it handle dependent queries?

Yes, it automatically implements the 'enabled' property to handle dependent queries and prevent unnecessary API calls when parameters are missing.

Does it work with any API client?

While it generates React Query logic, it is specifically optimized to work with a centralized Axios instance located at @/services/api to maintain project consistency.

React Query Hook Generator

Name: React Query Hook Generator
Author: MinhNhut05

byMinhNhut05

0•

API開発

Generates type-safe React Query hooks for API integration with automated cache management and standardized naming conventions.

This skill streamlines the process of creating custom React Query (TanStack Query) hooks for frontend applications by automating boilerplate code. It ensures architectural consistency by validating backend endpoints, enforcing specific naming conventions, and implementing strict TypeScript typing based on actual backend DTOs. Whether you need to fetch data with useQuery or handle state changes with useMutation, this skill provides the necessary patterns for cache invalidation, error handling, and dependent query logic to maintain a robust and synchronized UI.

主な機能

01Built-in query invalidation patterns for state synchronization

020 GitHub stars

03Automated generation of useQuery and useMutation hooks

04Enforcement of standardized naming conventions (use[Action][Resource])

05Strict TypeScript integration using backend-aligned DTOs

06Pre-flight verification of API endpoints and response formats

ユースケース

01Creating mutation hooks for complex form submissions with automatic cache refresh

02Refactoring legacy API calls into standardized TanStack Query patterns

03Adding type-safe data fetching hooks for new dashboard features

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add minhnhut05/devteam-os react-query-hook

For use in Claude.ai and ChatGPT

主な機能

01Built-in query invalidation patterns for state synchronization

020 GitHub stars

03Automated generation of useQuery and useMutation hooks

04Enforcement of standardized naming conventions (use[Action][Resource])

05Strict TypeScript integration using backend-aligned DTOs

06Pre-flight verification of API endpoints and response formats

ユースケース

01Creating mutation hooks for complex form submissions with automatic cache refresh

02Refactoring legacy API calls into standardized TanStack Query patterns

03Adding type-safe data fetching hooks for new dashboard features

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add minhnhut05/devteam-os react-query-hook

For use in Claude.ai and ChatGPT