Route
The Route component is used to set up a route in Hydrogen that's independent of the file system. Routes are matched in the order that they're defined.
Example code
Anchor link to section titled "Example code"
| Name | Type | Description |
|---|---|---|
| path | string |
The URL path where the route exists. The path can contain variables. For example, /products/:handle. |
| page | ReactElement |
A reference to a React Server Component that's rendered when the route is active. |
Component type
Anchor link to section titled "Component type"The Route component is a server component that renders inside App.server.jsx. For more information about component types, refer to React Server Components.
Considerations
Anchor link to section titled "Considerations"- Only one route renders at a time.
- Use
path="*"with the last defined<Route>to implement a fallback mechanism on a "Not Found" page. - Routes defined with the
Routecomponent can't be API routes.