Back to Mastery Path
Routing

Route Groups

Route groups allow you to organize your route segments and layouts without affecting the URL structure.

Interactive Simulation Engine
Route Groups (Hidden Segments)
app
(auth)No URL segment
login
page.tsx/login
register
page.tsx/register
layout.tsxShared Auth UI
dashboard
page.tsx
Click nodes to inspect
Executable Code Workbench
page.tsx
Live Code Editor
1// (auth)/login/page.tsx  ->  /login
2// (auth)/register/page.tsx -> /register
3// (auth)/layout.tsx        -> Shared auth UI
4
5export default function Login() {
6  return <form>Login</form>
7}
Mental Model
They are 'invisible' folders. They exist to help the developer group files and share layouts, but the user never sees them in the address bar.
Why This Exists
To allow multiple root layouts or to group related routes (like authentication pages) together without adding '/auth/' to the URL.
Critical Note
"Naming a folder with parentheses is just a convention. No, it is a specific Next.js feature that excludes the name from the URL path."