19
loading...
This website collects cookies to deliver better user experience
yarn create hydrogen-app
export default {
locale: 'en-us',
storeDomain: 'hydrogen-preview.myshopify.com',
storefrontToken: '3b580e70970c4528da70c98e097c2fa0',
graphqlApiVersion: 'unstable',
};
Custom but specific hooks, such as useShopQuery, are introduced for caching and integration with Shopify.
The useShopQuery hook is designed to be used only in server components. This is because only server components can make calls to the Storefront API. The useQuery hook allows you to execute an asynchronous operation like fetch in a way that supports Suspense. You can use this hook to call any third-party APIs.
const {data} = useShopQuery({
query: QUERY,
cache: {
// Cache the data for one second.
maxAge: 1,
// Serve stale data for up to nine seconds while getting a fresh response in the background.
staleWhileRevalidate: 9,
},
});
export default function MyProducts({response}) {
response.cache({
// Cache the page for one hour.
maxAge: 60 * 60,
// Serve the stale page for up to 23 hours while getting a fresh response in the background.
staleWhileRevalidate: 23 * 60 * 60,
});
}