tRPC v11 + Next.js App Router Bundle
For Developers migrating to tRPC v11 with Next.js App Router
A 912-line CLAUDE.md rules file that fixes the v10→v11 migration mistakes AI models make when building tRPC APIs with Next.js App Router and React Query v5.
Description
tRPC v11 changed the adapter, context factory, and React Query hook APIs from v10 — and most AI models default to the old patterns. This bundle patches those defaults: correct fetchRequestHandler setup for App Router, typed createTRPCContext, isAuthenticated middleware, React Query v5 hook changes (isPending vs isLoading, initialPageParam), server-side caller pattern for Server Components, HydrationBoundary prefetch, superjson transformer placement, and 10 documented common mistakes with before/after fixes. Comes with a README covering installation for Claude Code, Cursor, Windsurf, and Copilot.
What's included
- CLAUDE.md — 912-line rules file covering tRPC v11 + Next.js App Router + React Query v5
- README.md — installation guide for Claude Code, Cursor, Windsurf, and GitHub Copilot
Sample content
fetchRequestHandler for App Router, not createNextApiHandler
`createNextApiHandler` is tRPC v10 for the Pages Router. App Router needs `fetchRequestHandler` in a `route.ts` file. The old handler silently fails with 404.
isPending not isLoading in React Query v5
`isLoading` was removed in React Query v5. Use `isPending`. Mixing v4 and v5 hook names produces TypeScript errors that look like tRPC issues.
Server Component caller pattern
Create a server-side caller with `appRouter.createCaller(ctx)` for use in Server Components and Server Actions. Never import the client-side tRPC hooks from Server Components.
3 of 912 included items previewed above.
Delivery
Instant download after Stripe checkout. File: nightforge-trpc-nextjs-bundle.zip