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.