Deviopath › Next.js

Special File Names

Easy · File Conventions

Inside app/, some file names have a special meaning. page shows a route, layout wraps pages with shared UI, loading is shown while a page loads, error catches errors, not-found is shown for missing pages, route is an API endpoint, template is like a layout that re-mounts on every navigation, and default is a fallback for parallel routes.

Write fileRole(fileName) that returns the role of a file: one of "page", "layout", "loading", "error", "not-found", "route", "template", "default", or "other" for any other file.

Special files can use the extensions .js, .jsx, .ts or .tsx. Any other extension (like .css) means "other".

Next: Folder Name Types