TanStack Start 1.0 con agentes de IA: tutorial con Intent

Tanner Linsley lo dejó caer en el anuncio de la versión 1.0: “prueba a decirle a tu agente usa TanStack Start, te sorprenderá lo lejos que llega”. Tiene truco, claro. Llega lejos porque el equipo de TanStack ha preparado el terreno para que Claude Code, Codex u OpenCode no programen a ciegas con APIs de hace dos versiones.

Esto no es una nota de prensa sobre la 1.0. Es un tutorial para montar una app web moderna con TanStack Start dejando que el agente haga el trabajo pesado, pero con las herramientas que el propio framework pone a su disposición.

Lo que vas a sacar de este artículo:

• Qué piezas del ecosistema TanStack ayudan a tu agente a programar y cuáles sirven para otra cosa (spoiler: no necesitas TanStack AI)
• Cómo arrancar un proyecto con el Application Starter o con el CLI, con los prompts reales que genera
• Cómo instalar TanStack Intent para que el agente cargue las skills oficiales de Start y Router antes de tocar código
• Un flujo completo, fase a fase, para construir una app con rutas, server functions, middleware y despliegue
• Cómo revisar lo que entrega el agente sin perder la tarde

¿Qué trae TanStack Start 1.0 y por qué le importa a tu agente? ¶

TanStack Start 1.0 se publicó el 13 de octubre de 2026 y es un framework full-stack para React (y Solid) construido sobre TanStack Router. Server functions tipadas, middleware que funciona en cliente y servidor, SSR con streaming y despliegue sobre Vite + Nitro, sin adaptadores propios.

Si leíste nuestro primer vistazo a TanStack Start de 2024, olvida la parte de Vinxi. Ese andamiaje ya no existe. Ahora la base es un plugin de Vite (tanstackStart()) y la idea central se resume en una pregunta: ¿dónde se ejecuta este código?

El anuncio destaca varias cosas que encajan muy bien con un agente:

• SSR selectivo: una ruta puede renderizar en el servidor, cargar sus datos allí sin renderizar el componente o renderizar en el cliente.
• createIsomorphicFn: una misma función con implementación de servidor y de cliente, y el código del otro entorno desaparece de cada bundle.
• Rendimiento: según el equipo, el trabajo en SSR multiplicó por cinco y medio el throughput en su benchmark.
• Adopción: Netlify lo ha puesto por defecto en su generador de apps con IA, que según el anuncio ha usado más de un millón de personas.

Y los números de npm acompañan. En la semana del 6 al 12 de octubre de 2026, @tanstack/react-start sumó 11,6 millones de descargas, @tanstack/react-router 19,9 millones y @tanstack/react-query 65,1 millones (datos de la API pública de npm).

¿Por qué le importa todo esto a un agente?

Porque la seguridad de tipos es un raíl. El propio Tanner lo cuenta en el post: los tipos ayudan a que los agentes hagan cambios coherentes. Si el agente rompe un parámetro de ruta o el contrato de una server function, TypeScript se lo dice antes que tú. En Next.js muchas de esas decisiones viven en convenciones de carpetas y directivas como "use server"; en Start viven en funciones con tipos que el compilador puede comprobar.

🔑 Para un agente, un framework amigable es el que hace saltar sus errores pronto y en un sitio que puede leer: el compilador, antes que tu revisión del viernes.

¿Qué herramientas de TanStack sirven para programar con IA y cuáles no? ¶

La respuesta corta: para que tu agente programe bien con Start necesitas TanStack Intent y el TanStack CLI. El Application Starter te ahorra el primer prompt. TanStack AI es otra cosa: una librería para meter funciones de IA dentro de tu aplicación.

La confusión es comprensible, porque todo lleva la etiqueta “AI” en la web de TanStack. Pero hay dos mundos: herramientas que ayudan a tu agente a escribir el código y librerías que usa tu código.

Curso gratis por email

Intent te trae las skills de TanStack. ¿Y las de tu proyecto?

Un minicurso gratis por email, a tu ritmo, para instalar skills en tu agente y crear la tuya, la que se aprende tus convenciones para que no se las repitas en cada sesión.

Apúntate al minicurso →

¿Cómo arranco un proyecto con el Application Starter? ¶

