Is a backend framework needed alongside TanStack Start?

No. TanStack Start's server functions and server routes handle the backend surface — data access, mutations, auth — inside the same project, without a separate Express or Fastify server.

Does the package manager choice matter?

Any of npm, pnpm, yarn or Bun work with TanStack Start's scaffolding tool. Pick whichever is already used on the rest of the team's projects; this playbook records the choice once and reuses it in every command shown later.

Can authentication be added later instead of during the build?

It is possible, but every server function written before auth exists gets rewritten to add the middleware check. Building the auth middleware before the data layer grows avoids a second pass over every server function.

What happens when the production build step is skipped and deploy goes straight from the dev server?

The dev server is not the production entry point. A server-only import that never caused a problem in dev can break the production bundle, and the platform-specific adapter is only exercised by the production build.

Are there hosting options besides Cloudflare, Netlify or a self-host?

TanStack Start's hosting guide documents other adapters too, but these three cover the common cases: global edge reach, the fastest path to a working deploy, and full control over a long-running process.

EN2 versions

Build a full-stack app with TanStack Start

A production-ready full-stack React application built with TanStack Start — scaffolded from scratch, with typed routes, server functions for data, an auth flow, and deployed to production — shipped in about 3 to 4 weeks of part-time work.

Fby Finito HQEchipa Finito

Created 3 months agoUpdated 3 weeks ago

Free preview: 5 of 28 steps

Work through them in the real run view, exactly as a buyer does. No account, no payment, nothing saved.

Try it free

Free

3 free unlocks per month — yours to keep forever

Refined across 2 versionsUpdated Sep 2026

Start for free

Try 5 of 28 steps free

No account needed — nothing is saved.

Included with every copy

Your own copy — keep it forever
Gets better over time — free updates included
Run it on web and mobile
Invite a partner to go through it with you — you share the same progress
Make it your own — a private copy you can edit to fit your situation
The playbook's community — ask questions, get additions, and see how other buyers improve it, right on the step

Save

Who it's for

React developers comfortable with components, hooks and TypeScript, who understand what SSR means but have not shipped a full-stack app with TanStack Start before.

About this playbook

This playbook takes a React developer from an empty directory to a deployed, production-ready full-stack app built with TanStack Start. It scaffolds the project, builds a typed route tree with layouts and a dynamic route, adds server functions with validation and streaming, wires up an auth middleware and a protected login flow, then builds for production and deploys to Cloudflare Workers, Netlify or a Node/Bun self-host. Each phase ends with a concrete check before the next one starts, so a mistake in the route tree or the auth boundary gets caught before it is built on top of.

Covers 1 situation

Which platform will you deploy this app to?

Cloudflare WorkersNetlifyNode/Bun self-host

The playbook asks you along the way and shows you only the steps that apply to you.

What you'll do, step by stepFree preview

6 phases · 28 steps

Only a sample is open: 5 of 28 steps can be read in full. The rest unlock when you buy.

Phase 1: Plan and scaffold the project
6 steps
Phase 2: Build the route tree and layout
5 steps
Phase 3: Add the data layer
6 steps
Phase 4: Add authentication and authorization
4 steps
Phase 5: Build for production and deploy
5 steps
Phase 6: Harden and hand over
2 steps

Try 5 of 28 steps free

Unlock all 28 stepsFree

Details

Estimated duration21 hours

Steps28

Estimated budget$0–20/month hosting

What you need first

A working Node.js installation, a code editor, a terminal, and a chosen data source (a real API, a database, or mock data) for the app being built.

Common questions

Glossary

SSR: Server-side rendering: the server renders the initial HTML for a route instead of shipping an empty shell for the client to fill in.
Server function: A TanStack Start function created with createServerFn that runs only on the server and is called from the client as an RPC request.
Loader: A route-level function that fetches the data a route needs before or while it renders, run on the server during SSR and on the client during navigation.
Middleware: Server-side logic that runs before a server function or route handler, used here to resolve the session and attach the authenticated user to context.
Route tree: The generated file (routeTree.gen.ts) that maps every file-based route to its component, produced automatically by the TanStack Router plugin.
Deferred data: Loader data marked to stream in after the initial render instead of blocking it, rendered with a Suspense boundary and an Await component.
beforeLoad: A route-level guard that runs before a route's loader, useful for redirecting in the UI but not a substitute for server-side authorization.