What is the key idea of routing in Next.js?

The key idea of routing in Next.js is: the app's URL is determined by the file and folder structure, not by configuration in code.

In short:

Files = routes

---

#What file-based routing is about

You don't describe routes manually, like in React Router, you just create files:

Next.js itself:

• creates the routes
• wires them up to the server
• optimizes loading

---

#Why this matters

#1. Minimal configuration

• no router-config
• no switch / routes
• less boilerplate

---

#2. Project structure = site structure

• the project reads like a sitemap
• easy to navigate
• convenient to scale

---

#3. Nesting and layouts

Every folder can have:

• layout.tsx - shared shell
• page.tsx - content
• loading.tsx - loading state
• error.tsx - error handling

This makes routing declarative.

---

#Dynamic routes

• [id] - a URL parameter
• available on both server and client

---

#Route groups

• the folder does not affect the URL
• needed for logical structure

---

#Parallel and intercepting routes

• several UI areas on the same URL
• modals, sidebars, nested panels
• complex interfaces without hacks

---

#Difference from React Router

---

#Short interview answer

The key idea of routing in Next.js is that the file system determines the routes: the folder structure directly corresponds to the URL, which removes configuration and simplifies the app's architecture.