Skills tanstack-query
📦

tanstack-query

Content revision r1 Medium Risk 🌐 Network access⚙️ External commands⚡ Contains scripts

Build TanStack Query v5 React Workflows

TanStack Query v5 changes can break data fetching, mutations, and SSR behavior. This skill provides focused setup, migration, debugging, and template guidance for React teams.

Supports: Claude Codex Code(CC)
⚠️ 50 Poor

Install with my Agent

Copy this request to your Agent. It includes the canonical Skill page and manifest.

Agent request
Review the Skillstore skill "tanstack-query" from https://skillstore.io/skills/jezweb-tanstack-query.md and its manifest at https://skillstore.io/api/skills/jezweb-tanstack-query/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

Your Agent should still show its plan and request any confirmation required by the security policy.

Agent-readable resources

Use these links when an AI agent, crawler, or script needs clean context instead of reading the full page.

Markdown detail GET /skills/jezweb-tanstack-query.md Signed manifest GET /api/skills/jezweb-tanstack-query/manifest Signed lockfile GET /api/skills/jezweb-tanstack-query/lockfile

Test it

Using "tanstack-query". A developer asks how to add TanStack Query to a React app.

Expected outcome:

A setup plan with package guidance, provider placement, QueryClient defaults, DevTools notes, and validation steps.

Using "tanstack-query". A maintainer shares v4 code with cacheTime and loading status checks.

Expected outcome:

A migration checklist that maps old options to v5 names and explains changed loading semantics.

Using "tanstack-query". A team reports stale data after a mutation.

Expected outcome:

A debugging path covering query keys, invalidation scope, optimistic updates, and DevTools inspection points.

Security Audit

Medium Risk
v4 • 7/6/2026 Open versioned report

Most static findings are false positives caused by Markdown backticks, TypeScript template literals, local API examples, and React identifiers. Confirmed issues are low-risk external demo API calls in copy-ready templates, plus medium-risk semantic concerns around production DevTools exposure and visible stack traces.

22
Files scanned
4,893
Lines analyzed
28
Review items
0
False positives ignored

Confirmed security concerns (2)

Medium
templates/devtools-setup.tsx:173-198
Production DevTools Can Expose Cache Data
The production DevTools example loads and renders React Query DevTools when a local showDevTools flag is true, but the sample does not enforce authentication. Query cache data can include user records, tokens, or API responses if copied into production.
The file explicitly labels the section as production DevTools and renders the component from a local toggle only. The same file later warns not to ship production DevTools without authentication.
Medium
templates/error-boundary.tsx:70-76
Error Boundary Displays Stack Traces
The default fallback renders error.message and error.stack in the page. Production users could see implementation details if this template is copied without an environment guard.
The code directly renders error details and the stack trace inside the visible fallback UI. This is useful during development but can leak internal details in production.
Capability review items (28)

These are real local capabilities that may be expected for this skill, so they require review but are not counted as confirmed malicious behavior.

