jeffi
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 complete, responsive eCommerce website built with Hono backend and React frontend, styled with TailwindCSS.
- Homepage: Hero section, product categories, featured products, testimonials
- Product Catalog: Grid layout with filtering, sorting, and pagination
- Product Details: Image gallery, reviews, related products
- Shopping Cart: Item management with quantity controls
- Checkout: Complete order flow with address and payment forms
- Authentication: Login, signup, password recovery
- Responsive Design: Mobile-first approach with dark mode support
- Product Management: Add, edit, delete products
- Order Management: View and manage customer orders
- User Management: Customer account oversight
- Backend: Hono (TypeScript)
- Frontend: React 18.2.0 with TypeScript
- Database: SQLite
- Styling: TailwindCSS (Townie)
- Storage: Val Town Blob for product images
βββ backend/
β βββ database/
β β βββ migrations.ts # Database schema
β β βββ queries.ts # Database operations
β βββ routes/
β β βββ auth.ts # Authentication routes
β β βββ products.ts # Product CRUD
β β βββ cart.ts # Cart operations
β β βββ orders.ts # Order management
β β βββ admin.ts # Admin operations
β βββ index.ts # Main server entry
βββ frontend/
β βββ components/
β β βββ layout/ # Navigation, footer, layout
β β βββ pages/ # Page components
β β βββ ui/ # Reusable UI components
β β βββ App.tsx # Main app component
β βββ index.html # HTML template
β βββ index.tsx # Frontend entry point
βββ shared/
βββ types.ts # Shared TypeScript types
βββ utils.ts # Shared utilities
- The backend serves the frontend and API endpoints
- SQLite database is automatically initialized
- Sample data is seeded on first run
- Access the site at the HTTP endpoint URL
GET /- HomepageGET /api/products- Product listing with filtersGET /api/products/:id- Product detailsPOST /api/auth/login- User authenticationPOST /api/cart- Cart operationsPOST /api/orders- Order placementGET /admin/*- Admin dashboard (protected)