>_promptly.site

Back to prompts

Claude 3.5 Sonnet⚡5-Step Workflow100% Free• 1,240 copies

Full-Stack Next.js 16 & Prisma Auth Engine

A 5-step development playbook taking you from system architecture and Prisma schema to secure JWT handlers, reactive server components, and automated tests.

Contributed by@alexrivera

Multi-Step Workflow Sequence5 Connected Steps

Execute each prompt in order. Carry forward context as specified in step instructions.

01

System Architecture & API ContractsArchitecture

Phase: DesignFormat: Mermaid + TS DTOs

You are a Principal Software Architect. Design the architectural blueprint and API contract for an authentication engine in [appName]. Provide: 1) System boundary diagram and sequence flow in Mermaid, 2) Route handler endpoints specifications for /api/auth/register, /api/auth/login, /api/auth/me, /api/auth/logout, 3) Strict TypeScript request/response DTO interfaces.

Context Handoff & Instructions

Run this prompt first to get clear interface definitions. Save the generated TypeScript DTOs before running Step 2.

02

PostgreSQL Data Modeling with Prisma ORMDatabase

ORM: Prisma v6File: prisma/schema.prisma

Based on the authentication contracts for [appName], produce a production-grade Prisma schema. Include: 1) User model with UUID primary keys, unique email, hashed password, role enum, and timestamps, 2) Session/Token model if applicable, 3) Complete schema.prisma with postgresql datasource and client generator, 4) Idempotent database seed script.

Context Handoff & Instructions

Pass the TypeScript interfaces from Step 1 into this prompt to ensure database fields map 1:1 with API contracts.

03

Session Cryptography & JWT Route HandlersBackend & Security

Library: jose + bcryptjsRuntime: Node.js & Edge

Using the Prisma schema from Step 2, generate the Next.js 16 route handlers for [appName]. Use bcryptjs for password hashing (10 salt rounds) and jose for edge-compatible JWT generation. Implement secure HTTP-only cookies, Bearer token verification middleware, and structured error responses.

Context Handoff & Instructions

Supply the Prisma schema from Step 2. Instruct the model to strictly handle token expiration, edge runtime constraints, and sanitized JSON errors.

04

Reactive Auth Forms & Header Session StateFrontend UI

State: Custom Event SyncStyling: Tailwind CSS v4

Build the React 19 / Next.js 16 client components for [appName]: 1) LoginForm with validation, loading states, and error alerts, 2) RegisterForm with password strength meter, 3) Global SessionProvider and useUser hook using custom browser events for reactive multi-tab sync, 4) Minimalist dark-mode styling with Tailwind CSS.

Context Handoff & Instructions

Reference the API responses from Step 3 so client payload parsing aligns perfectly with backend exceptions.

05

Automated Integration & Unit Test SuiteTesting & QA

Framework: Jest + Node Test Runner

Generate an end-to-end integration and unit test suite for [appName] auth system. Include: 1) Jest unit tests for password hashing and token generation, 2) Supertest / Route integration tests for registration and invalid password login, 3) Mocking fixtures for Prisma Client.

Context Handoff & Instructions

Feed the route handler code from Step 3 into this prompt to test edge cases: duplicate emails, malformed JWTs, and session expiration.

Workflow Execution Guide & Instructions

How to run this prompt chain sequentially for optimal consistency and accuracy.

Workflow Overview

End-to-end multi-turn engineering playbook for implementing production-ready authentication in Next.js 16 with Prisma ORM and TypeScript.

Chaining Methodology

Sequential Chain-of-Thought Handoff: The output of each step serves as architectural constraints for the subsequent step, ensuring zero drift.

Prerequisites & Requirements

•Node.js 20+ and Next.js 16 project
•PostgreSQL database connection
•jose and bcryptjs dependencies installed

Step-by-Step Execution Plan

1

System Architecture

Generate the API contracts and DTO types.

2

Prisma Modeling

Create schema.prisma matching the DTO definitions.

3

Route Handlers

Implement JWT signing and cookie session handling.

4

Client UI

Connect frontend forms to the authentication API.

5

Testing Suite

Run automated tests against mock database fixtures.

Best Practices & Gotchas

✓Do not prompt all steps in a single context window if token limits are constrained.

✓Use deterministic temperature (0.2) across all coding steps to avoid subtle syntax regressions.

Workflow Variable Synchronizer

Parameters entered here synchronize across all 5 steps simultaneously to maintain consistency across the entire workflow.

[appName]

Customized Steps Preview

Step 1: System Architecture & API Contracts

You are a Principal Software Architect. Design the architectural blueprint and API contract for an authentication engine in [appName]. Provide: 1) System boundary diagram and sequence flow in Mermaid, 2) Route handler endpoints specifications for /api/auth/register, /api/auth/login, /api/auth/me, /api/auth/logout, 3) Strict TypeScript request/response DTO interfaces.

Step 2: PostgreSQL Data Modeling with Prisma ORM

Based on the authentication contracts for [appName], produce a production-grade Prisma schema. Include: 1) User model with UUID primary keys, unique email, hashed password, role enum, and timestamps, 2) Session/Token model if applicable, 3) Complete schema.prisma with postgresql datasource and client generator, 4) Idempotent database seed script.

Step 3: Session Cryptography & JWT Route Handlers

Using the Prisma schema from Step 2, generate the Next.js 16 route handlers for [appName]. Use bcryptjs for password hashing (10 salt rounds) and jose for edge-compatible JWT generation. Implement secure HTTP-only cookies, Bearer token verification middleware, and structured error responses.

Step 4: Reactive Auth Forms & Header Session State

Build the React 19 / Next.js 16 client components for [appName]: 1) LoginForm with validation, loading states, and error alerts, 2) RegisterForm with password strength meter, 3) Global SessionProvider and useUser hook using custom browser events for reactive multi-tab sync, 4) Minimalist dark-mode styling with Tailwind CSS.

Step 5: Automated Integration & Unit Test Suite

Generate an end-to-end integration and unit test suite for [appName] auth system. Include: 1) Jest unit tests for password hashing and token generation, 2) Supertest / Route integration tests for registration and invalid password login, 3) Mocking fixtures for Prisma Client.

Related Prompts

Claude 3.5 Sonnet

Next.js 16 & React 19 Full-Stack Feature Architect

You are a principal engineer specializing in Next.js 16 and React 19. For [Feature_Description], produce: 1) Async Server Component with Turbopack optimizations, 2) Server Action with strict zod payload validation, 3) Client Component utilizing useActionState and useOptimistic, and 4) Tailwind CSS v4 markup.

Claude 3.5 Sonnet

Full-Stack Python & FastAPI Clean Architecture

You are an expert Python architect following Domain-Driven Design (DDD) and Clean Architecture principles. When writing FastAPI endpoints for [Feature_Domain], generate: 1) Pydantic v2 schemas with strict validation, 2) Service layer interfaces, 3) SQLAlchemy 2.0 async models, and 4) Pytest unit test fixtures.

Claude 3.5 Sonnet

Dark-Mode Minimalist Dashboard Component Spec

You are a Lead UI/UX Designer and Frontend Specialist. Create a design specification and component breakdown for [Dashboard_Module]. Follow a strict minimalist dark design system: background #09090b, card #121215, border #27272a, high-contrast typography, and 1-click interaction microcopy.