skills.rest
quanganh208
quanganh208COMMUNITY
Explore all skills by this author →
GitHub

ck:tanstack

Build full-stack React apps with TanStack Start routes, forms, and AI streaming.

1|Updated Mar 6, 2026
Search Tags:#tanstack#type-safety#server-functions#tanstack-start#form-validation#tanstack-form#tanstack-ai
One-click install
npx skills add https://github.com/quanganh208/cookmate --skill ck-tanstack-quanganh208
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ck:tanstack
Source: https://github.com/quanganh208/cookmate/tree/main/.claude/skills/tanstack
Command: npx skills add https://github.com/quanganh208/cookmate --skill ck-tanstack-quanganh208

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill streamlines developing full-stack React applications with TanStack Start by providing patterns and guidance for file-based routing, server functions, type-safe form management, and AI streaming so developers can ship complex features faster and with fewer integration errors.

Core Features & Use Cases

  • Framework scaffolding & routing: Patterns for creating file-based routes, route loaders, middleware, and server functions using createFileRoute and createServerFn.
  • Type-safe forms: Guidance for TanStack Form with Zod/Valibot adapters, client/server validation, subscription patterns, and nested/array fields.
  • AI streaming & tools: Instructions for adding TanStack AI chat endpoints, structured output, and isomorphic tools with adapters for OpenAI, Anthropic, Google Gemini, and Ollama.
  • Use case: Implement a blog post route that loads content via a server function, includes a type-validated comment form, and exposes a streaming AI assistant endpoint for summarization and moderation.

Quick Start

Create a TanStack Start route that uses a server function to fetch a post, wire a TanStack Form with Zod validation for comments, and add a TanStack AI streaming API route using the OpenAI adapter.

Frequently Asked Questions about ck:tanstack

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

FAQPage Schema
How do I build type-safe full-stack React applications with TanStack Start?▼

Implement TanStack Form validation by using Zod or Valibot adapters for client and server checks. This handles subscription patterns and nested array fields, ensuring type-safe form management within your full-stack React application.

Can I add AI streaming endpoints to a TanStack Start project?▼

Add AI streaming endpoints to a TanStack Start project using TanStack AI chat features. Configure isomorphic tool definitions and structured output with provider adapters for OpenAI, Anthropic, Google Gemini, and Ollama.

How do I create server functions and file-based routes in TanStack Start?▼

Create server functions and file-based routes in TanStack Start using createServerFn and createFileRoute patterns. These mechanisms enable data loading, middleware integration, and type-safe server execution for your application.

Does TanStack Start support Nitro-compatible deployment targets?▼

TanStack Start supports Nitro-compatible deployment targets for your full-stack React applications. This ensures that your file-based routes, server functions, and AI streaming endpoints can be deployed across various server environments.

What is the best way to structure a blog route with AI moderation in TanStack?▼

Structure a blog route in TanStack by loading content via a server function, wiring a type-validated comment form with Zod, and exposing a streaming AI assistant endpoint. This pattern handles summarization and moderation effectively.

Related Skills

Explore More Software Engineering Skills→
haidonglethqbhaidonglethqb

ck:tanstack

Integrate TanStack Start, Form, and AI into full-stack React apps.

Community
Advanced
WalshingtonWalshington

tanstack-start

Build and deploy TanStack Start full-stack React apps on Cloudflare Workers.

Community
Advanced
locnbk2002locnbk2002
1

tanstack

Develop full-stack React apps with TanStack Start, Form, and AI.

Community
Intermediate
MakePrismsMakePrisms
55

react-router-framework-mode

Configure React Router framework-mode routes with loaders, actions, and error boundaries.

Official
Intermediate