← ClaudeAtlas

frontend-bfflisted

Use when building a Next.js frontend or its backend-for-frontend. The browser talks only to its own origin: runtime configuration so one image serves every environment, HttpOnly cookie sessions instead of a token API, edge middleware that verifies rather than merely decodes, the catch-all proxy with a candidate ladder, entitlement UX, and the shared web kernel whose absence is the costliest finding in the worked example.
konradcinkusz/architecture-standards · ★ 0 · Web & Frontend · score 72
Install: claude install-skill konradcinkusz/architecture-standards
# Frontend and BFF patterns **Read [`references/FRONTEND-BFF.md`](references/FRONTEND-BFF.md) before applying any of this.** That file is the standard; everything below it is a summary to help you decide whether this skill applies and to check your work afterwards. Reference-architecture principles: P2, P6. ## What this standard covers - The model in one paragraph - Runtime configuration - Sessions: HttpOnly cookies over a token API - Edge middleware verifies, not just decodes - The catch-all proxy and the candidate ladder - Entitlement UX - The shared web kernel ## Failure modes | Symptom | Cause | |---|---| | Staging frontend calls production APIs | Addresses baked via `NEXT_PUBLIC_*` at build; move to the runtime config route | | Token visible in devtools/localStorage | Client stored the token instead of handing it to the BFF cookie route | | Login loop after logout | Cookie deleted with different attributes than it was set with | | Forged token accepted at the edge | Middleware decoded instead of verified; use `jwtVerify` with issuer/audience | | OAuth callback loses its parameters | Middleware redirect lacks the callback carve-out | | Proxy 403s only in one environment | Candidate ladder missing that environment's rung (discovery vars vs internal DNS) | | Downloads fail after idle periods | Proxy timeout shorter than the callee's cold start; or response buffered instead of streamed | | Paying user sees an upgrade flash | Entitlement hook pessimistic while loading;