Organize a web app with TanStack Start

Use when designing or refactoring the structure of a TanStack Start web application.

Mental model

• TanStack Start gives you a full-stack route-based architecture. Organize around routes, features, and ownership boundaries, not around arbitrary folders copied from other frameworks.
• Keep route files focused on routing concerns, loaders, server functions, and composition of feature modules.
• Separate server-only behavior, shared domain logic, and client UI so the app remains understandable as it grows.

Route organization

• Use the file-based route tree intentionally; route structure should reflect the user-facing URL and layout hierarchy.
• Keep route files thin once they start owning substantial loaders, mutations, and UI composition.
• Use route layouts for shared chrome and section-level behavior instead of repeating wrappers across many leaves.
• Prefer grouping related routes by feature or product area rather than one flat pile of unrelated route files.

Feature modules