An online store with card checkout, built by Claude Code on Elements
Coffee by collection with size and grind variants, guest checkout by card, order and shipping emails with tracking, and live stock and sales for the owner.
How it's built
Millrow needed a catalog with size and grind variants, a cart, card checkout, order emails, and stock that updates while people shop. Each of those is a part of Elements, so the agent spent its 29 minutes on the store itself.
- Live stock and orders. Product variants and orders are LiveTables. An open product page shows "Only 4 left" the moment stock changes, the owner's orders list fills in as orders arrive, and a channel pushes each new sale to the sales dashboard.
- Card checkout. Checkout prices the cart on the server, holds the stock and sends the shopper to Stripe with the store's own prices. The order is recorded when the shopper returns and again when Stripe's webhook arrives, once either way. Without a Stripe key, the same button opens a test checkout inside the app that pays through the same code, and in production the app registers its own webhook on the first checkout.
- Server calls as function calls. The cart, order lookup and product editor call server functions straight from the page with
@rpc, with types checked from the template to the database. - Background work. A job sends order confirmations and tracking emails, and a one-line cron schedule returns stock held by unfinished checkouts every five minutes.
- Data from SQL files. Migrations define the store and seed 12 products with 59 variants and 20 orders. The project server applied each one the moment it was saved.
- Sessions and roles. Every admin page and server call shares one guard on the signed-in owner's role.
Why Elements
Elements is an integrated full-stack app framework and a project server. The project server checks the agent's work as it builds: it type-checks the server and browser code, analyzes the program, applies migrations and runs the tests, then reports the results to the agent. A security mistake, such as calling a server-only function from the browser, is a compile error. The agent reads the report and fixes its own mistakes before it tells you a feature is done. The same checks run on every feature you ask for next.
Run it yourself
- 1 Sign up
Already have an account? Sign in
- 2 Install and run the demo One prompt to paste into your agent.
The prompt
What Claude was given to build this app.
Build an online store named millrow for a small coffee roaster. SHOPPER - Browse products by collection (single origin, blends, gear), with photos, descriptions and variants (bag size and grind, each with its own price and stock). - Cart, and checkout as a guest with email and shipping address. - Pay by card. Get an order confirmation email, and another when it ships with a tracking number. - Look up an order by email and order number. STORE OWNER (admin account) - Products, variants, photos, prices and stock. - Orders list: paid, shipped, refunded. Mark an order shipped with a tracking number. - Sales dashboard: revenue and orders today, this week, this month, and top products. Payments by Stripe. Seed the admin, three collections, twelve products with variants and photos, and twenty orders across statuses. Show the admin login on the sign-in page. Stock levels and new orders update in real time.