TanStack Start sta diventando uno degli stack più interessanti per il vibe coding moderno. Non per il solito discorso "l'AI scrive tutto", ma per una ragione molto più pratica: è type-safe, modulare, componibile e pensato per costruire applicazioni moderne con pattern chiari e coerenti.

TanStack Start prende le basi di TanStack Router e aggiunge la parte full-stack: SSR, streaming, server functions, server routes, loader, prefetching, typed route tree, gestione dello stato via URL e build per diversi runtime. Un ecosistema progettato con la leggibilità del codice in mente — qualità preziosa quando ci lavorano agenti AI come Codex, Claude Code, Cursor, Copilot o Windsurf.

Il problema: i modelli non conoscono TanStack Start abbastanza bene

Non basta dire all'agente: "Usa TanStack Start".

Molti modelli hanno dati di addestramento non allineati alle versioni più recenti di TanStack Start, TanStack Router, TanStack AI e alle nuove convenzioni. Il risultato è codice che sembra giusto, ma in realtà attinge a pattern di framework che il modello conosce meglio:

• Stile Next.js (getServerSideProps, App Router, "use server")
• Vecchie API TanStack
• Uso scorretto di server/client logic
• Routing non idiomatico
• Server functions confuse con API routes tradizionali
• Codice che funziona all'inizio ma diventa fragile con la crescita del progetto

La soluzione: preparare bene il contesto

Qui entra in gioco una parte fondamentale del vibe coding serio: non solo promptare, ma preparare il contesto. Per usare TanStack con agenti AI conviene creare istruzioni apposite nel progetto, ad esempio in:

• AGENTS.md
• CLAUDE.md
• .cursorrules
• File di istruzioni per Codex/Copilot/Cursor
• Skill dedicate, quando disponibili

Esempio di AGENTS.md per un progetto TanStack Start

```

TanStack Start Agent Instructions

Questo progetto usa TanStack Start, TanStack Router e TypeScript.

Quando lavori sul codice:

• Segui la documentazione ufficiale aggiornata di TanStack Start.
• Non usare pattern Next.js come getServerSideProps, App Router o "use server".
• Non inventare API TanStack se non sei sicuro.
• Usa TanStack Router per route tree, routing, params, search params, loader e prefetching.
• Usa createServerFn per la logica server-side quando appropriato.
• Mantieni chiara la separazione tra codice client e codice server.
• Usa TypeScript in modo rigoroso.
• Preferisci search params validati e URL state quando ha senso.
• Per data fetching e server state lato client usa TanStack Query dove appropriato.
• Prima di modificare routing, loader, server functions o architettura, leggi i file esistenti e rispetta i pattern già presenti nel progetto.
• Se una feature richiede logica backend, valuta prima se può essere gestita con server functions invece di creare una API separata.
• Non migrare il progetto verso pattern di altri framework senza esplicita richiesta.
  ```

Ancora meglio: le skill specifiche

TanStack sta andando esattamente in questa direzione con Intent e Agent Skills: invece di affidarsi alla memoria del modello, le librerie possono portarsi dietro istruzioni aggiornate, versionate e leggibili dagli agenti. Questa è una delle evoluzioni più importanti del vibe coding:

Il modello non deve "ricordarsi" tutto. Deve leggere il contesto giusto, aggiornato, nel progetto giusto.

Il workflow ideale con TanStack

1. Creare il progetto con TanStack Start
2. Bloccare le versioni (package.json + lockfile)
3. Aggiungere AGENTS.md / CLAUDE.md / .cursorrules o equivalenti
4. Collegare la documentazione ufficiale
5. Usare skill dedicate quando disponibili
6. Chiedere all'agente di seguire quei pattern, non di improvvisare
7. Fare sempre review umana, test e controllo delle parti server/client

La differenza tra un prompt debole e uno efficace

Prompt debole:

"Creami un'app con TanStack Start"

Prompt migliore:

"Lavora su questo progetto TanStack Start seguendo le istruzioni in AGENTS.md. Usa TanStack Router per il routing, createServerFn per la logica server-side, non usare pattern Next.js e consulta la documentazione aggiornata prima di modificare routing o server functions."

La differenza non sta nella lunghezza del prompt, ma nella qualità del contesto che circonda l'agente.

Link utili

• TanStack
• TanStack Start (docs)
• TanStack Intent / Agent Skills
• Lovable: Building apps using TanStack Start
• Video: TanStack Start deep dive

TanStack è molto promettente per il vibe coding, ma va usato con disciplina. Non è solo questione di scegliere lo stack più nuovo: è questione di rendere il progetto leggibile anche per l'agente. Meno magia, più contesto, più documentazione aggiornata, meno codice inventato.

Voi state già usando TanStack nei vostri progetti vibe coding? Avete trovato altri modi per guidare bene gli agenti su questo stack?

📌 Questo articolo riassume una discussione su r/vibecodingitalia. Leggi il post originale.