Tutorial: a booking app with a backend
Use the App kind to get a frontend plus a REST backend, then grow it with entities, validation and an admin view.
Choose App (FE + BE)
On the home page pick the App kind. Alloy generates a React frontend and a backend that follows routes → controllers → services, with typed models shared by both.
Prompt
A booking app for a hair salon.
Entities: services (name, duration, price), stylists (name, photo, days),
bookings (customer name, phone, service, stylist, date, time, status).
Public pages: services, stylists, booking form with available times.
Admin pages: bookings table with filters by date and stylist, confirm / cancel actions.
REST API with CRUD for each entity and validation.What you get
| Part | Where | Notes |
|---|---|---|
| Pages and components | src/pages, src/components | Bear components, Compass routes |
| API client | src/features/api | Forge Query hooks with caching |
| Backend routes | server/src/routes | One file per entity |
| Controllers / services | server/src/controllers, server/src/services | Validation in controllers, logic in services |
| Environment | .env.example | Copy to .env locally; never commit it |
Grow it step by step
- "Prevent double bookings: a stylist cannot have two bookings at the same date and time. Return a 409 with a clear message."
- "Add an SMS reminder field (yes / no) to bookings and show it in the admin table."
- "Add a dashboard page with bookings per day for the last 14 days and revenue per service."
Run it locally
npm install
cp .env.example .env
npm run devThen follow Git workflows to keep working in your editor and in Alloy at the same time.