Agent skill

React Query

TanStack Query ownership for kitcn cRPC queries, mutations, live Convex subscriptions, RSC preloading, cache keys, and bounded invalidation.

Apache-2.0Auto-check passed

Install React Query

skills CLI

$ npx skills add udecode/kitcn --skill react-query -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI

$ gh skill install udecode/kitcn react-query --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy

$ git clone --depth 1 https://github.com/udecode/kitcn.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/react-query .claude/skills/react-query && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Paste into Claude Code

Install the "react-query" agent skill from https://github.com/udecode/kitcn/tree/main/.agents/skills/react-query into .claude/skills/react-query/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-query", then confirm the skill loads.

Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

$skill-installer

$skill-installer install https://github.com/udecode/kitcn/tree/main/.agents/skills/react-query

Type this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.

skills CLI

$ npx skills add udecode/kitcn --skill react-query -a codex

Project install goes to .agents/skills/; add -g for ~/.codex/skills/.

GitHub CLI

$ gh skill install udecode/kitcn react-query --agent codex

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/udecode/kitcn.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.agents/skills/react-query .agents/skills/react-query && rm -rf skills-src

Use ~/.agents/skills/ instead of .agents/skills for a personal install.

Codex skills documentation · loads skills from .agents/skills/

Paste into Codex

Install the "react-query" agent skill from https://github.com/udecode/kitcn/tree/main/.agents/skills/react-query into .agents/skills/react-query/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-query", then confirm the skill loads.

Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add udecode/kitcn --skill react-query -a cursor

Project install goes to .agents/skills/; add -g for ~/.cursor/skills/.

GitHub CLI

$ gh skill install udecode/kitcn react-query --agent cursor

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/udecode/kitcn.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.agents/skills/react-query .cursor/skills/react-query && rm -rf skills-src

Use ~/.cursor/skills/ instead of .cursor/skills for a personal install.

Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/

Paste into Cursor

Install the "react-query" agent skill from https://github.com/udecode/kitcn/tree/main/.agents/skills/react-query into .cursor/skills/react-query/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-query", then confirm the skill loads.

Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

gemini skills install

$ gemini skills install https://github.com/udecode/kitcn.git --path .agents/skills/react-query

--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.

skills CLI

$ npx skills add udecode/kitcn --skill react-query -a gemini-cli

Project install goes to .agents/skills/; add -g for ~/.gemini/skills/.

GitHub CLI

$ gh skill install udecode/kitcn react-query --agent gemini-cli

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/udecode/kitcn.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.agents/skills/react-query .gemini/skills/react-query && rm -rf skills-src

Use ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.

Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/

Paste into Gemini CLI

Install the "react-query" agent skill from https://github.com/udecode/kitcn/tree/main/.agents/skills/react-query into .gemini/skills/react-query/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-query", then confirm the skill loads.

Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

GitHub CLI

$ gh skill install udecode/kitcn react-query

Installs for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).

skills CLI

$ npx skills add udecode/kitcn --skill react-query -a github-copilot

Project install goes to .agents/skills/; add -g for ~/.copilot/skills/.

Manual copy

$ git clone --depth 1 https://github.com/udecode/kitcn.git skills-src && mkdir -p .github/skills && cp -r skills-src/.agents/skills/react-query .github/skills/react-query && rm -rf skills-src

Use ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.

GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/

Paste into GitHub Copilot

Install the "react-query" agent skill from https://github.com/udecode/kitcn/tree/main/.agents/skills/react-query into .github/skills/react-query/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-query", then confirm the skill loads.

GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

skills CLI

$ npx skills add udecode/kitcn --skill react-query -a opencode

OpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.

GitHub CLI

$ gh skill install udecode/kitcn react-query --agent opencode

Project scope by default (.agents/skills/); add --scope user for a personal install.

Manual copy

$ git clone --depth 1 https://github.com/udecode/kitcn.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.agents/skills/react-query .opencode/skills/react-query && rm -rf skills-src

Use ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.

OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/

Paste into OpenCode

Install the "react-query" agent skill from https://github.com/udecode/kitcn/tree/main/.agents/skills/react-query into .opencode/skills/react-query/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "react-query", then confirm the skill loads.

OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.

Facts

Skill name: react-query
GitHub stars: 450
Token cost: ~793 tokens
SKILL.md length: 363 words
Files: 1
Skills in repo: 33
Repo updated: Oct 1, 2026
First seen: Oct 7, 2026
Licence: Apache-2.0

At a glance

TanStack Query ownership for kitcn cRPC queries, mutations, live Convex subscriptions, RSC preloading, cache keys, and bounded invalidation.

SKILL.md covers Default, Colocation, Query Pattern and Mutation Pattern, plus 3 more sections
Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

