How do you create a /dashboard route in Next.js App Router?

WHAT THIS TESTS: Your understanding of Next.js App Router file-system conventions and whether you know the exact file name that creates an addressable route. At senior levels, interviewers care that you do not conflate the App Router with the Pages Router and that you understand the boundary between layouts and pages. They also want to see if you know that folders define route segments while files inside them define UI for those segments, and that only specific reserved file names are recognized by the routing system.

A GOOD ANSWER COVERS: Four things in order. First, create a directory named dashboard inside the app folder, resulting in app/dashboard. Second, inside that folder create a file named page.js or page.tsx that exports a default React component. Third, clarify that the special file name page.js is what makes the route publicly accessible at /dashboard; a layout.js file in the same folder would only wrap children and would not itself create a route. Fourth, mention that this page is a Server Component by default, so you can fetch data directly at the top level if needed. You can optionally note that the folder structure maps directly to the URL path and that nested folders create nested routes.

COMMON WRONG ANSWERS: Creating a file named dashboard.js directly in the app directory, which is the Pages Router mental model and does not work in the App Router. Saying that layout.js renders the page, which confuses the wrapping behavior of layouts with the addressable entry point of pages. Forgetting that the component must be the default export. Placing the folder outside app or incorrectly assuming any file in the folder becomes a route. Another mistake is claiming you need to manually configure the route in a router configuration file or that the file can be named anything.

LIKELY FOLLOW-UPS: How would you create a dynamic route such as /dashboard/[id]. What is the difference between layout.js and template.js. How do Route Groups affect the URL structure. When would you use a loading.js or error.js file alongside the page. How does the src directory change the path to app. Whether you can co-locate non-route files like components or utilities inside the dashboard folder and how that affects routing.

ONE CONCRETE EXAMPLE: You create app/dashboard/page.tsx containing a default export function DashboardPage that returns a main element with an h1 reading Dashboard. Navigating to localhost:3000/dashboard renders that component. If you also add app/dashboard/layout.tsx, it wraps DashboardPage but does not change the URL. If you instead named the file app/dashboard.tsx, the route would not exist in the App Router because the framework requires the specific page.js convention.