What are route segments in Next JS?

In Next.js, route segments are parts of the URL that correspond to folders in app/ and form the page's path.

In short:

Each folder = one URL segment

---

#Basic concept

URL:

Segments:

Their source:

---

#Types of route segments

#1. Static segments

Regular folders:

• always the same URL
• the simplest type

---

#2. Dynamic segments

Folders in square brackets:

• [slug] - a route parameter
• values come from the URL

---

#3. Catch-all segments

Catch several segments:

URL:

• /docs/a
• /docs/a/b/c

---

#4. Optional catch-all segments

Segments may be absent:

URL:

• /docs
• /docs/react
• /docs/react/hooks

---

#5. Route Groups (not URL segments)

Folders in parentheses:

• do not form a URL segment
• used only for project structure

---

#6. Parallel segments

Named slots for UI:

• @stats - a UI segment, not a URL one
• used for complex layouts

---

#How segments are used inside Next.js

#Passing parameters

---

#Managing layouts

• every segment can have its own layout.tsx
• a layout is inherited down the tree

---

#Cache and rendering

• a segment = a cache boundary
• Next.js can update parts of the page independently

---

#Common errors

• confusing route groups with URL
• expecting a route without page.tsx
• using catch-all incorrectly

---

#Short interview answer

Route segments in Next.js are parts of the URL that correspond to folders in app/. They can be static, dynamic, catch-all, or structural, and are used to form the URL, layouts, and rendering logic.