Demo: a product catalog, gallery first

The third demo app is an inventory. Where the CRM leads with a board and the task tracker leads with columns, the Product Catalog leads with pictures.

pnpm new my-shop --demo catalog

The gallery is the showroom

The products entity has an imageUrl field of type image, and the spec names it as the entity's imageKey. That single line is what makes this demo feel different: the gallery view unlocks, and the catalog browses like a storefront — cards with images, titles, and toned category badges. The table view stays the working inventory (SKU, price, stock, restock date), and the stats view aggregates price via the amountKey, so you get a stock-value read without building a report. The demo defaults to the minimal design with a teal accent.

Categories with a lifecycle

The category select is the statusKey, and its tones tell the product's story at a glance: General is plain, Featured is accent, Sale is warn, and Archived is danger — a deliberate reminder that a catalog needs an end-of-life state, not just happy paths. On the board view those categories become columns, so merchandising is a drag: pull the Canvas Tote from Sale back to General when the promotion ends.

The seed inventory

Load sample data fills an empty workspace with a small believable shop: a Field Notebook (featured, 220 in stock), a Brass Pen, a Canvas Tote on sale with a restock date, a Desk Mat, an Enamel Mug that is featured but out of stock with a restock coming, and an archived Old Catalog 2024 priced at zero. It is enough data to make every view mean something — the calendar shows the restock dates, the stats show where the stock value sits, and the gallery has faces.

Where uploads plug in

The seed rows ship without images by design — imageUrl is a URL field, so pasting any hosted image lights up the gallery immediately. The natural next step is the boilerplate's uploads feature: scaffold with it enabled and you have file storage with signed URLs in the same app, one short edit away from a real image pipeline where the form uploads a file and stores the resulting URL in imageUrl. The demo leaves that wiring to you on purpose; the seam is one field.

Or go the other way: a minimal list

Maybe you do not want a showroom — you want a flat parts list. Subtractive reshaping is the same --fields flag:

pnpm new my-shop --demo catalog --fields "-imageUrl,-restockDate,-notes"

Removing imageUrl clears the imageKey, so the gallery view is simply never offered; removing restockDate clears the dateKey, and the calendar and timeline go with it. There is no view configuration to edit — availableViews derives the menu from the config, and the config derives from your fields. The seed rows drop the removed columns automatically, so the sample data still loads clean.

Fill a role key, gain a view. Remove the field, lose it — automatically.

One spec, and it scales both directions: up toward a storefront with uploads, down to the tersest stock list. That range is the point of generating from a spec instead of copying a template.