Blitz is pivoting to framework agnostic toolkit. Click to learn more.
🚀Announcing Flightcontrol - Easily Deploy Blitz.js and Next.js to AWS 🚀
Back to Documentation Menu

Route Manifest

Topics

Jump to a Topic

Blitz generates a Route Manifest for you. It allows you to refer to a page by name instead of location:

// Assume you have a page at app/pages/products/[productId].tsx
export default function ProductsPage() { ...

// You can then use Routes...
import { Link, Routes } from "blitz"

// ...to refer to it by name...
<Link href={Routes.ProductsPage({ productId: 123 })} />

// ...instead of looking up the location!
<Link href={`/products/${123}`} />

The Route Manifest is a purely optional feature. It has some advantages, though:

  • improved expressiveness
  • simplifies moving pages to new locations

Query Parameters

Query parameters can be specified together with route parameters.

// instead of ...
<Link href={`/products/${pid}?offerCode=capybara`} />

// ... you can do:
<Link href={Routes.Product({ pid, offerCode: "capybara" })} />

Generating the Manifest

The Route Manifest is generated into node_modules/.blitz directly from your source code. Both blitz build and blitz dev will automatically keep it up-to-date.
If you need to manually generate the route manifest (for example for a typecheck in CI) use blitz codegen.


Idea for improving this page? Edit it on GitHub.