{product.title}
{product.price}
Shop
-
{products.map((product) => (
-
{product.title}
{product.price} {product.currency}
View →
))}
{products.map((product) => (
{product.imageUrl ? (
) : null}
))}
);
}
```
Notes:
* The product card layout is yours, not Shoppex's.
* The checkout modal is Shoppex's.
* You can get `products` from the Storefront API, `@shoppexio/storefront`, or your own backend.
* You do **not** need to copy any specific `lib/shoppex.ts` file from another project. That kind of helper is one possible app structure.
### Event snippet (analytics)
```html theme={"system"}
```
Preparing checkout...
; if (error) return{error.message}
; if (!session) return null; return ( ); } export default function Page() { return ({product.title}
{product.price} {product.currency}
${store.name}
${store.rating ? `` : ''} `; } ``` ### getStoreLogoUrl Returns the store's logo URL directly. ```javascript theme={"system"} const logoUrl = await shoppex.getStoreLogoUrl(); if (logoUrl) { document.getElementById('logo').src = logoUrl; } ``` **Response**${product.title}
${shoppex.formatPrice(product.price, product.currency)} ${product.stock < 10 ? 'Only ' + product.stock + ' left!' : ''}
${galleryImages.map(img => `
`).join('')}
${product.title}
${shoppex.formatPrice(product.price, product.currency)}
${product.description}
${product.variants?.length ? `
` : ''}
${product.video_link ? `
Shopping Cart
Customer Reviews
${'★'.repeat(Math.round(avgRating))}${'☆'.repeat(5 - Math.round(avgRating))}
${avgRating.toFixed(1)} / 5
(${reviews.length} reviews)
${reviews.map(review => `
`).join('')}
`;
}
```
### getInvoice
Fetches full invoice details.
```javascript theme={"system"}
const { data: invoice } = await shoppex.getInvoice('inv_abc123');
console.log(invoice.status); // "COMPLETED"
console.log(invoice.total); // 29.99
console.log(invoice.products); // [{ title, quantity, price }]
```
**Response**
${'★'.repeat(review.rating)}${'☆'.repeat(5 - review.rating)}
${review.comment || ''}
${new Date(review.created_at).toLocaleDateString()}MEMBER ACCESS
NEON-20