Skip to content

Checkout

Your basket

The same basket you filled on the shelf — it carried over on its own. Review it, then place a test order through a live server round-trip.

0 items

Items

Your basket is empty.

Nothing here yet — the shelf is just a click away.

← Back to the shop

Place your order

This is a real form. With the runtime it posts over fetch and shows the reply inline; with JavaScript off, the identical markup degrades to a native POST. The demo endpoint simply echoes your order back.

Fill in your details and place the order to see the server's reply appear right here.

This basket is the same :store declared on the catalog — one name, one shared storage. Remove a line here and it's gone on the shelf too, in every open tab, even after a reload.

View source — it's Markdown
:store cart = []
:computed count = cart.length
:computed subtotal = sum(cart, price)
:computed total = subtotal * 1.08

@loop cart into item
::: card .line
{ item.emoji } **{ item.name }** — { item.price | money }
:button "Remove" -> cart remove item
:::
@empty
Your basket is empty.
@endloop

Subtotal ({ count | pluralize:"item" }) — **{ subtotal | money }**
Total with tax — **{ total | money }**

:button "Clear basket" -> cart clear

:form action="/api/echo" into receipt
:input name placeholder="Full name" required
:input email type=email placeholder="you@studio.com" required
:select shipping
- Standard — 3-5 days
- Express — overnight
- Local pickup
:submit "Place order"
:endform

:if receipt
Thank you, { receipt.received.name }!
:endif

Keep browsing — ← Back to the shop