convex-tanstack

Build end-to-end Convex and TanStack Start applications with real-time data and SSR.

25|4|Updated Oct 18, 2025
One-click install
npx skills add https://github.com/Sstobo/convex-skills --skill convex-tanstack
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: convex-tanstack
Source: https://github.com/Sstobo/convex-skills/tree/main/convex-tanstack
Command: npx skills add https://github.com/Sstobo/convex-skills --skill convex-tanstack

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill provides a structured, best-practice guide for building real-time, type-safe full-stack applications using Convex as the backend and TanStack Start as the frontend framework.

Core Features & Use Cases

  • Comprehensive guidance on schema design, queries, mutations, actions, and authentication with Better Auth.
  • Patterns for routing, SSR, data fetching, file storage, scheduling, and AI agents using TanStack Start.
  • Real-world use cases and best practices to accelerate development and reduce common pitfalls.

Quick Start

Follow the included references to bootstrap a Convex + TanStack Start project, review the core references, and adapt the patterns to your application.

Frequently Asked Questions about convex-tanstack

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

FAQPage Schema
How do I build a real-time full-stack app with Convex and TanStack Start?

You can build reactive Convex and TanStack Start applications by applying structured patterns for schema design, queries, mutations, and server-side rendering. This Skill provides best-practice guidance to establish real-time data synchronization and type-safe routing for your project.

What is the best way to integrate Better Auth into a Convex backend?

The best way to integrate Better Auth into a Convex backend is to follow specific authentication patterns designed for TanStack Start. This approach ensures secure end-to-end authentication while maintaining type safety across your real-time full-stack application.

How does server-side rendering work with TanStack Start and Convex?

Server-side rendering with TanStack Start and Convex works by implementing specific data fetching patterns during the server request lifecycle. This ensures your real-time data synchronization initializes correctly on the server before client hydration.

Can I implement AI agents in a full-stack TypeScript project using Convex?

Yes, you can implement AI agents in a full-stack TypeScript project using Convex. The Skill provides integration patterns for combining AI agents with TanStack Start, alongside guidance for scheduling and file storage to support real-world use cases.

Do I need prior experience with Convex to use this Skill effectively?

Yes, you need familiarity with Convex, TanStack Start, Better Auth, and your project's generated API types to use this Skill effectively. It provides best-practice guidance for real-world full-stack projects rather than introductory setup tutorials.

Why are my TanStack Start data fetching patterns not syncing with Convex queries?

TanStack Start data fetching patterns may fail to sync with Convex queries if the schema design and routing do not align with real-time data synchronization practices. Reviewing the core references for queries and mutations helps resolve these common full-stack integration pitfalls.