Ch 2 · Routes Are Folders · Next.js
Topic 2 of 7 in Next.js — Build the App You Deploy — 5 lessons.
A Folder Plus page.tsx Is a URL
The rule is exact: a folder under app/ becomes a path segment, and a file named page.tsx inside it becomes the page shown there. A folder without a page.tsx creates no route — it is just organisation.
Layouts Wrap Pages
app/layout.tsx wraps every page in the app. children is where the current page appears. Navigation, headers and footers live here so you write them once.
Dynamic Routes
You will not write a page per order. You write one page that reads which order was asked for.
Linking Between Pages
A plain <a> reloads the whole application: every script re-downloads, all state is lost, the screen flashes white. Link swaps only the part of the page that changed, and quietly pre-loads the destination when the link scrolls into view.
Not Found, and Loading
Every real screen has three outcomes, not one: it works, it is still working, or the thing does not exist. Handling only the first is the difference between a demo and something a client can use.