next-project-structure
Next.js Project Structure
Purpose
This skill defines the folder and file conventions for Next.js App Router applications. Use this to ensure file placement dictates the correct routing behavior and architectural consistency.
Usage
When creating new features or refactoring, you must first identify the project's Organization Strategy (see below) to determine where files belong.
1. Top-Level Organization Strategies
Identify which strategy the project is using and strictly adhere to it. Do not mix strategies.
| Strategy | Description | Indicator |
|---|---|---|
Store in src |
Application code lives in src/app. Config files live in root. |
src/app/page.tsx exists |
Root app |
Application code lives in app. Config files live in root. |
app/page.tsx exists |
| Split by Feature | Global code in app; feature code colocated in route segments. |
app/dashboard/_components/ exists |
| External Projects | Project files live in components/ or lib/ at root, outside app. |
components/ exists at root |
More from henryxv/study-platform
nextjs-frontend-testing
Use this skill whenever the user wants to set up, improve, or run frontend tests (unit, component, and E2E) for a Next.js (App Router) + TypeScript + Tailwind + shadcn/ui project using Vitest/Jest, React Testing Library, and Playwright.
19landing-page-guide-v2
Create distinctive, high-converting landing pages that combine proven conversion elements with exceptional design quality. Build beautiful, memorable landing pages using Next.js 14+ and ShadCN UI that avoid generic AI aesthetics while following the 11 essential elements framework.
9cartographer
Maps and documents the codebase. Generates `docs/CODEBASE_MAP.md` with architecture diagrams, module relationships, and data flow. Use when the user asks to "map the code", "explain the architecture", or "update documentation".
7prisma-workflow
Strictly enforces Prisma 7 + Next.js App Router protocols. Manages the lifecycle from initialization to deployment. Use for all database tasks.
7doc-coauthoring
Guide users through a structured workflow for co-authoring documentation. Use when user wants to write documentation, proposals, technical specs, decision docs, or similar structured content. This workflow helps users efficiently transfer context, refine content through iteration, and verify the doc works for readers. Trigger when user mentions writing docs, creating proposals, drafting specs, or similar documentation tasks.
6backend-dev-guidelines
Comprehensive backend development guide for Langfuse's Next.js 14/tRPC/Express/TypeScript monorepo. Use when creating tRPC routers, public API endpoints, BullMQ queue processors, services, or working with tRPC procedures, Next.js API routes, Prisma database access, ClickHouse analytics queries, Redis queues, OpenTelemetry instrumentation, Zod v4 validation, env.mjs configuration, tenant isolation patterns, or async patterns. Covers layered architecture (tRPC procedures → services, queue processors → services), dual database system (PostgreSQL + ClickHouse), projectId filtering for multi-tenant isolation, traceException error handling, observability patterns, and testing strategies (Jest for web, vitest for worker).
6