NEXT.JS · MEDIUM CODEX

Next.js Interview Questions — Medium

Q: How does Incremental Static Regeneration (ISR) work under the hood? Explain "Stale-While-Revalidate".

Answer: ISR allows Next.js to update static pages after the initial build without re-deploying the entire site. Initial Request: The server serves the pre-rendered HTML/JSON generated at build time (i

Q: What is On-Demand Revalidation, and how is it superior to time-based ISR?

Answer: On-Demand Revalidation updates static pages instantly when data changes, rather than waiting for a time interval to expire. Action: Uses revalidatePath() or revalidateTag() inside server conte

Q: Explain Server Actions in Next.js and how they eliminate client-to-server API boilerplate.

Answer: Server Actions are asynchronous functions that run on the server but can be invoked directly from Client or Server Components. Mechanism: Next.js generates an implicit POST request endpoint un

Q: How does Middleware work in Next.js? Detail its execution order and limitations.

Answer: Middleware runs code before a request is completed, enabling request rewrite, headers manipulation, and redirection. Execution Timing: Executes after routing but before matches in the filesyst

Q: Explain Route Groups in the App Router and how they affect path layouts.

Answer: Route Groups are directories wrapped in parentheses, such as (marketing) or (shop). Path Exclusion: The folder name is omitted from the URL path (e.g., app/(shop)/product/page.js is accessed v

Real-world mechanisms, state management, edge cases, performance trade-offs, and practical coding.

50 Theory Questions7 Implementation Folios5 Free Model Answers

THEORY QUESTIONS & SOLUTIONSShowing 5 of 50 questions

Q1How does Incremental Static Regeneration (ISR) work under the hood? Explain "Stale-While-Revalidate".

Answer: ISR allows Next.js to update static pages after the initial build without re-deploying the entire site.

Initial Request: The server serves the pre-rendered HTML/JSON generated at build time (instantaneous CDN delivery).
Revalidation Window: If a request comes after the defined revalidate period (e.g., 60 seconds):
1. Next.js serves the stale static page to the current visitor.
2. Next.js triggers a revalidation process in the background on the server.
3. The server regenerates the page and updates the CDN cache with new static files.
4. Subsequent visitors receive the newly updated static page.

Q2What is On-Demand Revalidation, and how is it superior to time-based ISR?

Answer: On-Demand Revalidation updates static pages instantly when data changes, rather than waiting for a time interval to expire.

Action: Uses revalidatePath() or revalidateTag() inside server context to purge the cache.
Superiority:
- Efficiency: Eliminates unnecessary API queries during low-traffic periods.
- Freshness: Solves the stale-data issue by updating the CDN cache immediately when a database write occurs.

Q3Explain Server Actions in Next.js and how they eliminate client-to-server API boilerplate.

Answer: Server Actions are asynchronous functions that run on the server but can be invoked directly from Client or Server Components.

Mechanism: Next.js generates an implicit POST request endpoint under the hood when a Server Action is declared.
Benefits:
- No API Controllers: Eliminates writing custom Route Handlers or fetch() boilerplate to save form data.
- Progressive Enhancement: Forms can submit and work even before the client-side JavaScript has fully loaded.
- Security: Runs inside the server environment with access to backend services.

Q4How does Middleware work in Next.js? Detail its execution order and limitations.

Answer: Middleware runs code before a request is completed, enabling request rewrite, headers manipulation, and redirection.

Execution Timing: Executes after routing but before matches in the filesystem (pages or public folder) are processed.
Runtime: Runs on the Edge Runtime (lightweight V8 engine), not standard Node.js.
Limitations:
- Cannot use standard Node.js APIs (like fs, child_process).
- Limited external package compatibility (only packages using standard web APIs).
- Max execution memory and time limits apply (Vercel limits).

Q5Explain Route Groups in the App Router and how they affect path layouts.

Answer: Route Groups are directories wrapped in parentheses, such as (marketing) or (shop).

Path Exclusion: The folder name is omitted from the URL path (e.g., app/(shop)/product/page.js is accessed via /product).
Layout Isolation: Allows creating distinct layouts for specific groups of pages without creating subdirectories in the URL.
Multiple Root Layouts: Can be used to create multiple root layouts with different <html> tags by placing pages inside separate route group folders.

Unlock the remaining 52 Next.js (Medium) questions

You've completed the 5 free sample questions. Get unrestricted lifetime access to every question, model answer, implementation challenge, and all 27+ technologies for a single payment.

Unlock Everything — Already Enrolled? Sign In

₹399 India / $9 International · One-time settlement · Zero subscription

CROSS-DIFFICULTY NAVIGATION

Continue Preparing Next.js

EASY LEVEL

Foundations & Core Concepts

HARD LEVEL

Internals & System Architecture