React Query is an agent skill from udecode/kitcn. TanStack Query ownership for kitcn cRPC queries, mutations, live Convex subscriptions, RSC preloading, cache keys, and bounded invalidation.

Its SKILL.md is about 790 tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It works with TanStack. The repository describes itself as: Convex + Better Auth + tRPC + Drizzle + TanStack Query + shadcn. The licence is Apache-2.0.

Example prompts

“/react-query”

What it can do on your machine

Read from SKILL.md and the folder at commit c6010f5. It shows what the files ask for, not the result of running them.

Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Runs code
No scripts in the folder and no shell commands in SKILL.md (its code samples are typescript).
From the folder's file list and the shell code blocks in SKILL.md.
Network
No URLs in SKILL.md.
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

React Query loads about 793 tokens when it runs. Until then it costs about 38 tokens; SKILL.md has 363 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it: ~38
When it runs · the whole SKILL.md, loaded when a task matches: ~793

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from udecode/kitcn at commit c6010f5, republished under its Apache-2.0 licence (© udecode). 363 words, ~793 tokens.

Download SKILL.mdSave it as .claude/skills/react-query/SKILL.md (or your agent's skills folder).

name: react-query
description: TanStack Query ownership for kitcn cRPC queries, mutations, live Convex subscriptions, RSC preloading, cache keys, and bounded invalidation.

TanStack Query And cRPC

Default

Use generated cRPC query and mutation options as the owner of query keys, functions, input typing, and result typing. Do not hand-build parallel keys or duplicate the transport contract in components.

Convex-backed cRPC queries are live subscriptions unless the API explicitly documents a non-live path. A successful mutation normally updates subscribed queries through Convex; blind invalidation is redundant and can cause churn.

Colocation

Keep a query in the smallest component or hook that owns its loading, empty, error, permission, and success states.
Hoist only when siblings share the same result or a route owns preload.
Keep presentation components data-agnostic when that improves reuse.
Use component colocation rules before inventing a feature-wide data layer.

Query Pattern

tsx

const result = useQuery(
  crpc.projects.list.queryOptions({ workspaceId }),
);

Use skipToken, an explicit enabled condition, or the generated auth-aware option when required input or session authority is missing. Do not send fake identifiers to keep a hook unconditional.

Mutation Pattern

tsx

const createProject = useMutation(
  crpc.projects.create.mutationOptions({
    onSuccess: (project) => {
      router.push(`/projects/${project.id}`);
    },
  }),
);

Own user feedback at the mutation boundary. Disable duplicate submission, surface the actual error, and preserve form input on failure.

Do not invalidate a live cRPC query by habit. Invalidation is allowed only when the consumer is demonstrably non-subscribed, the source is HTTP/external, a manual cache entry was written, or a server-side/RSC snapshot needs a bounded refresh. Name that exception beside the code.

Show full SKILL.md (149 more words)Show less

RSC And Preload

Prefer server callers for server-owned rendering and authorization.
Use the package's supported preload/hydration path when a client component must adopt server-fetched data.
Never create a second query-key dialect for RSC.
Treat server snapshots and live client subscriptions as different lifetimes; document which one owns freshness.
Avoid importing client-only Query machinery into Convex functions or other server-only package entries.

Cache Operations

Use generated filters/options for getQueryData, setQueryData, cancellation, and invalidation. An optimistic update must define rollback and reconciliation with the live Convex result. If subscription delivery is fast enough, prefer pending UI over speculative cache mutation.

Proof

Test the owner, not TanStack Query itself:

query is skipped until required identity/input exists;
mutation pending/error/success states are honest;
live data changes without a redundant refetch;
bounded invalidation affects only the intended non-live key;
RSC hydration and client adoption use one key contract;
permission failures never render stale privileged data.

Files

Just SKILL.md in .agents/skills/react-query of udecode/kitcn.

Open the folder on GitHubat commit c6010f5

Compare with similar skills

React Query next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

React Query compared with similar skills
Skill	Stars	Used in	Tokens	Auto-check	Licence	Repo updated
React Query this skilludecode/kitcn	450	—	~793	Automated safety check: Pass	Apache-2.0	6 days ago
Native Data FetchingCherryHQ/cherry-studio-app	4k	6 repos	~2.9k	Automated safety check: Notes	MIT	4 days ago
Game Changing FeaturesopenstatusHQ/data-table-filters	2.3k	3 repos	~2.1k	Automated safety check: Pass	MIT	5 days ago
Frontend Query Mutationlangflow-ai/langflow	156k	—	~979	Automated safety check: Pass	MIT	today
React Frontend Development Guidelinesdiet103/claude-code-infrastructure-showcase	10k	2 repos	~2.9k	Automated safety check: Pass	MIT	2 mo ago
Wagmi Feature Developmentwevm/wagmi	6.8k	—	~3.8k	Automated safety check: Pass	MIT	6 days ago

Similar skills

Native Data Fetching
CherryHQ/cherry-studio-app
A skill your agent uses when implementing or debugging ANY network request, API call, or data fetching.
4k GitHub starsUsed in 6 repos~2.9k tokens
DevelopmentAuto-check: notes
Game Changing Features
openstatusHQ/data-table-filters
Find 10x product opportunities and high-leverage improvements.
2.3k GitHub starsUsed in 3 repos~2.1k tokens
Product & Project ManagementAuto-check passed
Frontend Query Mutation
langflow-ai/langflow
Guide for implementing Langflow frontend query and mutation patterns with Axios and TanStack React Query v5.
156k GitHub stars~979 tokensUpdated today
Frontend & DesignAuto-check passed
React Frontend Development Guidelines
diet103/claude-code-infrastructure-showcase
Guidelines for React 18 and TypeScript apps covering Suspense data fetching, lazy loading, feature folders, MUI v7 styling, TanStack Router and performance.
10k GitHub starsUsed in 2 repos~2.9k tokens
Frontend & DesignAuto-check passed
Wagmi Feature Development
wevm/wagmi
Walks through adding a Wagmi feature across its layers: a Viem-based core action, TanStack Query options, and React and Vue bindings.
6.8k GitHub stars~3.8k tokensUpdated 6 days ago
DevelopmentAuto-check passed
React State Management
involvex/youtube-music-cli
Master modern React state management with Redux Toolkit, Zustand, Jotai, and React Query.
456 GitHub starsUsed in 12 repos~3k tokens
Frontend & DesignAuto-check passed

Questions about React Query

What does React Query do?

TanStack Query ownership for kitcn cRPC queries, mutations, live Convex subscriptions, RSC preloading, cache keys, and bounded invalidation. React Query is an agent skill from udecode/kitcn. TanStack Query ownership for kitcn cRPC queries, mutations, live Convex subscriptions, RSC preloading, cache keys, and bounded invalidation.

How do I install React Query in Claude Code?

Run `npx skills add udecode/kitcn --skill react-query -a claude-code`. Or copy the skill folder (.agents/skills/react-query in udecode/kitcn) into .claude/skills/react-query in your project. Claude Code loads it when a task matches its description.

How do I install React Query in Codex?

Run `npx skills add udecode/kitcn --skill react-query -a codex`. Or copy the skill folder (.agents/skills/react-query in udecode/kitcn) into .agents/skills/react-query in your project. Codex loads it when a task matches its description.

Can I use React Query in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add udecode/kitcn --skill react-query -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/react-query, .gemini/skills/react-query, .github/skills/react-query and .opencode/skills/react-query in your project.

What does React Query need to run?

SKILL.md names no scripts, command-line tools or credentials: React Query is instructions for the agent only.

Does React Query access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is React Query safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does React Query use?

React Query is published under the Apache-2.0 licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does React Query use?

About 793 tokens (SKILL.md is roughly 3.2k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to React Query?

Skills that share tags, products or a category with React Query: Native Data Fetching (CherryHQ/cherry-studio-app, 4k stars), Game Changing Features (openstatusHQ/data-table-filters, 2.3k stars), Frontend Query Mutation (langflow-ai/langflow, 156k stars) and React Frontend Development Guidelines (diet103/claude-code-infrastructure-showcase, 10k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains React Query?

udecode (a GitHub organization) maintains it in udecode/kitcn, which has 450 GitHub stars. The repository holds 33 skills in this directory. The repository was last updated on October 1, 2026.

Source: udecode/kitcn on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.

React Query

Install React Query

Facts

At a glance

What it does

Example prompts

What it can do on your machine

Tool permissions

Runs code

Network

Credentials

Context cost

Safety

SKILL.md

TanStack Query And cRPC

Default

Colocation

Query Pattern

Mutation Pattern

RSC And Preload

Cache Operations

Proof

Files

Compare with similar skills

Similar skills

Native Data Fetching

Game Changing Features

Frontend Query Mutation

React Frontend Development Guidelines

Wagmi Feature Development

React State Management

More from udecode/kitcn

Walkthrough

Avoid Feature Creep

Changeset Resolve

Convex Release Audit

Jotai X

Linear Backlog

Questions about React Query

Install React Query

Facts

At a glance

What it does

Example prompts

What it can do on your machine

Tool permissions

Runs code

Network

Credentials

Context cost

Safety

SKILL.md

TanStack Query And cRPC

Default

Colocation

Query Pattern

Mutation Pattern

RSC And Preload

Cache Operations

Proof

Files

Compare with similar skills

Similar skills

More from udecode/kitcn

Related

Questions about React Query