El Application Starter es una página donde describes la app que quieres, eliges librerías e integraciones y pulsas “Copy Prompt”. No genera el código: genera el prompt para que lo haga tu agente. Está marcado como alpha.

La interfaz te pregunta “What would you like to build?” y te deja escoger librerías de TanStack, partners (auth, base de datos…), gestor de paquetes, toolchain y destino de despliegue (Cloudflare, Netlify, Vercel, Railway, Render…). Al final aparecen botones para abrir el prompt directamente en Codex, Claude o Cursor, clonar a GitHub o descargar un ZIP en modo CLI.

Lo interesante es lo que contiene el prompt. Esta es la plantilla base que construye la página (extraída de su código, para una app con pnpm y Tailwind):

Create a TanStack Start application named my-tanstack-app using React.
Start by scaffolding the project with the TanStack CLI.
Use this command: npx @tanstack/cli@latest create my-tanstack-app --agent --package-manager pnpm --tailwind

After scaffolding, install dependencies and then wire TanStack Intent into the repo with: npx @tanstack/intent@latest install
Then inspect the installed package skills with: npx @tanstack/intent@latest list
Use the installed TanStack Intent skills and package-shipped guidance before making architectural or library-specific changes. Do not guess when a shipped skill can tell you the current pattern.
Update the repo agent config files that TanStack Intent targets (for example CLAUDE.md, .cursorrules, or equivalent) if needed. In AGENTS.md or the project equivalent, keep durable project context, the exact CLI command used, chosen stack and integrations, environment variable requirements, deployment notes, key architectural decisions, known gotchas, and next steps.

Keep the stack minimal and add only the essentials already selected.
Use pnpm for package management and keep Tailwind enabled.

After scaffolding, explain the resulting structure and the next setup steps.

Fíjate en tres decisiones de diseño que puedes copiar en tus propios prompts:

1. Andamiaje determinista primero. El agente no inventa la estructura de carpetas: ejecuta el CLI oficial y parte de ahí.
2. Skills antes que memoria. “Do not guess when a shipped skill can tell you the current pattern” es la frase más valiosa de todo el prompt.
3. Memoria del proyecto en AGENTS.md. El comando exacto, el stack, las variables de entorno y los gotchas quedan escritos para la siguiente sesión.

Si añades integraciones o un destino de despliegue, la página agrega líneas como “Include these integrations: …” o “Target deployment: …”. Y hay un modo “Migrate from Next.js” que pide la URL del repo antiguo, lo clona en ./legacy-source como referencia y migra ruta a ruta. Volveremos a él.

💡 El flag --agent del comando es interno: marca que la invocación viene de un agente. No lo necesitas si ejecutas el CLI a mano.

¿Cómo creo el proyecto desde el terminal con el CLI? ¶

Si prefieres no pasar por la web, el CLI hace lo mismo. Y desde la versión actual prepara TanStack Intent al crear el proyecto salvo que uses --blank o --no-intent.

# Proyecto Start con SSR, Drizzle y TanStack Query, desplegable en Netlify
npx @tanstack/cli@latest create lecturas \
  --add-ons drizzle,tanstack-query \
  --deployment netlify \
  --package-manager pnpm \
  -y

Antes de decidir integraciones, el agente (o tú) puede preguntar al CLI qué hay disponible, en JSON:

# Qué add-ons existen y qué hace uno concreto
npx @tanstack/cli@latest create --list-add-ons --framework React --json
npx @tanstack/cli@latest create --addon-details drizzle --framework React --json

Y si el proyecto ya existe, las integraciones se añaden después:

npx @tanstack/cli@latest add clerk drizzle

¿Por qué importa que todo tenga salida --json? Porque un agente lee JSON mucho mejor que una tabla con colores ANSI. El CLI está pensado para que lo use una máquina tanto como una persona.

¿Qué es TanStack Intent y cómo preparo el repo? ¶

TanStack Intent es un CLI que distribuye Agent Skills dentro de los paquetes npm. Cada librería publica sus SKILL.md en skills/ y, al actualizar la dependencia, actualizas también las instrucciones que lee tu agente. Así se ataca el problema de siempre: el modelo aprendió la API de hace un año y la escribe con toda la confianza del mundo.

Si ya trabajas con skills sabes de qué va esto. Si no, en la diferencia entre skills, prompts y MCP lo explicamos desde cero. Lo nuevo de Intent es que las skills viajan con la versión que tienes instalada, no con la que había cuando alguien escribió un tutorial.

