The Shopify product handle
An object with product (ShopifyProduct or null), loading (boolean), and error (string or null)
import { useShopifyProduct } from '@nosto/preact'
export default function ProductPage() {
const { product, loading, error } = useShopifyProduct("my-product-handle")
if (loading) return <div>Loading...</div>
if (error) return <div>Error: {error}</div>
if (!product) return <div>Product not found</div>
return (
<div>
<h1>{product.title}</h1>
<p>{product.description}</p>
<p>Price: ${product.price / 100}</p>
</div>
)
}
Preact hook that fetches and exposes product data from Shopify's handle.js endpoint.
Should always be at the top of the component!