Most web apps start with static routes — one file per page, like home.tsx, about.tsx, projects.tsx. Each file matches exactly one URL.
A dynamic route is different. Instead of one file per URL, you create one file that handles many URLs. The route /forms/:id matches /forms/1, /forms/2, /forms/99 — all using the same code.
The :id part is a placeholder. When someone visits /forms/5, the app fills in :id with 5, loads that form's data from the database, and renders the page.
| Static routes | Dynamic routes |
|---|---|
| One file per page | One file for many pages |
/about → about.tsx | /forms/5 → one route file |
| Content is in the code | Content comes from the database |
Static routes work when you know every page in advance — your homepage, about page, projects page. But a form builder creates new pages on the fly. You can't make a new file every time someone creates a form. Dynamic routes let one piece of code serve an unlimited number of pages, each with different data.
:id. In your project's route files, it's written as $id — the $ means the same thing. Different syntax, same idea: "this part changes."