fix: comment and link
This commit is contained in:
Michelle Vinci
parent
1901ae7e35
commit
355cd7f6e0
|
|
@ -1,3 +1,5 @@
|
|||
<!-- This file is generated from the source code and any changes you make here will be overwritten. For more information, refer to https://github.com/Shopify/shopify-dev/blob/master/content/internal/operations/hydrogen-reference-docs.md. -->
|
||||
|
||||
Caching is a fundamental building block of a good shopping experience. Combined with streaming server-side rendering, caching ensures that buyers get the quickest response possible while also displaying the latest data.
|
||||
|
||||
Hydrogen provides two mechanisms for cache within applications:
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
<!-- This file is generated from the source code and any changes you make here will be overwritten. For more information, refer to https://github.com/Shopify/shopify-dev/blob/master/content/internal/operations/hydrogen-reference-docs.md. -->
|
||||
|
||||
Hydrogen's quick start environment is styled using the Tailwind CSS utility library [Tailwind CSS](https://tailwindcss.com/). This guide describes the CSS support that's built into Hydrogen apps and how you can customize your app's styles.
|
||||
|
||||
## How it works
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
<!-- This file is generated from the source code and any changes you make here will be overwritten. For more information, refer to https://github.com/Shopify/shopify-dev/blob/master/content/internal/operations/hydrogen-reference-docs.md. -->
|
||||
|
||||
<aside class="note beta">
|
||||
<h4>Developer preview</h4>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
<!-- This file is generated from the source code and any changes you make here will be overwritten. For more information, refer to https://github.com/Shopify/shopify-dev/blob/master/content/internal/operations/hydrogen-reference-docs.md. -->
|
||||
|
||||
The Hydrogen framework includes page server components. This guide describes how page server components receive props.
|
||||
|
||||
## How pages work
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<!-- This file is generated from the source code and any changes you make here will be overwritten. -->
|
||||
<!-- This file is generated from the source code and any changes you make here will be overwritten. For more information, refer to https://github.com/Shopify/shopify-dev/blob/master/content/internal/operations/hydrogen-reference-docs.md. -->
|
||||
|
||||
Hydrogen is modelled after [React Server Components](https://reactjs.org/blog/2020/12/21/data-fetching-with-react-server-components.html), an approach that offers an opinionated data-fetching and rendering workflow for React apps. React Server Components are rendered in the server-side to improve the performance of React apps by decreasing bundle size and performing queries on the server.
|
||||
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
<!-- This file is generated from the source code and any changes you make here will be overwritten. For more information, refer to https://github.com/Shopify/shopify-dev/blob/master/content/internal/operations/hydrogen-reference-docs.md. -->
|
||||
|
||||
The Hydrogen framework uses a file-based routing system. This guide provides an introduction to how routing works in your Hydrogen app.
|
||||
|
||||
## How routes work
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
<!-- This file is generated from the source code and any changes you make here will be overwritten. For more information, refer to https://github.com/Shopify/shopify-dev/blob/master/content/internal/operations/hydrogen-reference-docs.md. -->
|
||||
|
||||
Secrets are environment variables that contain sensitive information. This guide describes how to store secrets in your Hydrogen project.
|
||||
|
||||
## How secrets work
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
<!-- This file is generated from the source code and any changes you make here will be overwritten. For more information, refer to https://github.com/Shopify/shopify-dev/blob/master/content/internal/operations/hydrogen-reference-docs.md. -->
|
||||
|
||||
The Hydrogen framework includes `<Seo>` client and server components. This guide describes how to customize the output of SEO-related tags in your Hydrogen client and server components.
|
||||
|
||||
## How SEO works
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
<!-- This file is generated from the source code and any changes you make here will be overwritten. For more information, refer to https://github.com/Shopify/shopify-dev/blob/master/content/internal/operations/hydrogen-reference-docs.md. -->
|
||||
|
||||
As you build your Hydrogen app with [React Server Components](/api/hydrogen/framework/react-server-components), you'll likely need to update `state` on the server. Sharing state information between the client and server is important for common tasks, like [page routing](/api/hydrogen/framework/react-server-components#sharing-state-between-client-and-server).
|
||||
|
||||
This guide describes how to manage your server state during your development process.
|
||||
|
|
@ -20,7 +22,7 @@ navigator.geolocation.getCurrentPosition((data) => {
|
|||
|
||||
## Managing server state
|
||||
|
||||
The most basic example of `state` is the `page` prop, which Hydrogen manages for you whenever your URL location changes. However, you can set any state that you want within client components using the [`useServerState`](/api/hydrogen/hooks/global/useserverstate) hook:
|
||||
The most basic example of `state` is the `page` prop, which Hydrogen manages for you whenever your URL location changes. The server state is passed as a prop to page components. However, you can set any state that you want within client components using the [`useServerState`](/api/hydrogen/hooks/global/useserverstate) hook:
|
||||
|
||||
```js
|
||||
import {useServerState} from '@shopify/hydrogen/client';
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
<!-- This file is generated from the source code and any changes you make here will be overwritten. For more information, refer to https://github.com/Shopify/shopify-dev/blob/master/content/internal/operations/hydrogen-reference-docs.md. -->
|
||||
|
||||
When building your custom storefront, it can be useful to have access to static assets not already hosted elsewhere, like images or text documents. This guide describes how to reference and serve static assets in Hydrogen.
|
||||
|
||||
## How static assets work
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
<!-- This file is generated from the source code and any changes you make here will be overwritten. For more information, refer to https://github.com/Shopify/shopify-dev/blob/master/content/internal/operations/hydrogen-reference-docs.md. -->
|
||||
|
||||
Third-party dependencies will generally work out-of-the-box with Hydrogen. This guide describes how to install third-party dependencies, where to insert them, and offers tips for troubleshooting dependencies.
|
||||
|
||||
## Install dependencies
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<!-- This file is generated from the source code and any changes you make here will be overwritten. -->
|
||||
<!-- This file is generated from the source code and any changes you make here will be overwritten. For more information, refer to https://github.com/Shopify/shopify-dev/blob/master/content/internal/operations/hydrogen-reference-docs.md. -->
|
||||
|
||||
This guide provides information about working with React Server Components in your Hydrogen app.
|
||||
|
||||
|
|
|
|||
|
|
@ -224,7 +224,7 @@ async function runHydrogenGenerator(args: Partial<Options> = {}) {
|
|||
title: 'React Server Components overview',
|
||||
description:
|
||||
'Learn about React Server Components, an opinionated data-fetching and rendering workflow for React apps.',
|
||||
url: '/api/hydrogen/framework/react-server-components.md',
|
||||
url: '/api/hydrogen/framework/react-server-components/index.md',
|
||||
entry: 'framework/docs/react-server-components.md',
|
||||
}),
|
||||
generator.section({
|
||||
|
|
|
|||
Loading…
Reference in New Issue