Beyond the basic folder-to-route mapping, Next.js offers several routing patterns that handle common real-world needs. A dynamic route uses square brackets in the folder name, like app/blog/[slug]/page.tsx. The captured segment is then available on the page component through its params prop, typed as { slug: string }. This is the standard way to build URLs such as /blog/my-first-post where the final segment is determined at request time.
When you need to match an unknown number of segments, you can use a catch-all route by naming the folder [...slug]. A file at app/docs/[...slug]/page.tsx will match /docs/a, /docs/a/b, and /docs/a/b/c, returning the captured segments as an array on params.slug. If you also want the route to match the parent itself, you can wrap the brackets in another pair to make an optional catch-all, written as [[...slug]]. With that syntax, app/docs/[[...slug]]/page.tsx matches both /docs and /docs/anything/here.
For organizing code without affecting URLs, Next.js provides Route Groups, which are folders whose names are wrapped in parentheses such as (marketing). The parentheses are stripped from the URL, so app/(shop)/products/page.tsx is reachable as /products, but you can attach a different layout to the (shop) group than to the rest of the app. Parallel Routes go further by letting a single layout render multiple pages at once using named slots prefixed with the @ symbol, such as @dashboard and @analytics. Closely related are Intercepting Routes, written with parentheses and dots like (..), which intercept a navigation and render a different page in context, typically used to show a photo in a modal when clicked, while preserving the full page when the URL is opened directly.