Low
templates/custom-hooks-pattern.tsx:22
Fetch API call
const response = await fetch('https://jsonplaceholder.typicode.com/users')
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/custom-hooks-pattern.tsx:28
Fetch API call
const response = await fetch(`https://jsonplaceholder.typicode.com/users/${id}`)
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/custom-hooks-pattern.tsx:34
Fetch API call
const response = await fetch('https://jsonplaceholder.typicode.com/users', {
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/custom-hooks-pattern.tsx:44
Fetch API call
const response = await fetch(`https://jsonplaceholder.typicode.com/users/${id}`, {
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/custom-hooks-pattern.tsx:54
Fetch API call
const response = await fetch(`https://jsonplaceholder.typicode.com/users/${id}`, {
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/custom-hooks-pattern.tsx:22
Hardcoded URL
const response = await fetch('https://jsonplaceholder.typicode.com/users')
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/custom-hooks-pattern.tsx:28
Hardcoded URL
const response = await fetch(`https://jsonplaceholder.typicode.com/users/${id}`)
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/custom-hooks-pattern.tsx:34
Hardcoded URL
const response = await fetch('https://jsonplaceholder.typicode.com/users', {
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/custom-hooks-pattern.tsx:44
Hardcoded URL
const response = await fetch(`https://jsonplaceholder.typicode.com/users/${id}`, {
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/custom-hooks-pattern.tsx:54
Hardcoded URL
const response = await fetch(`https://jsonplaceholder.typicode.com/users/${id}`, {
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/use-infinite-query.tsx:25
Fetch API call
const response = await fetch(
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/use-infinite-query.tsx:26
Hardcoded URL
`https://jsonplaceholder.typicode.com/todos?_start=${start}&_limit=${limit}`
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/use-mutation-basic.tsx:23
Fetch API call
const response = await fetch('https://jsonplaceholder.typicode.com/todos', {
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/use-mutation-basic.tsx:37
Fetch API call
const response = await fetch(
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/use-mutation-basic.tsx:54
Fetch API call
const response = await fetch(
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/use-mutation-basic.tsx:23
Hardcoded URL
const response = await fetch('https://jsonplaceholder.typicode.com/todos', {
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/use-mutation-basic.tsx:38
Hardcoded URL
`https://jsonplaceholder.typicode.com/todos/${id}`,
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/use-mutation-basic.tsx:55
Hardcoded URL
`https://jsonplaceholder.typicode.com/todos/${id}`,
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/use-mutation-optimistic.tsx:40
Fetch API call
const response = await fetch(
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/use-mutation-optimistic.tsx:104
Fetch API call
const response = await fetch(
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/use-mutation-optimistic.tsx:157
Fetch API call
const response = await fetch(
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/use-mutation-optimistic.tsx:41
Hardcoded URL
'https://jsonplaceholder.typicode.com/todos',
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/use-mutation-optimistic.tsx:105
Hardcoded URL
`https://jsonplaceholder.typicode.com/todos/${id}`,
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/use-mutation-optimistic.tsx:158
Hardcoded URL
`https://jsonplaceholder.typicode.com/todos/${id}`,
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/use-query-basic.tsx:18
Fetch API call
const response = await fetch('https://jsonplaceholder.typicode.com/todos')
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/use-query-basic.tsx:55
Fetch API call
const response = await fetch(
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/use-query-basic.tsx:18
Hardcoded URL
const response = await fetch('https://jsonplaceholder.typicode.com/todos')
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.
Low
templates/use-query-basic.tsx:56
Hardcoded URL
`https://jsonplaceholder.typicode.com/todos/${id}`
This copy-ready template calls the public jsonplaceholder API. It is not malicious, but users could accidentally send entered sample data to an external third-party service if run unchanged.

Risk Factors

🌐 Network access (64)
README.md:159 references/common-patterns.md:177 references/testing.md:97 references/testing.md:120 references/top-errors.md:282 references/typescript-patterns.md:20 references/typescript-patterns.md:39 references/typescript-patterns.md:58 references/typescript-patterns.md:88 references/typescript-patterns.md:118 references/typescript-patterns.md:153 SKILL.md:246 SKILL.md:260 SKILL.md:662 SKILL.md:1044 SKILL.md:444 SKILL.md:464 SKILL.md:491 SKILL.md:510 SKILL.md:534 SKILL.md:569 SKILL.md:594 SKILL.md:620 SKILL.md:660 SKILL.md:689 SKILL.md:721 SKILL.md:752 SKILL.md:788 SKILL.md:823 SKILL.md:857 SKILL.md:896 SKILL.md:925 SKILL.md:965 SKILL.md:1058 templates/custom-hooks-pattern.tsx:22 templates/custom-hooks-pattern.tsx:28 templates/custom-hooks-pattern.tsx:34 templates/custom-hooks-pattern.tsx:44 templates/custom-hooks-pattern.tsx:54 templates/custom-hooks-pattern.tsx:22 templates/custom-hooks-pattern.tsx:28 templates/custom-hooks-pattern.tsx:34 templates/custom-hooks-pattern.tsx:44 templates/custom-hooks-pattern.tsx:54 templates/error-boundary.tsx:171 templates/error-boundary.tsx:186 templates/use-infinite-query.tsx:25 templates/use-infinite-query.tsx:26 templates/use-mutation-basic.tsx:23 templates/use-mutation-basic.tsx:37 templates/use-mutation-basic.tsx:54 templates/use-mutation-basic.tsx:23 templates/use-mutation-basic.tsx:38 templates/use-mutation-basic.tsx:55 templates/use-mutation-optimistic.tsx:40 templates/use-mutation-optimistic.tsx:104 templates/use-mutation-optimistic.tsx:157 templates/use-mutation-optimistic.tsx:41 templates/use-mutation-optimistic.tsx:105 templates/use-mutation-optimistic.tsx:158 templates/use-query-basic.tsx:18 templates/use-query-basic.tsx:55 templates/use-query-basic.tsx:18 templates/use-query-basic.tsx:56
⚙️ External commands (212)
references/best-practices.md:205-211 references/common-patterns.md:153-159 references/common-patterns.md:177-181 references/top-errors.md:284-291 references/typescript-patterns.md:39-48 scripts/example-script.sh:1 SKILL.md:24-42 SKILL.md:42-46 SKILL.md:46-48 SKILL.md:48-71 SKILL.md:71-76 SKILL.md:76-80 SKILL.md:80-82 SKILL.md:82-110 SKILL.md:110-116 SKILL.md:116-131 SKILL.md:131-135 SKILL.md:135-136 SKILL.md:136-137 SKILL.md:137-140 SKILL.md:140-143 SKILL.md:143-149 SKILL.md:149-165 SKILL.md:165-169 SKILL.md:169-171 SKILL.md:171-185 SKILL.md:185-191 SKILL.md:191-200 SKILL.md:200-202 SKILL.md:202 SKILL.md:208-211 SKILL.md:211-215 SKILL.md:215-234 SKILL.md:234-238 SKILL.md:238-283 SKILL.md:283-292 SKILL.md:292-296 SKILL.md:296-299 SKILL.md:299-303 SKILL.md:303-306 SKILL.md:306-308 SKILL.md:308-311 SKILL.md:311-314 SKILL.md:314-317 SKILL.md:317-319 SKILL.md:319-322 SKILL.md:322-326 SKILL.md:326-329 SKILL.md:329-334 SKILL.md:334-337 SKILL.md:337-339 SKILL.md:339-344 SKILL.md:344-350 SKILL.md:350-353 SKILL.md:353-374 SKILL.md:374-377 SKILL.md:377-384 SKILL.md:384-387 SKILL.md:387-391 SKILL.md:391-394 SKILL.md:394-402 SKILL.md:402-405 SKILL.md:405-415 SKILL.md:415-418 SKILL.md:418-434 SKILL.md:434-443 SKILL.md:443-446 SKILL.md:446-449 SKILL.md:449-451 SKILL.md:451-454 SKILL.md:454-460 SKILL.md:460-466 SKILL.md:466-469 SKILL.md:469-477 SKILL.md:477-480 SKILL.md:480-487 SKILL.md:487-492 SKILL.md:492 SKILL.md:493 SKILL.md:496-499 SKILL.md:499-502 SKILL.md:502-506 SKILL.md:506-509 SKILL.md:509-512 SKILL.md:512 SKILL.md:515-521 SKILL.md:521-524 SKILL.md:524-530 SKILL.md:530-536 SKILL.md:536-539 SKILL.md:539-545 SKILL.md:545-548 SKILL.md:548-565 SKILL.md:565-568 SKILL.md:568-570 SKILL.md:570-571 SKILL.md:571-574 SKILL.md:574-580 SKILL.md:580-583 SKILL.md:583-590 SKILL.md:590-593 SKILL.md:593-595 SKILL.md:595-596 SKILL.md:596-599 SKILL.md:599-605 SKILL.md:605-608 SKILL.md:608-616 SKILL.md:616-621 SKILL.md:621 SKILL.md:625-634 SKILL.md:634-637 SKILL.md:637-656 SKILL.md:656-659 SKILL.md:659-662 SKILL.md:662 SKILL.md:663 SKILL.md:666-673 SKILL.md:673-676 SKILL.md:676-683 SKILL.md:683-685 SKILL.md:685-691 SKILL.md:691-692 SKILL.md:692 SKILL.md:695-706 SKILL.md:706-709 SKILL.md:709-715 SKILL.md:715-717 SKILL.md:717-720 SKILL.md:720-724 SKILL.md:724 SKILL.md:727-735 SKILL.md:735-738 SKILL.md:738-746 SKILL.md:746-748 SKILL.md:748-754 SKILL.md:754 SKILL.md:758-768 SKILL.md:768-771 SKILL.md:771-782 SKILL.md:782-784 SKILL.md:784 SKILL.md:787-790 SKILL.md:790-794 SKILL.md:794-809 SKILL.md:809-812 SKILL.md:812-817 SKILL.md:817-819 SKILL.md:819-822 SKILL.md:822 SKILL.md:825-826 SKILL.md:826-829 SKILL.md:829-841 SKILL.md:841-844 SKILL.md:844-851 SKILL.md:851-856 SKILL.md:856 SKILL.md:859 SKILL.md:863-880 SKILL.md:880-883 SKILL.md:883-890 SKILL.md:890-895 SKILL.md:895-898 SKILL.md:898-899 SKILL.md:899-902 SKILL.md:902-905 SKILL.md:905-908 SKILL.md:908-913 SKILL.md:913-928 SKILL.md:928-931 SKILL.md:931-949 SKILL.md:949-952 SKILL.md:952-961 SKILL.md:961-967 SKILL.md:967-970 SKILL.md:970-980 SKILL.md:980-983 SKILL.md:983-993 SKILL.md:993-996 SKILL.md:996-1004 SKILL.md:1004-1011 SKILL.md:1011-1017 SKILL.md:1017-1020 SKILL.md:1020-1024 SKILL.md:1024-1027 SKILL.md:1027-1029 SKILL.md:1029-1032 SKILL.md:1032-1039 SKILL.md:1039-1042 SKILL.md:1042-1044 SKILL.md:1044-1047 SKILL.md:1047-1050 SKILL.md:1050-1052 SKILL.md:1052-1058 templates/custom-hooks-pattern.tsx:28 templates/custom-hooks-pattern.tsx:29 templates/custom-hooks-pattern.tsx:44 templates/custom-hooks-pattern.tsx:54 templates/custom-hooks-pattern.tsx:199 templates/error-boundary.tsx:171 templates/error-boundary.tsx:186 templates/error-boundary.tsx:187 templates/use-infinite-query.tsx:26 templates/use-mutation-basic.tsx:30 templates/use-mutation-basic.tsx:38 templates/use-mutation-basic.tsx:47 templates/use-mutation-basic.tsx:55 templates/use-mutation-basic.tsx:62 templates/use-mutation-optimistic.tsx:105 templates/use-mutation-optimistic.tsx:158 templates/use-query-basic.tsx:21 templates/use-query-basic.tsx:56 templates/use-query-basic.tsx:60
⚡ Contains scripts (1)
templates/devtools-setup.tsx:188
Audited by: codex View Audit History →
Share & cite this report

Share the versioned assessment report, neutral badge, embed card, and citations. Skillstore reports evidence without deciding whether this Skill is safe.

Open versioned report
Security Assessment

Copy report link

https://skillstore.io/skills/jezweb-tanstack-query/audits/4?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Markdown badge

[![Skillstore security assessment](https://skillstore.io/badges/skills/jezweb-tanstack-query/security.svg)](https://skillstore.io/skills/jezweb-tanstack-query?utm_source=security_passport_badge)

HTML badge

<a href="https://skillstore.io/skills/jezweb-tanstack-query?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/jezweb-tanstack-query/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

Embed card

<iframe src="https://skillstore.io/embed/skills/jezweb-tanstack-query.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>
Academic citations (APA · BibTeX · CFF)

APA citation

jezweb. (2026). tanstack-query security audit report (audit version 4) [Author version unspecified]. Skillstore. https://skillstore.io/skills/jezweb-tanstack-query/audits/4

BibTeX citation

@techreport{jezweb-jezweb-tanstack-query-2026, author = {jezweb}, title = {tanstack-query security audit report (audit version 4)}, institution = {Skillstore}, year = {2026}, number = {4}, url = {https://skillstore.io/skills/jezweb-tanstack-query/audits/4}, note = {Author version unspecified} }

CITATION.cff

cff-version: 1.2.0 message: "If you use this Skill, cite its author and this versioned security audit report." title: "tanstack-query security audit report (audit version 4)" version: "unspecified" type: report authors: - name: "jezweb" date-released: "2026-07-06" url: "https://skillstore.io/skills/jezweb-tanstack-query/audits/4" identifiers: - type: other value: "skillstore:jezweb-tanstack-query:audit:4" description: "Skillstore immutable audit report identifier"

Skillstore Score

Why this score Evidence Confidence: High
95
Architecture
85
Maintainability
87
Content
73
Community
70
Spec Compliance

What You Can Build

Set up a React app

Create a QueryClient, wrap the app provider, configure cache defaults, and add DevTools safely.

Migrate from v4 to v5

Replace removed callbacks, update option names, fix status flags, and resolve TypeScript migration errors.

Debug server state behavior

Investigate refetching, invalidation, optimistic updates, pagination, suspense, and hydration problems.

Try These Prompts

Start a basic setup 
Help me add TanStack Query v5 to a React TypeScript app. Include provider setup, sensible defaults, and DevTools guidance.
Create query hooks 
Design TanStack Query v5 hooks for this resource. Include query keys, queryOptions, staleTime, error handling, and loading states.
Migrate v4 code 
Review this React Query v4 usage and convert it to TanStack Query v5. Explain each breaking change and safer replacement.
Diagnose advanced behavior 
Analyze this TanStack Query v5 caching, suspense, or hydration problem. Identify likely causes, tests, and minimal code changes.

Best Practices

  • Use stable query keys and central query option factories for repeated resources.
  • Prefer explicit invalidation and optimistic rollback paths for mutations.
  • Review DevTools, stack traces, and demo endpoints before shipping production code.

Avoid

  • Do not use removed v4 callbacks on useQuery in new v5 code.
  • Do not expose production DevTools or cache contents without authentication.
  • Do not copy demo API endpoints into applications that handle real user data.

Frequently Asked Questions

Does this skill run TanStack Query code for me?
No. It provides guidance and templates that you adapt inside your own React project.
Which TanStack Query version does it target?
It targets TanStack Query v5 and includes notes for common v4 to v5 migration issues.
Can it help with TypeScript errors?
Yes. It covers queryOptions, typed query keys, mutation state, error types, and common v5 type changes.
Does it cover SSR and hydration?
Yes. It includes guidance for suspense, streaming server components, hydration timing, and related known issues.
Are the templates production ready?
They are starting points. Replace demo endpoints, remove unsafe debugging output, and review authentication needs.
Can it help write tests?
Yes. It describes MSW handlers, per-test QueryClient setup, retries, and cache isolation patterns.

Developer Details

Author

jezweb

License

MIT

Skillstore revision

r1

Version notice

The author did not declare a version.

Repository

https://github.com/jezweb/claude-skills/tree/main/skills/tanstack-query/

Ref

a06681402992ceae98ba04d54cfd4ab004862696

Maintenance freshness

7/18/2026

Usage

5 downloads · 389 views

File structure

📁 assets/

📄 example-template.txt

📁 references/

📄 best-practices.md

📄 common-patterns.md

📄 example-reference.md

📄 testing.md

📄 top-errors.md

📄 typescript-patterns.md

📄 v4-to-v5-migration.md

📁 rules/

📄 tanstack-query.md

📁 scripts/

📄 example-script.sh

📁 templates/

📄 custom-hooks-pattern.tsx

📄 devtools-setup.tsx

📄 error-boundary.tsx

📄 package.json

📄 provider-setup.tsx

📄 query-client-config.ts

📄 use-infinite-query.tsx

📄 use-mutation-basic.tsx

📄 use-mutation-optimistic.tsx

📄 use-query-basic.tsx

📄 README.md

📄 SKILL.md