One prompt to production. Open your AI editor, paste one sentence, and get a fully configured full-stack TypeScript app — deployment, database, auth, everything.

Copy this into any AI-powered editor (Cursor, Windsurf, Claude Code, Copilot, OpenCode, etc.):

Clone https://github.com/Yidadaa/Super-FullStack, run pnpm install, then read docs/init.md and walk me through the project setup.

That's it. The agent clones the repo, installs dependencies, and walks you through configuring deployment, database, and auth — all in one conversation.

This is an agent-first starter. No manual configuration, no boilerplate copy-paste. The AI agent does the work — you make decisions.

1. The skeleton is ready — routing, API layer, UI primitives, type safety, and code quality are pre-wired
2. The agent reads docs/init.md — a structured playbook that guides it through 4 setup steps:

3. You talk, the agent codes — pick Postgres or SQLite, Cloudflare or Vercel, email/password or OAuth — the agent fetches live docs, asks your preference, and configures everything

The result: git clone → fully configured, deployable full-stack app — in one conversation.

src/
├── client/
│   ├── trpc/             # tRPC client, QueryClient, provider
│   └── views/            # Page-level view components
├── components/
│   └── ui/               # 50+ shadcn/ui components, ready to use
├── hooks/                # Custom React hooks
├── lib/                  # Shared utilities
├── routes/               # TanStack file-based routes
│   ├── __root.tsx        # Root layout (HTML shell, providers)
│   ├── index.tsx         # Home route
│   └── api/trpc.$.ts    # tRPC HTTP handler
├── server/
│   ├── loader.ts         # Server-side data loading helpers
│   └── trpc/
│       ├── init.ts       # tRPC instance
│       ├── context.ts    # Request context factory
│       ├── procedure.ts  # Public & protected procedures
│       ├── middlewares.ts # Logging + auth middleware stubs
│       ├── router.ts     # Root app router
│       ├── caller.ts     # Server-side caller (for SSR loaders)
│       ├── link.ts       # Local link (zero-overhead SSR calls)
│       └── routes/       # tRPC route modules
├── styles/global.css     # Tailwind config + light/dark theme tokens
├── env.ts                # Type-safe environment variables
└── router.tsx            # TanStack router factory
docs/
└── init.md               # AI bootstrap playbook

The tRPC client uses a split-link strategy — zero-overhead on the server, batched HTTP on the client:

• SSR: Direct router invocation via unstable_localLink (no network round-trip)
• Browser: httpBatchLink to /api/trpc

Both paths share the same router and context. Behavior is identical regardless of environment.

// 1. src/server/trpc/routes/user.ts
import { publicProcedure } from "../procedure"

export const userRouter = {
  me: publicProcedure.query(({ ctx }) => {
    return { id: "1", name: "Alice" }
  }),
}

// 2. Register in src/server/trpc/router.ts
export const appRouter = createTRPCRouter({
  example: exampleRouter,
  user: userRouter,
})

// 3. Call from any client component
const userQuery = useQuery(trpc.user.me.queryOptions())

import { serverLoader } from "@/server/loader"

export const Route = createFileRoute("/dashboard")({
  loader: () => serverLoader((caller) => caller.user.me()),
})

Runtime-validated via @t3-oss/env-core + Zod. Server vars are server-only; client vars require the VITE_ prefix.

import { env } from "@/env"

env.SERVER_EXAMPLE   // server-only
env.VITE_EXAMPLE     // available everywhere

MIT