Skip to content

Latest commit

 

History

History
45 lines (25 loc) · 3.39 KB

routing.md

File metadata and controls

45 lines (25 loc) · 3.39 KB
Raw

Routing

Head Start leverages Astro file-based routing combined with Cloudflare features for redirects and page not found behaviour. The setup is enhanced with i18n routing, API routing, nested page routing and helpers to resolve routes.

I18n routes

Head Start supports multi-language websites with localised routing (/:locale/page/to/page/). See i18n configuration and routing.

Nested routes

Head Start supports nested pages, so editors can create page URLs like /en/overview-page/category-page/detail-page/. This is achieved using a parentPage field* in Page models in the CMS, combined with a catch all route src/pages/[locale]/[...path]/ using Astro rest parameters. This setup can be copied for new page models added to your project.

To make nested routes more useful for website visitors and easier to manage for developers, Head Start provides a Breadcrumbs component and getHref() helpers for all linkable models.

* See decision entry on nested page setup for motivation.

Internal links to records

Content editors can link to other models (like Home or generic Page) within Structured Text fields. To create nodes for these links, Head Start provides a reusable Item Link.

When you want to make a new content model available for linking:

  1. Add the model to the references option of all relevant Structured Text fields in the CMS.
  2. Add the links to the GraphQL fragments of the related blocks (like TextBlock.fragment.graphql).
  3. Extend the generic getHref() helper to resolve the URL for the new model.

* See decision entry on record linking for motivation.

404 routes

Head Start leverages Astro's Custom 404 Error page (located in src/pages/404.astro), connected to the Not Found model in DatoCMS.

API routes

Astro supports API routes (server endpoints), which can be any route in src/pages/. Head Start uses a convention to place all API routes in src/pages/api/. This way it's clear where all API routes live, they have a logical URL prefix in the browser (/api/) and API routes not found can be caught and respond with a 404 JSON response, rather than an HTML response.

Redirects

Head Start supports redirect rules which are editable and sortable in the CMS. Head Start uses regexparam to handle redirect rules with static paths, (optional) parameters and (optional) wildcards. Examples:

  • from /redirect/static-path/ to /new-static-path/
  • from /path-with-param/:name/ to /new-path-with-param/:name/more-slug
  • from /path-with-wildcard/* to /new-path-with-wildcard/* (or /new-path-with-wildcard/:splat)

* See decision entry on redirects for motivation.