En un proyecto existente, la preparación son dos comandos:

npm i -D @tanstack/intent
npx @tanstack/intent@latest install

El asistente interactivo te pregunta qué paquetes permites y guarda la lista en package.json:

{
  "intent": {
    "skills": ["@tanstack/*"]
  }
}

Puedes permitir todo (*), un scope, un paquete o una skill concreta (paquete#skill), y excluir con intent.exclude, que tiene prioridad. Sin esa lista, la instalación no interactiva falla a propósito: nadie mete instrucciones en tu agente sin que tú lo autorices.

Después, el instalador escribe un bloque en el fichero de instrucciones del agente. Por defecto es AGENTS.md; si ya tenías el bloque en otro fichero (CLAUDE.md, por ejemplo), actualiza ese. Este es el bloque real que genera con npm:

<!-- intent-skills:start -->
## Skill Loading

Use the repository's installed Intent. If it is unavailable, report the missing dependency instead of downloading a replacement.
Before editing files for a substantial task:
- Run `npm exec --no -- intent list` from the workspace root to see available local skills.
- If a listed skill matches the task, run `npm exec --no -- intent load <package>#<skill>` before changing files.
- Use the loaded `SKILL.md` guidance while making the change.
- Monorepos: when working across packages, run the skill check from the workspace root and prefer the local skill for the package being changed.
- Multiple matches: prefer the most specific local skill for the package or concern you are changing; load additional skills only when the task spans multiple packages or concerns.
<!-- intent-skills:end -->

Corto y concreto. Es un buen ejemplo de lo que debería ser un fichero de reglas, algo de lo que hablamos a fondo en AGENTS.md: reglas y contexto para tu agente.

Para ver qué skills tienes disponibles:

npx @tanstack/intent@latest list

En un proyecto Start recién creado verás algo como “3 intent-enabled packages, 20 skills”. Y para cargar una a mano:

npx @tanstack/intent@latest load @tanstack/start-client-core#server-functions

¿Funciona igual en Claude Code, Codex y OpenCode? ¶

No exactamente, y conviene saberlo:

• Claude Code y Codex: Intent puede instalar hooks a nivel de proyecto que inyectan el catálogo de skills al iniciar la sesión y mantienen una “puerta de edición” hasta que el agente ejecuta un intent load. La documentación avisa de que los hooks no verifican que el comando funcionara ni que el agente aplicara la guía.
• GitHub Copilot CLI: las instrucciones van a .github/copilot-instructions.md y los hooks son de usuario.
• OpenCode, Cursor y cualquier agente que lea AGENTS.md: solo las instrucciones, sin hooks. Funciona, pero depende de que el agente las respete.

# Instala los hooks del proyecto (Claude Code / Codex)
npx @tanstack/intent@latest hooks install

⚠️ Con OpenCode o Cursor no hay hook que obligue a cargar la skill. Si notas que el agente se lanza a editar sin pasar por intent load, díselo explícitamente en el prompt de cada tarea. Más abajo tienes uno listo para copiar.

¿Qué skills oficiales trae TanStack Start? ¶

Las skills de Start y Router se reparten entre varios paquetes y cubren justo lo que un agente suele hacer mal: qué código va al cliente y cuál al servidor, cómo validar entradas, cómo proteger rutas. Puedes explorarlas en el registro oficial de Intent.

Las de router-core son diez y una de ellas, type-safety, tiene una regla que me encanta: nunca hagas cast, nunca anotes valores inferidos. Es el vicio de los modelos cuando se atascan con un tipo: meter as any y seguir.

El CLI también trae sus propias skills (create-app-scaffold, choose-ecosystem-integrations, add-addons-existing-app, query-docs-library-metadata…), así que el agente sabe usar la herramienta que lo andamia.

🎯 Las skills de TanStack enseñan la versión de TanStack que tienes instalada, no React en general. Con ellas cargadas, el agente deja de escribir llamadas a APIs que ya no existen.

¿Cómo consulta tu agente la documentación sin un servidor MCP? ¶

Con el CLI. El servidor MCP que traía @tanstack/cli se ha retirado y no va a volver, según su guía de migración. Si lo tenías configurado en tu cliente, quita la entrada @tanstack/cli mcp.

Cada herramienta del antiguo MCP tiene su comando equivalente:

¿Tiene sentido quitar un MCP en 2026? Tiene todo el sentido. Un agente con acceso al terminal ya sabe ejecutar comandos, el CLI no ocupa contexto con definiciones de herramientas que no usa y la salida JSON es fácil de leer. Es la misma conclusión a la que han llegado otros proyectos que publican CLI pensados para agentes.

En la práctica, tu agente hará cosas como esta cuando dude de una API:

npx @tanstack/cli@latest search-docs "selective ssr" \
  --library start --framework react --json

Hay un tercer recurso: llms.txt. TanStack publica un índice raíz en https://tanstack.com/llms.txt que manda a los índices de cada producto (/start/latest/llms.txt, /router/latest/llms.txt…). El equipo explica que no publica un llms-full.txt completo porque toda la documentación junta es demasiado grande para servir de contexto. Y casi cualquier página de la documentación tiene versión markdown si le añades .md a la URL.

El flujo completo, con prompts

El método fase a fase que vas a usar con Start, para cualquier proyecto

Te llevas un flujo de 7 fases, de la petición a la PR, con cada paso abriendo con su prompt listo para copiar. Lo mismo que vas a hacer ahora con TanStack, sin depender de un framework.

Abrir la guía →

Incluye la chuleta completa de prompts + repo con la PR terminada

Tutorial: cómo construir una app con TanStack Start y tu agente paso a paso ¶

Vamos a construir Lecturas, una app para guardar artículos pendientes de leer: listado, alta con validación, zona privada con sesión, un endpoint JSON y despliegue. Lo bastante pequeña para un tutorial y lo bastante completa para tocar las piezas que un agente suele estropear.

El método es siempre el mismo: una fase, un prompt, una revisión. No le pidas la app entera de golpe. Ya sabes cómo acaba eso: 40 ficheros, tres patrones distintos para lo mismo y una tarde de arqueología.

Fase 0: el prompt base que vas a reutilizar ¶

Todo prompt de tarea empieza con este bloque. Funciona en Claude Code, Codex y OpenCode:

Implementa la tarea que te describo abajo. Antes de editar:
1. Ejecuta `npx @tanstack/intent list` y carga con `intent load` las skills
   de Start y Router que correspondan a la tarea.
2. Si necesitas confirmar una API, consulta la documentación oficial con
   `npx @tanstack/cli@latest search-docs "<tema>" --library start --json`.
3. No uses `as any` ni casts para silenciar tipos.
Al terminar, ejecuta el typecheck y dime qué skills cargaste.

Tarea: ...

La última línea no es decorativa. Pedirle que diga qué skills cargó te permite comprobar de un vistazo si se ha saltado el paso.

Fase 1: crear el proyecto ¶

Crea un proyecto TanStack Start llamado "lecturas" con React usando el CLI:
npx @tanstack/cli@latest create lecturas --add-ons drizzle,tanstack-query --deployment netlify --package-manager pnpm -y
Comprueba que Intent quedó configurado con `intent list`. Arranca el servidor
de desarrollo y resume la estructura generada en AGENTS.md: comando usado,
stack, variables de entorno necesarias y próximos pasos.

Qué revisar: que exista vite.config.ts con el plugin tanstackStart(), que src/routes/ tenga la ruta raíz y que routeTree.gen.ts se regenere solo (ese fichero no se edita a mano; si el agente lo toca, mal asunto).

Fase 2: datos y server functions ¶

Tarea: crea el esquema de Drizzle para la tabla "articles" (id, url, title,
read: boolean, createdAt). Crea dos server functions en
src/server/articles.functions.ts: listArticles (GET) y createArticle (POST)
con validación Zod de la entrada. Usa listArticles en el loader de la ruta /.

El agente debería cargar server-functions y router-core/data-loading. El resultado tiene que parecerse a esto:

// src/server/articles.functions.ts
import { createServerFn } from '@tanstack/react-start'
import { z } from 'zod'
import { db } from './db'
import { articles } from './schema'

export const listArticles = createServerFn({ method: 'GET' }).handler(async () => {
  // Solo se ejecuta en el servidor, aunque se llame desde el loader
  return db.select().from(articles)
})

const NewArticle = z.object({
  url: z.string().url(),
  title: z.string().min(1).max(200),
})

export const createArticle = createServerFn({ method: 'POST' })
  .validator(NewArticle)
  .handler(async ({ data }) => {
    // data ya llega validado y tipado
    const [article] = await db.insert(articles).values(data).returning()
    return article
  })

// src/routes/index.tsx
import { createFileRoute } from '@tanstack/react-router'
import { listArticles } from '../server/articles.functions'

export const Route = createFileRoute('/')({
  loader: () => listArticles(),
  component: Home,
})

function Home() {
  const articles = Route.useLoaderData()
  return (
    <ul>
      {articles.map((a) => (
        <li key={a.id}>{a.title}</li>
      ))}
    </ul>
  )
}

Qué revisar:

• Que la validación use .validator(). Es el método que exponen los tipos de la versión actual; si ves otro nombre, el agente está tirando de memoria y no de la skill.
• Que el cliente de base de datos solo se importe desde código de servidor. Si db aparece en un componente, el agente no entendió el modelo de ejecución.
• Que la llamada desde el cliente sea createArticle({ data: { ... } }). El argumento va dentro de data.

🛡️ El fallo más caro con un agente en Start no es un error de compilación: es una variable de entorno secreta que acaba en el bundle del cliente. La skill execution-model insiste en que solo las variables con prefijo VITE_ son públicas. Revisa a mano cualquier process.env que toque el agente.

Fase 3: middleware y zona privada ¶

Tarea: añade autenticación por cookie de sesión. Crea un middleware de server
function que lea la sesión y pase el usuario en el contexto. Protege
createArticle con él y crea la ruta /mis-lecturas que redirija a /login si no
hay sesión. Carga las skills middleware, auth-server-primitives y
router-core/auth-and-guards.

El patrón que debería salir:

// src/server/auth.middleware.ts
import { createMiddleware } from '@tanstack/react-start'
import { getSessionUser } from './session'

export const authMiddleware = createMiddleware({ type: 'function' })
  .server(async ({ next }) => {
    const user = await getSessionUser()
    if (!user) throw new Error('Unauthorized')
    // El usuario viaja tipado en el contexto
    return next({ context: { user } })
  })

// En articles.functions.ts
export const createArticle = createServerFn({ method: 'POST' })
  .middleware([authMiddleware])
  .validator(NewArticle)
  .handler(async ({ data, context }) => {
    return db.insert(articles).values({ ...data, userId: context.user.id }).returning()
  })

Aquí es donde más se nota la diferencia entre un agente con skills y uno sin ellas. Sin la skill de auth-server-primitives, lo habitual es que monte una sesión sin protección CSRF o que guarde el token en localStorage. Con ella, por lo menos parte de un checklist razonable.

⚠️ “Por lo menos” es la palabra importante. La autenticación es el sitio donde no delegas la revisión. Si el proyecto va en serio, usa un proveedor (el CLI tiene add-ons como Clerk) y que el agente se limite a integrarlo.

Fase 4: un endpoint HTTP con server routes ¶

Tarea: crea un endpoint GET /api/articles que devuelva las lecturas en JSON
para usarlas desde un atajo del móvil. Carga la skill server-routes.

// src/routes/api/articles.ts
import { createFileRoute } from '@tanstack/react-router'
import { db } from '../../server/db'
import { articles } from '../../server/schema'

export const Route = createFileRoute('/api/articles')({
  server: {
    handlers: {
      GET: async () => {
        const rows = await db.select().from(articles)
        return Response.json(rows)
      },
    },
  },
})

Las server routes son rutas del mismo árbol de ficheros con una propiedad server. Nada de carpeta api/ aparte con sus propias reglas. Para un agente eso es una convención menos que recordar.

Fase 5: despliegue ¶

Tarea: prepara el despliegue en Netlify. Carga la skill deployment. Decide qué
rutas pueden prerenderizarse y cuáles necesitan SSR, y documenta la decisión y
las variables de entorno en AGENTS.md.

Como Start delega el build en Vite y Nitro, el agente no tiene que pelearse con adaptadores propios. La skill deployment cubre Cloudflare Workers, Netlify, Vercel, Node/Docker, Bun y Railway, además de SPA mode, prerender e ISR.

Lo que sí te toca a ti: revisar qué ha escrito en AGENTS.md. Esa sección es la que leerá el agente la próxima vez que abras el proyecto, dentro de tres semanas, cuando ya no te acuerdes de por qué /mis-lecturas no se prerenderiza.

¿Cómo reviso lo que ha hecho el agente? ¶

Revisando señales concretas, no leyendo cada línea. Un agente bien guiado en Start deja pistas fáciles de comprobar.

Si tienes la costumbre de revisar con otro agente, encaja de maravilla. Un segundo modelo con las mismas skills cargadas puede auditar el primero contra la guía oficial, no contra su intuición.

¿Y si vengo de Next.js? ¶

Tienes una skill y un prompt para eso. @tanstack/react-start incluye lifecycle/migrate-from-nextjs, que describe la conversión de rutas del App Router, el paso de Server Actions a server functions, el middleware y los cambios en la carga de datos.

El Application Starter tiene además un modo de migración que genera este prompt:

Migrate an existing Next.js app to TanStack Start. Preserve the current UX,
auth integration, routing structure, and data fetching behavior. Start by
scaffolding a fresh TanStack Start app, then migrate the existing app
incrementally route by route and feature by feature.

Seguido de la URL del repo antiguo y la instrucción de clonarlo en ./legacy-source solo como referencia.

Fíjate en el “route by route”. Es la misma regla de una fase por prompt que hemos usado en el tutorial. Una migración de golpe con un agente tiene la misma pinta que una mudanza metiendo todo en cajas sin etiquetar: llegas, pero no encuentras nada.

¿Necesito TanStack AI para programar con agentes? ¶

No. TanStack AI es una librería para construir funciones de IA dentro de tu aplicación: chats, agentes, herramientas. No tiene nada que ver con que Claude Code te escriba mejor el código.

Dicho esto, si Lecturas necesitara un “resúmeme este artículo”, encaja muy bien con Start. Su quick start define un endpoint que devuelve un stream:

import { chat, chatParamsFromRequest, toServerSentEventsResponse } from '@tanstack/ai'
import { openaiText } from '@tanstack/ai-openai'

export async function POST(request: Request) {
  const { messages, threadId, runId } = await chatParamsFromRequest(request)
  const stream = chat({ adapter: openaiText('gpt-5.6'), messages, threadId, runId })
  return toServerSentEventsResponse(stream)
}

Y en el cliente, useChat de @tanstack/ai-react consume ese stream. Ese POST encaja tal cual en el handler de una server route como la de la fase 4.

Otra fuente de confusión: @tanstack/ai-mcp. Es un cliente MCP tipado para que el agente que construyes dentro de tu app use herramientas de servidores MCP. No sustituye al MCP retirado del CLI ni sirve para que tu agente de programación consulte la documentación.

Una curiosidad: TanStack AI también tiene un plugin para Claude Code (/plugin marketplace add TanStack/ai y /plugin install tanstack-ai), por si tu agente tiene que escribir código que use esa librería. Está en fase RC, así que cuenta con cambios.

¿Qué errores cometen los agentes con TanStack Start? ¶

Los más frecuentes son los que traen de otros frameworks. Un modelo entrenado con miles de proyectos Next.js tiende a escribir Next.js aunque le digas otra cosa.

1. Usar APIs de versiones anteriores. Vinxi, app.config.ts o nombres de métodos que cambiaron durante la beta. Solución: Intent y la frase “do not guess”.
2. Poner "use server" por inercia. En Start las funciones de servidor se definen con createServerFn, no con directivas.
3. Filtrar código de servidor al cliente. Importar el cliente de base de datos en un componente. La skill execution-model y las funciones createServerOnlyFn lo previenen.
4. Editar routeTree.gen.ts. Es generado. Si el agente lo toca, algo está mal en otro sitio.
5. Silenciar tipos con as any. Justo lo que quita la ventaja de usar Start con un agente.
6. Pedir demasiado en un prompt. No es culpa del framework, pero aquí se paga igual.

Un truco que funciona: guarda en AGENTS.md, fuera del bloque de Intent, una lista corta con los errores que el agente ya ha cometido en tu proyecto. Te ahorra repetir la misma corrección cada lunes.

TL;DR ¶

• 🚀 TanStack Start 1.0 (13 de octubre de 2026) es un framework full-stack sobre TanStack Router, con build en Vite + Nitro y server functions tipadas que hacen de raíl para los agentes.
• 🧠 TanStack Intent distribuye skills oficiales dentro de los paquetes npm: npx @tanstack/intent@latest install escribe en AGENTS.md cuándo cargarlas, y el CLI de creación lo deja configurado por defecto.
• 🔧 El MCP del CLI se ha retirado: tu agente consulta la documentación con tanstack search-docs ... --json y descubre integraciones con tanstack create --list-add-ons --json.
• 🎯 Trabaja fase a fase con un prompt base que obliga a cargar skills, prohíbe los casts y pide decir qué skills usó.
• 📚 TanStack AI sirve para meter IA dentro de tu app; para programar con Claude Code, Codex u OpenCode no lo necesitas.

Preguntas frecuentes sobre TanStack Start y agentes de IA ¶

¿Cuándo salió TanStack Start 1.0?
El anuncio oficial se publicó el 13 de octubre de 2026 en el blog de TanStack. El número 1.0 es el hito del producto; el paquete @tanstack/react-start sigue su propia numeración semver (1.169.x en ese momento).

¿Qué es TanStack Intent?
Es un CLI que permite a las librerías distribuir Agent Skills (SKILL.md) dentro de sus paquetes npm y a los proyectos descubrirlas. Al actualizar una dependencia, actualizas también las instrucciones que lee tu agente para usarla.

¿Cómo instalo las skills de TanStack Start en mi proyecto?
Ejecuta npm i -D @tanstack/intent y después npx @tanstack/intent@latest install. El asistente te pide qué paquetes autorizas, guarda la lista en package.json y añade a AGENTS.md las instrucciones para que el agente liste y cargue las skills antes de editar.

¿Funciona TanStack Intent con Claude Code, Codex y OpenCode?
Sí. En Claude Code y Codex puede instalar hooks de proyecto que inyectan el catálogo de skills al empezar la sesión. En OpenCode, Cursor y cualquier agente que lea AGENTS.md funciona solo con instrucciones, sin hooks que lo fuercen.

¿Sigue existiendo el MCP de TanStack?
El servidor MCP del CLI (tanstack mcp) se ha retirado y no volverá. Cada herramienta tiene un comando equivalente con salida --json, como tanstack search-docs o tanstack libraries. El add-on mcp para aplicaciones sigue disponible.

¿Qué es el TanStack Application Starter?
Es una página de tanstack.com donde describes tu app, eliges integraciones y destino de despliegue, y obtienes un prompt listo para pegar en tu agente o abrir directamente en Claude, Codex o Cursor. Está en fase alpha.

¿Necesito TanStack AI para programar con agentes de IA?
No. TanStack AI es una librería para construir funciones de IA dentro de tu aplicación, como chats o agentes. Para que tu agente programe bien con Start necesitas Intent y el CLI.

¿Cómo se crea un proyecto de TanStack Start en 2026?
Con npx @tanstack/cli@latest create nombre-app. Puedes añadir integraciones con --add-ons, elegir destino con --deployment y gestor de paquetes con --package-manager. Por defecto configura TanStack Intent salvo que uses --blank o --no-intent.

¿Cómo se valida la entrada de una server function en TanStack Start?
Encadenando .validator() antes de .handler() en createServerFn. Acepta un esquema Zod o una función, y el handler recibe los datos ya validados y tipados en data.

¿Puedo migrar de Next.js a TanStack Start con un agente?
Sí. @tanstack/react-start incluye la skill lifecycle/migrate-from-nextjs y el Application Starter tiene un modo de migración que genera el prompt. La recomendación oficial es crear un proyecto nuevo y migrar ruta a ruta, usando el repo antiguo solo como referencia.

Fuentes ¶

• TanStack Start v1.0, anuncio oficial en el blog de TanStack
• Application Starter
• Documentación de TanStack Intent y su quick start para proyectos
• Registro de skills de Intent
• Migración del MCP del TanStack CLI y referencia del CLI
• Server functions en TanStack Start
• TanStack AI y su quick start
• llms.txt de TanStack
• Descargas semanales de npm (6–12 de octubre de 2026), API pública de npm

🧨 Última oprtunidad para recibir la dinamita que mereces sobre programación con IA el próximo domingo: Suscríbete gratis a Web Reactiva en https://webreactiva.com/newsletter