Next.js interviews centre on rendering strategies, the App Router, server components, and caching — the parts that separate Next from plain React. Below are the most common questions with model answers.
Every question comes with a model answer you can compare yours against.
1
What is the difference between SSR, SSG, ISR and CSR? When do you use each?
Answer
SSG builds HTML at deploy time — fastest and cheapest, right for content that rarely changes. SSR renders per request, needed when the page depends on the user or on data that must be current. ISR serves a static page and regenerates it in the background after a revalidation interval, giving static speed with fresh-enough data. CSR renders in the browser and suits dashboards behind a login where SEO does not matter.
2
What are React Server Components and how do they differ from client components?
Answer
Server components run only on the server, so they can query a database or read files directly and never ship their code to the browser. They cannot use state, effects, or browser APIs. Client components are the traditional React model and are needed for interactivity. The pattern is to keep pages as server components and push "use client" as far down the tree as possible so the bundle stays small.
3
Why is the "use client" directive needed?
Answer
In the App Router every component is a server component by default; "use client" marks the boundary where the client bundle begins. Everything imported below that boundary is shipped to the browser, which is why placing it at the top of a layout accidentally makes the whole subtree client-side. Without it, calling useState or attaching an onClick handler throws at build time.
4
How does caching work in the App Router? What is revalidate?
Answer
Next caches on several layers: the fetch result cache, the full route cache for rendered output, and the client router cache for navigations. revalidate sets how long a cached entry stays fresh, either per fetch or exported from the route segment. For event-driven updates you call revalidatePath or revalidateTag after a mutation, which is more precise than a time window.
5
What are Server Actions and when do you use them?
Answer
A Server Action is an async function marked "use server" that a client component can call directly, with Next handling serialisation and the network round trip. It replaces writing an API route for simple mutations such as form submissions, and it composes with revalidatePath to refresh data afterwards. Because it is a public endpoint under the hood, it must still validate input and check authorization.
6
How does next/image optimize images?
Answer
It generates responsive variants in modern formats such as WebP and AVIF, serves the size that matches the viewport, lazy-loads by default, and reserves layout space so the page does not shift. Requiring explicit width and height or the fill prop is what eliminates cumulative layout shift. The result is usually the single largest Core Web Vitals improvement in a Next app.
7
What are streaming and Suspense in Next.js?
Answer
Streaming sends HTML to the browser in chunks as it becomes ready instead of waiting for the slowest data source. Wrapping a slow component in Suspense with a fallback lets the rest of the page render immediately while that section arrives later. Practically this means a slow product-recommendations widget no longer delays the whole page, which improves perceived performance and time to first byte.
8
How do you implement dynamic metadata for SEO?
Answer
Export generateMetadata from a page or layout — it receives the route params, can await data, and returns title, description, canonical, and Open Graph fields. For static pages the simpler metadata export is enough. Add an opengraph-image file in the route folder and Next generates the social preview image for that route automatically.
🦎
Reading answers is not enough
In a real interview you speak under pressure. Cam asks these same questions, scores every answer, and shows exactly what to fix.
Practice a Next.js interview →Free · 3 interviews per month