fraqtal/agentic-dev
Template
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

docs: trpc now optional — prerequisite notes + conditional HTML

Browse Source 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Danijel Martinek
2026-05-09 14:13:12 +02:00
parent c8116ac3f4
commit 1967cb36ec
10 changed files with 48 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
apps/web-next/AGENTS.md
View File

@@ -1,6 +1,6 @@
# AGENTS.md — apps/web-next
Next.js 15 reference application using App Router. Demonstrates consuming feature packages via tRPC, using `@repo/core-trpc/next` for client setup, and importing UI components from `@repo/core-ui`.
Next.js 15 reference application using App Router. Demonstrates consuming feature packages via tRPC and importing UI components from `@repo/core-ui`. Both `@repo/core-trpc` and `@repo/core-ui` are optional packages — scaffold them with `pnpm turbo gen core-package trpc` / `ui` if needed.
## Purpose
@@ -24,40 +24,44 @@ pnpm dev --filter @repo/web-next # Next.js on port 3000
| File | Purpose |
|---|---|
| `src/app/layout.tsx` | Root layout — wraps app with `<TrpcProvider>` from `@repo/core-trpc/next` |
| `src/app/providers.tsx` | Client component for tRPC + React Query setup |
| `src/app/layout.tsx` | Root layout — wraps app with `<Providers>` |
| `src/app/providers.tsx` | Client component wrapper (add tRPC/React Query here after scaffolding `@repo/core-trpc`) |
| `src/app/page.tsx` | Home page — navigation + marketing content |
| `src/app/blog/[slug]/page.tsx` | Dynamic blog post route |
| `src/app/api/trpc/[trpc]/route.ts` | tRPC fetch adapter endpoint |
| `e2e/` | Playwright end-to-end tests |
## tRPC Setup
## tRPC Setup (optional)
The tRPC endpoint handler (in `src/app/api/trpc/[trpc]/route.ts`):
`@repo/core-trpc` is not installed by default. After scaffolding with `pnpm turbo gen core-package trpc`:
1. Create `src/app/api/trpc/[trpc]/route.ts`:
```typescript
import { fetchRequestHandler } from "@trpc/server/adapters/fetch";
import { appRouter } from "@repo/core-api";
import { bindAll } from "../../../../server/bind-production";
const handler = (req: Request) =>
fetchRequestHandler({
const handler = async (req: Request) => {
await bindAll();
return fetchRequestHandler({
endpoint: "/api/trpc",
req,
router: appRouter,
createContext: () => ({}),
});
};
export { handler as GET, handler as POST };
```
The provider (in `src/app/providers.tsx`):
2. Update `src/app/providers.tsx`:
```typescript
"use client";
import { TrpcProvider } from "@repo/core-trpc/next";
import { NextTrpcProvider } from "@repo/core-trpc/next";
export function Providers({ children }: React.ReactNode) {
return <TrpcProvider>{children}</TrpcProvider>;
export function Providers({ children }: { children: React.ReactNode }) {
return <NextTrpcProvider trpcUrl="/api/trpc">{children}</NextTrpcProvider>;
}
```
@@ -66,8 +70,8 @@ export function Providers({ children }: React.ReactNode) {
| Dependency | Purpose |
|---|---|
| `@repo/core-api` | `appRouter` for tRPC endpoint |
| `@repo/core-trpc/next` | Next.js tRPC client + provider |
| `@repo/core-ui` | Design system components |
| `@repo/core-trpc/next` | Next.js tRPC client + provider (optional — scaffold first) |
| `@repo/core-ui` | Design system components (optional — scaffold first) |
| `@repo/auth`, `@repo/blog`, etc. | Feature packages (indirectly via core-api) |
| `next` | Next.js 15 framework |
| `@trpc/server` | tRPC server (fetch adapter) |
@@ -103,5 +107,5 @@ Run: `pnpm test:e2e` starts the dev server and runs all `.spec.ts` files.
- **Feature packages:** `packages/{auth,blog,media,marketing-pages,navigation}/`
- **tRPC composition:** `packages/core-api/AGENTS.md`
- **tRPC client + provider:** `packages/core-trpc/AGENTS.md`
- **UI components:** `packages/core-ui/AGENTS.md`
- **tRPC client + provider (optional):** scaffold `@repo/core-trpc` first, then see `turbo/generators/templates/core-package/trpc/AGENTS.md.hbs`
- **UI components (optional):** scaffold `@repo/core-ui` first, then see `packages/core-ui/AGENTS.md`