Val Town is a collaborative website to build and scale JavaScript apps.
Deploy APIs, crons, & store data – all from the browser, and deployed in milliseconds.
A basic storefront scaffold with a product catalog, category filtering, and a shopping cart — built with React + Hono on Val Town.
- 📦 Product catalog stored in SQLite (auto-seeded on first load)
- 🏷️ Category filter pills
- 🛒 Slide-out cart drawer with quantity controls
- 🎨 Tailwind styling via Twind (zero build step)
Rendering mermaid diagram...
index.ts ← Hono server (API + static files)
db.ts ← SQLite schema, seed data, queries
frontend/
index.html ← HTML shell (Twind + React)
index.tsx ← React entrypoint
components/
App.tsx ← Root: layout, state, data fetching
Header.tsx ← Sticky header with cart button
ProductCard.tsx ← Single product card
Cart.tsx ← Slide-out cart drawer
| Method | Path | Description |
|---|---|---|
| GET | /api/products | List all products (optional ?category= filter) |
| GET | /api/products/:id | Get a single product |
| GET | /api/categories | List distinct categories |
- Add a product detail page
- Wire up checkout (Stripe, etc.)
- Add an admin panel for product CRUD
- Persist cart in localStorage
- Add user authentication via
std/oauth