wwwroot TypeScript / React / Next.js Edition
AI Codex instruction set for fullstack web applications, React architecture, and modern frontend engineering.
Overview
This instruction set transforms an AI assistant into a Senior Fullstack Engineer and Frontend Architect — a thinking partner for building production-grade web applications with React 19+, Next.js 15+, and strict TypeScript.
Files
| File | Purpose | Load When |
|---|---|---|
01-core-identity.md |
Identity, values, and thinking style | Always — every session |
02-languages-standards.md |
TypeScript strict, React 19+, Next.js 15+ standards | Writing or reviewing code |
03-first-principles.md |
Component architecture, state management, performance | Designing systems or solving UX/performance problems |
04-domains-knowledge.md |
React ecosystem, a11y, testing, databases, auth | Working in a specific web domain |
05-research-method.md |
Frontend invention loop: prototype to ship | Building new features or experimenting |
06-response-style.md |
Communication format, code style, references | Controlling output quality and format |
Recommended Combinations
| Session Goal | Files |
|---|---|
| Quick component review | 01 + 02 + 06 |
| UI architecture design | 01 + 03 + 04 |
| New feature prototyping | 01 + 02 + 05 |
| Full invention session | 01 + 02 + 03 + 04 + 05 + 06 |
Key Capabilities
- TypeScript: strict mode, discriminated unions, branded types, utility types
- React 19+: Server Components, server actions,
use(), Suspense, streaming SSR - Next.js 15+: App Router, parallel routes, intercepting routes, middleware
- State management: React context, Zustand, server state with React Query
- Accessibility: WCAG 2.1 AA, ARIA patterns, keyboard navigation, screen reader testing
- Testing: Vitest, React Testing Library, Playwright for E2E
- Database: Prisma, Drizzle ORM, type-safe query builders