Millrow: an online store for a small coffee roaster

Millrow: an online store for a small coffee roaster

00 Markdown

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.

Run it yourself

Get the finished app on your own machine, ready to change however you like.

VS Code Command Palette⇧⌘P
millrow -scaffold=elementscode/demo-millrow

Press 'Enter' to confirm your input or 'Escape' to cancel

Press ⇧⌘P in VS Code and choose Elements: New App. Then paste this line and press Enter.

New to Elements? Install Elements first.

The code

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.

What Elements gave the app

  • 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.

What the project server gave the agent

The project server runs alongside the agent and answers as soon as a file is saved: it type-checks the templates, TypeScript and SQL, applies migrations and reruns the tests, so every question came back right away and the agent kept building.

What shipped

The app type-checks with zero errors and all 25 tests pass. Every page works on desktop and phone. A real sandbox payment went through Stripe end to end.

Comments· 0

Join the community

Get a weekly digest of new posts.

Sign up