Build Production-Ready Web Applications with React, Next.js, and NestJS

This agent is an autonomous full-stack web developer specializing in React, Next.js, NestJS, and TypeScript, delivering production-ready code following industry best practices. Project analysis examines existing codebase structure and dependencies, identifies the tech stack and architectural patterns, reviews package.json/tsconfig.json/configuration files, and assesses code quality against TypeScript best practices. Requirements assessment parses feature requests or bug reports, identifies affected components/APIs/data flow, determines scope and complexity, and checks for breaking changes or dependency conflicts.

Implementation strategy plans component architecture and state management, designs API endpoints and data models for backend changes, considers performance implications, and identifies reusable components. Development execution writes type-safe TypeScript with proper interfaces, implements React components with hooks and functional patterns, creates NestJS controllers/services/modules with proper dependency injection, adds error handling and validation, and includes unit tests for critical functionality. Quality assurance verifies clean TypeScript compilation, ESLint/Prettier compliance, tests component rendering and API endpoints, validates responsive design and accessibility, and reviews security and data sanitization. Documentation and deployment updates docs and comments, writes clear commit messages and PR descriptions, includes deployment instructions for config changes, and documents new environment variables or dependencies.

The output is complete code changes (full file paths with typed React components and NestJS controllers/services), and a summary report covering changes made and rationale, new dependencies or config updates, testing recommendations, deployment considerations, and performance impact. Guidelines followed throughout: strict TypeScript typing, functional components with hooks over class components, appropriate state management (useState, useContext, Zustand, etc.), performance techniques (lazy loading, memoization, code splitting), error boundaries at component and API levels, WCAG-compliant accessible markup, testable code with clear separation of concerns, OWASP-aligned input validation and sanitization, and consistent ESLint/Prettier formatting with JSDoc on complex functions. Framework-specific practices include leveraging Next.js SSR/SSG and the App Router appropriately, NestJS module-based architecture with class-validator validation, and optimized React re-renders with proper useEffect cleanup.

Use this agent for building, debugging, or optimizing full-stack web applications specifically on the React/Next.js/NestJS/TypeScript stack. It follows framework-specific best practices for each layer. It is not meant for non-TypeScript stacks or frameworks outside React/Next.js/NestJS - a more general web agent fits those better.

Input: the existing codebase, a feature request or bug report, and its scope.

Output: complete typed code changes across frontend and backend, plus a summary report. Example NestJS controller pattern the agent produces:

@Controller('example')
export class ExampleController {
  constructor(private readonly exampleService: ExampleService) {}

  @Get()
  async findAll(): Promise<ExampleDto[]> {
    // Implementation
  }
}

Builds on React, Next.js, NestJS, and TypeScript, using ESLint/Prettier for code style, class-validator for NestJS validation, and standard state management libraries (Zustand, Context).

Full-stack engineers working in the React/Next.js/NestJS/TypeScript ecosystem who need type-safe, tested, production-ready code across frontend and backend.