·data-fetching
{}

data-fetching

qingqishi/shiqingqi.com

Data fetching patterns for server/client components using fetch API, TanStack Query, useSuspenseQuery, apiRouteWrapper, and apiRequestWrapper. Use when implementing data loading, API calls, server functions, queries, mutations, API routes, or when the user mentions TanStack Query, useSuspenseQuery, apiRouteWrapper, apiRequestWrapper, tmdb-server-functions, or data fetching.

3Installs·0Trend·@qingqishi

Installation

$npx skills add https://github.com/qingqishi/shiqingqi.com --skill data-fetching

SKILL.md

This project uses a structured data fetching pattern that differs between server and client components.

Use await directly in server components. Call TMDB server functions from @/utils/tmdb-server-functions.

Client components use TanStack Query to call API routes, which wrap server functions.

Data fetching patterns for server/client components using fetch API, TanStack Query, useSuspenseQuery, apiRouteWrapper, and apiRequestWrapper. Use when implementing data loading, API calls, server functions, queries, mutations, API routes, or when the user mentions TanStack Query, useSuspenseQuery, apiRouteWrapper, apiRequestWrapper, tmdb-server-functions, or data fetching. Source: qingqishi/shiqingqi.com.

View raw

Facts (cite-ready)

Stable fields and commands for AI/search citations.

Install command
npx skills add https://github.com/qingqishi/shiqingqi.com --skill data-fetching
Category
{}Data Analysis
Verified
First Seen
2026-02-01
Updated
2026-02-18

Quick answers

What is data-fetching?

Data fetching patterns for server/client components using fetch API, TanStack Query, useSuspenseQuery, apiRouteWrapper, and apiRequestWrapper. Use when implementing data loading, API calls, server functions, queries, mutations, API routes, or when the user mentions TanStack Query, useSuspenseQuery, apiRouteWrapper, apiRequestWrapper, tmdb-server-functions, or data fetching. Source: qingqishi/shiqingqi.com.

How do I install data-fetching?

Open your terminal or command line tool (Terminal, iTerm, Windows Terminal, etc.) Copy and run this command: npx skills add https://github.com/qingqishi/shiqingqi.com --skill data-fetching Once installed, the skill will be automatically configured in your AI coding environment and ready to use in Claude Code or Cursor

Where is the source repository?

https://github.com/qingqishi/shiqingqi.com