How to change default port for a Next.js app?
Interviewer Expectations for this Question
01
Core Competency
Assesses fundamental understanding of Next.js conventions, runtime behavior, and memory/performance considerations.
02
Evaluation Criteria
Hiring managers look for precision, avoidance of ambiguous jargon, and ability to explain trade-offs under real production conditions.
Comprehensive Model Answer
Verified Solution
You can change the port used by Next.js using several straightforward approaches:
### 1. In package.json Scripts (Recommended):
Pass the -p (or --port) flag in your scripts:
{
"scripts": {
"dev": "next dev -p 8080",
"start": "next start -p 8080"
}
}
### 2. Via Command Line Arguments:
npm run dev -- -p 5000
# or with npx directly
npx next dev -p 5000
### 3. Using the PORT Environment Variable:
Next.js respects the system PORT environment variable commonly used by cloud hosts (AWS, Heroku, DigitalOcean, Docker):
PORT=4000 npm run dev
Or define PORT=4000 inside your .env.local file.
Candidate Response Strategy & Interview Tips
- Start with a concise one-sentence summary: Deliver a direct, confident answer first before expanding into nuances.
- Demonstrate real-world trade-offs: Discuss where this approach excels and when you would avoid it in production systems.
- Discuss complexity & edge cases: Proactively explain time/space complexity or boundary conditions (null values, scale limits).
- Prepare for interviewer follow-ups: Technical hiring panels frequently probe deeper into concurrency, backward compatibility, or alternative libraries.