nextjs-file-conventions

Next.js App Router file conventions dictate special files like layout.tsx, page.tsx, loading.tsx, error.tsx, and route.ts. This reference details their purpose, required exports, props, and TypeScript signatures for structuring your application's routing and UI segments.

To create API routes in Next.js, use the route.ts file convention. This Skill explains the required and optional exports, segment configuration options, and request handling props needed to define and manage server-side endpoints within the App Router.

Use template.tsx instead of layout.tsx in Next.js when you need a component to re-render and reset state upon navigation. This reference explains the distinct sub-segment behavior and props for both file conventions to help you choose the correct UI wrapper.

In Next.js, proxy.ts and instrumentation.ts are special file conventions for specific routing and observability tasks. This Skill outlines their exact exports, configuration options, and use cases to help you manage requests and monitor your application.

Next.js handles loading and error states using the loading.tsx and error.tsx file conventions. This reference provides their TypeScript signatures, props, and sub-segment behavior to help you implement resilient UI fallbacks for route segments.

Yes, you can configure metadata files for SEO in the Next.js App Router. This Skill details the specific metadata file conventions, their required exports, and how they interact with layout.tsx and page.tsx to manage your application's metadata.