# Routing

> 

Page routes live under `app/pages/`.

## Core conventions

- `layout.*` creates a layout route
- `page.*` creates a page route
- `error.*` creates a route error boundary
- `loading.*` creates a client navigation loading boundary
- `middleware.ts` adds middleware for the current route
- `index/` is used for a directory's own index route when that directory also has child routes
- a non-`index/` directory-level `middleware.ts` applies to that directory subtree

## Dynamic routes

Use square brackets for params:

```text
app/pages/blog/[slug]/page.ts
```

Use catch-all routes for the rest pattern:

```text
app/pages/docs/[...all]/page.ts
```

Use route groups to organize files without affecting the URL:

```text
app/pages/(marketing)/about/page.vue
```

## Typed navigation

After `vuloom prepare`, route ids and params are available to TypeScript.

```ts
router.push({
  routeId: 'blog/[slug]/page',
  params: {
    slug: 'hello-world'
  }
})
```

`<RouterLink>` supports string targets today. Typed object navigation is generated into the route types, but this docs set should not assume a separate `Link` component exists yet.

## Path ownership

`app/pages` owns page paths. `server/routes` cannot overlap with the same path pattern, even if methods differ.
