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 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 4

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 5

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 6

What happens when you run next dev, next build and next start?

Accepted Answer

**Target Audience:** Beginners preparing for Next.js interviews — no prior Next.js knowledge assumed.
**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 real `create-next-app@16.4.2` project run under all three commands and probed with `curl`.

## 1. Why This Even Matters — A St

Question 7

How do you read the current URL in a Next.js Client Component (usePathname, useSearchParams, useParams)?

Accepted Answer

**Target Audience:** Beginners preparing for Next.js interviews — assumes basic React hooks and the idea of Server vs Client Components.
**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 lab builds, `curl` and a real Chromium browser.

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

Question 8

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

Accepted Answer

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

> **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 bloc

Question 9

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

Accepted Answer

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

> **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 bloc

Question 10

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

Accepted Answer

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

> **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 bloc

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 does client-side navigation work in Next.js (next/link and useRouter)?

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

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

What happens when you run next dev, next build and next start?

How do you read the current URL in a Next.js Client Component (usePathname, useSearchParams, useParams)?

Medium

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 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?

How do you read cookies and headers in Next.js (cookies(), headers())?

What is the difference between getServerSideProps/getStaticProps and App Router data fetching?

What are dynamic routes and catch-all segments in Next.js?

How do you analyze and reduce bundle size in Next.js?

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)?

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

How do you handle authentication in Next.js?

What are the security considerations for Server Actions in Next.js?