Interactive development
Run an application locally while editing routes and components.
Next.js 16+ · Command
next dev
next dev starts a Next.js application in development mode with Hot Module Reloading and error reporting. It supports options for server configuration, debugging, and experimental development builds.
How it works
The command launches a Next.js application in development mode. It enables Hot Module Reloading and development-time error reporting; options can adjust the server, debugging, and build behavior.
Syntax
pnpm next dev [options]Parameters
| Name | Type | Description |
|---|---|---|
command | string | The Next.js CLI subcommand, such as dev. |
options | string | Optional flags controlling development-server behavior and builds. |
Returns
Starts the Next.js development server and continues running until stopped.
Key points
- Use
next devto run the App Router application with live module updates and development diagnostics. - The command has a dedicated option set for configuring development behavior.
- The experimental App Router-only option limits development builds to App Router routes.
- An experimental build mode can be selected with
compile,generate, or the default mode. - Use the prerender debugging option to investigate prerender failures during development.
- Build-path patterns let you narrow development work to selected routes while diagnosing issues.
Common mistakes
- Development artifacts use
.next/dev, so development and production builds can run concurrently without sharing the same output directory. - Invoking the CLI without a subcommand also starts development mode; use an explicit command when clarity matters.
Example: Start on another port
npm run dev -- --port 3001Runs the package script and forwards the port option to the Next.js development server.
When to use it
Node.js debugging
Inspect server-side code during local debugging.
Focused troubleshooting
Limit work to selected routes or diagnose prerender failures.
Interview questions
QWhat does next dev do?
next dev starts the application in development mode with Hot Module Reloading and error reporting. It is intended for local development rather than serving an optimized production build.
Follow-up: How can development and production builds coexist? Next.js writes development output to .next/dev, while production output uses the normal build directory.
QHow do you customize or debug the development server?
The command accepts development-specific options, including port selection and debugging flags. A package script can forward them, for example, npm run dev -- --port 3001.
Follow-up: How would you debug server-side code? Pass --inspect to the development command; --inspect-brk and --inspect-wait instead require NODE_OPTIONS.
QWhat is the Next.js CLI syntax and default command?
The CLI syntax is pnpm next [command] [options], and next dev is the development command. Running next without a command is equivalent to running next dev.
Follow-up: What happens when next dev and next build run together? Separate output directories and a lockfile mechanism prevent conflicts between concurrent instances.
Related
next buildnext startHot Module ReloadingNext.js CLIApp Router