home / skills / ovachiever / droid-tings / tanstack-start

tanstack-start skill

safe

This skill helps you build full-stack React apps with TanStack Start on Cloudflare Workers, enabling type-safe routing, server functions, and SSR.

npx playbooks add skill ovachiever/droid-tings --skill tanstack-start

Review the files below or copy the command above to add this skill to your agents.

Files (5)

SKILL.md

2.8 KB

---
name: TanStack Start
description: |
  Build full-stack React applications with TanStack Start on Cloudflare Workers. Type-safe routing, server functions, SSR/streaming, and seamless D1/KV/R2 integration.

  Use when: building full-stack React apps, need SSR with Cloudflare Workers, want type-safe server functions, or migrating from Next.js.

  RC status - v1.0 stable pending. Monitor tanstack/router#5734 (memory leak) before production use.
license: MIT
allowed-tools: [Bash, Read, Write, Edit]
metadata:
  version: 0.9.0
  author: Jeremy Dawes | Jezweb
  last-verified: 2025-11-18
  production-tested: false
  status: draft
  package: "@tanstack/react-start"
  current_version: "1.136.9"
  keywords:
    - tanstack start
    - tanstack react start
    - tanstack router
    - full-stack react
    - ssr
    - server-side rendering
    - cloudflare workers
    - cloudflare vite plugin
    - server functions
    - api routes
    - type-safe server
    - react framework
    - next.js alternative
    - vite
    - vinxi
    - nitro
    - server components
    - streaming ssr
    - hydration
    - file-based routing
    - react server functions
    - cloudflare d1
    - cloudflare kv
    - cloudflare r2
    - workers assets
---

# TanStack Start Skill [DRAFT - NOT READY]

⚠️ **Status: Release Candidate - Monitoring for Stability**

This skill is prepared but NOT published. Waiting for:
- ⏸️ v1.0 stable release (currently RC v1.136.9 as of 2025-11-18)
- ❌ GitHub #5734 resolved (memory leak with TanStack Form - OPEN as of 2025-11-02)
- ⏸️ Critical bugs stabilization period
- ⏸️ Template/reference content creation

**Current Package:** `@tanstack/[email protected]` (Nov 18, 2025)

**DO NOT USE IN PRODUCTION YET** - RC status, active memory leak issue

---

## Skill Overview

TanStack Start is a full-stack React framework with:
- Client-first architecture with opt-in SSR
- Built on TanStack Router (type-safe routing)
- Server functions for API logic
- Official Cloudflare Workers support
- Integrates with TanStack Query

---

## When v1.0 Stable

This skill will provide:
- Cloudflare Workers + D1/KV/R2 setup
- Server function patterns
- SSR vs CSR strategies
- Migration guide from Next.js
- Known issues and solutions

---

## Monitoring

Track stability at: `planning/stability-tracker.md`

**Check weekly:**
- Package: `npm view @tanstack/react-start version`
- [TanStack Start Releases](https://github.com/TanStack/router/releases)
- [Issue #5734](https://github.com/TanStack/router/issues/5734) - Memory leak blocker

---

## Installation (When Ready)

```bash
npm create cloudflare@latest -- --framework=tanstack-start
```

---

**Last Updated:** 2025-11-18
**RC Announced:** September 22, 2025
**Expected Stable:** Pending issue #5734 resolution + final RC feedback

Overview

This skill documents using TanStack Start to build full‑stack React applications on Cloudflare Workers. It emphasizes type‑safe routing, server functions, SSR/streaming, and first‑class integration with D1/KV/R2. Note: the package is currently a release candidate and should be monitored for a known memory leak before production use.

How this skill works

The skill explains how to scaffold a Cloudflare Workers project that uses TanStack Start for client‑first React with opt‑in SSR. It covers using TanStack Router for type‑safe routes, server functions for backend logic executed on the edge, and seamless data plumbing with TanStack Query. It also highlights patterns for streaming SSR and connecting to Cloudflare storage primitives (D1, KV, R2).

When to use it

Building full‑stack React apps that will run on Cloudflare Workers
Needing type‑safe routing and server functions integrated with the React stack
Requiring SSR or streaming rendering at the edge
Migrating from Next.js to a Cloudflare Workers deployment
Prototyping modern, client‑first apps with server co‑logic

Best practices

Treat the current release as RC: avoid production until the upstream memory leak issue is resolved
Monitor the TanStack Router issue tracker and npm package versions weekly
Design server functions with stateless patterns suited to edge execution
Use D1 for relational needs, KV for small‑fast lookups, and R2 for object storage
Prefer streaming SSR for large payloads to improve time‑to‑first‑byte

Example use cases

A SaaS dashboard that needs type‑safe routes, server mutations, and near‑edge SSR
Migrating a Next.js app to Cloudflare Workers while preserving routing and data fetching patterns
An e-commerce product page using streaming SSR for faster perceived load times
Edge APIs implemented as server functions with D1-backed transactional logic
Prototyping a global multiplayer lobby where low latency and KV lookups matter

FAQ

Is this ready for production?

Not yet. The package is a release candidate and there's an open memory leak issue to monitor. Wait for the stable v1.0 release and confirmation that the leak is resolved before deploying to production.

What should I watch while evaluating the RC?

Track the TanStack Router issue about the memory leak, the package version on npm, and any critical bug fixes in subsequent RC builds.