tanstack-start

What problem does it solve?

This Skill provides a comprehensive guide and patterns for developing full-stack applications using TanStack Start, with a particular focus on integrating AI chat and Model Context Protocol (MCP) features. It helps developers quickly implement common patterns for routing, API handling, and AI interactions, reducing development time and complexity.

Core Features & Use Cases

• Streamlined Routing: Master file-based routing, including root layouts, index routes, dynamic segments, and layout routes, to build robust navigation structures.
• Efficient API Routes: Learn to create server handlers for API endpoints, enabling seamless backend logic directly within your routes.
• AI Chat Integration: Implement both client-side (@ai-sdk/react) and server-side (streamText with OpenRouter) AI chat functionalities, making your applications interactive and intelligent.
• MCP Server Setup: Register Model Context Protocol (MCP) tools with Zod schemas to enable advanced, structured AI interactions and tool usage.
• Use Case: Rapidly prototype a new web application that requires dynamic routing, server-side data processing, and integrated AI chat capabilities, such as a customer support bot or an interactive content generator.

Quick Start

Show me how to integrate client-side AI chat using @ai-sdk/react and a server-side API route for streamText with OpenRouter in a TanStack Start project.