Question 1

What are layouts in Next.js and how do nested layouts work?

Accepted Answer

**Target Audience:** Beginners preparing for Next.js interviews — assumes basic React (components, props, state).
**Difficulty:** Easy

> **How to read this doc:** Each idea is explained in plain language first, then tagged with `📌 Interview term:`. Every behaviour claim was checked against the Next.js 16.4.2 docs shipped with the package and, in the **Verified** section, against a lab app built with `next build`, served with `next start` and driven by a real Chromium browser.

## 1. Why This E

Question 2

How do environment variables work in Next.js (the NEXT_PUBLIC_ prefix)?

Accepted Answer

**Target Audience:** Frontend engineers preparing for Next.js interviews — assumes basic React and App Router familiarity.
**Difficulty:** Easy

> **How to read this doc:** Each idea is explained in plain language first, then tagged with `📌 Interview term:`. Every behaviour claim was checked against the Next.js docs shipped with the package (written on 16.3.4, re-reviewed against 16.4.2) and, in the **Verified** section, against real output from a build or a running server; each Verified block

Question 3

How do metadata files like favicon.ico, icon, opengraph-image and manifest work in Next.js?

Accepted Answer

**Target Audience:** Beginners preparing for Next.js interviews — basic HTML (what the head element is) helps.
**Difficulty:** Easy

> **How to read this doc:** Each idea is explained in plain language first, then tagged with `📌 Interview term:`. Every behaviour claim was checked against the Next.js 16.4.2 docs shipped with the package and, in the **Verified** section, against a lab app built with `next build`, served with `next start` and inspected with `curl`.

## 1. Why This Even Matters — A

Question 4

How does client-side navigation work in Next.js (next/link and useRouter)?

Accepted Answer

**Target Audience:** Frontend engineers preparing for Next.js interviews — assumes basic React and App Router familiarity.
**Difficulty:** Easy

> **How to read this doc:** Each idea is explained in plain language first, then tagged with `📌 Interview term:`. Every behaviour claim was checked against the Next.js 16.4.2 docs shipped with the package and, in the **Verified** section, against real output from a build, a running server or a real browser.

## 1. Why This Even Matters — A Story First

Question 5

How does file-based routing work in the Next.js App Router?

Accepted Answer

**Target Audience:** Frontend engineers preparing for Next.js interviews — assumes basic React and App Router familiarity.
**Difficulty:** Easy

> **How to read this doc:** Each idea is explained in plain language first, then tagged with `📌 Interview term:`. Every behaviour claim was checked against the Next.js docs shipped with the package (written on 16.3.4, re-reviewed against 16.4.2) and, in the **Verified** section, against real output from a build or a running server; each Verified block

Question 6

What is Next.js and what problems does it solve?

Accepted Answer

**Target Audience:** Frontend engineers preparing for Next.js interviews — assumes basic React and App Router familiarity.
**Difficulty:** Easy

> **How to read this doc:** Each idea is explained in plain language first, then tagged with `📌 Interview term:`. Every behaviour claim was checked against the Next.js docs shipped with the package (written on 16.3.4, re-reviewed against 16.4.2) and, in the **Verified** section, against real output from a build or a running server; each Verified block

Question 7

What is not-found.js in Next.js and how do you trigger a 404?

Accepted Answer

**Target Audience:** Frontend engineers preparing for Next.js interviews — assumes basic React and App Router familiarity.
**Difficulty:** Easy

> **How to read this doc:** Each idea is explained in plain language first, then tagged with `📌 Interview term:`. Every behaviour claim was checked against the Next.js 16.4.2 docs shipped with the package and, in the **Verified** section, against real output from a build, a running server or a real browser.

## 1. Why This Even Matters — A Story First

Question 8

What is the next/form Form component and when would you use it?

Accepted Answer

**Target Audience:** Beginners preparing for Next.js interviews — assumes you know what an HTML form and a URL query string are.
**Difficulty:** Easy

> **How to read this doc:** Each idea is explained in plain language first, then tagged with `📌 Interview term:`. Every behaviour claim was checked against the Next.js 16.4.2 docs shipped with the package and, in the **Verified** section, against a lab app served by `next start` and submitted in a real Chromium browser with JavaScript on and off.

Question 9

What is the difference between the /public folder and imported assets in Next.js?

Accepted Answer

**Target Audience:** Frontend engineers preparing for Next.js interviews — assumes basic React and App Router familiarity.
**Difficulty:** Easy

> **How to read this doc:** Each idea is explained in plain language first, then tagged with `📌 Interview term:`. Every behaviour claim was checked against the Next.js docs shipped with the package (written on 16.3.4, re-reviewed against 16.4.2) and, in the **Verified** section, against real output from a build or a running server; each Verified block

Question 10

How do you run Turbopack locally — `next dev --turbo` vs default?

Accepted Answer

`next dev --turbo` (now default in Next 15) gives sub-100ms HMR via persistent `.next/cache/turbo` — use `--show-config` or `TURBOPACK=1` to debug.

NEXT.JSDECODED.

Easy

What are layouts in Next.js and how do nested layouts work?

How do environment variables work in Next.js (the NEXT_PUBLIC_ prefix)?

How do metadata files like favicon.ico, icon, opengraph-image and manifest work in Next.js?

How does client-side navigation work in Next.js (next/link and useRouter)?

How does file-based routing work in the Next.js App Router?

What is Next.js and what problems does it solve?

What is not-found.js in Next.js and how do you trigger a 404?

What is the next/form Form component and when would you use it?

Medium

What is the route segment config in Next.js (dynamic, revalidate, runtime)?

How do you handle forms with Server Actions in Next.js (progressive enhancement)?

What is the difference between Server Components and Client Components in Next.js?

What is Draft Mode in Next.js and how does it work with a headless CMS?

What is generateStaticParams in Next.js and how does it enable SSG for dynamic routes?

What is next/script and what are its strategy options in Next.js?

How do you implement search, filtering and pagination with URL search params in the App Router?

What is proxy.ts in Next.js 16 and how do you migrate from middleware.ts?

Hard

How do you migrate from the Pages Router to the App Router in Next.js?

How do Server and Client Components compose in Next.js?

What are React Server Components and why does Next.js use them?

What changed about caching defaults in Next.js 15?

How do you handle instrumentation and observability in Next.js (instrumentation.ts)?

How do you do optimistic updates in Next.js (useOptimistic, useActionState)?

What are Server Actions in Next.js and how do they work?

How do you build a multi-tenant Next.js app with subdomain routing?