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
Route
component can't be API routes.