nextjs
Best practices for Next.js App Router apps: caching, tooling, and server and client boundaries, aligned with Next.js 16.1.1.
- Kind
- Rules
- Works with
- GitHub Copilot
- Languages
- TypeScript / JavaScript
- Source
- Awesome Copilot @ d85f762d6e52
- Path
- instructions/nextjs.instructions.md
- License
- MIT
- Jobs
- Implementation
InstallCopy it from the source repository, or sign in and let the assistant adapt it for your project.
# Next.js Best Practices for LLMs (2026) _Last updated: January 2026 (aligned to Next.js 16.1.1)_ This document summarizes the latest, authoritative best practices for building, structuring, and maintaining Next.js applications. It is intended for use by LLMs and developers to ensure code quality, maintainability, and scalability. --- ## 1. Project Structure & Organization - **Use the `app/` directory** (App Router) for all new projects. Prefer it over the legacy `pages/` directory. - **Top-level folders:** - `app/` — Routing, layouts, pages, and route handlers - `public/` — Static assets (images, fonts, etc.) - `lib/` — Shared utilities, API clients, and logic - `components/` — Reusable UI components - `contexts/` — React context providers - `styles/` — Global and modular stylesheets - `hooks/` — Custom React hooks - `types/` — TypeScript type definitions - **Colocation:** Place files (components, styles, tests) near where they are used, but avoid deeply nested structures. - **Route Groups:** Use parentheses (e.g., `(admin)`) to group routes without affecting the URL path. …