Restaurant Websites
Smackz-Websites is the customer-facing web application. Each restaurant gets a branded website with dynamic pages, online ordering, and a menu browser. The website content is driven by dynamic page/section definitions stored in the Yum backend.
Tech Stack
| Component | Technology |
|---|---|
| Framework | React 19 |
| Build Tool | Vite |
| Styling | TailwindCSS v4 |
| Shared Packages | @smackz-llc/shared-core, @smackz-llc/shared-ui, @smackz-llc/page-renderer |
| Deployment | Cloudflare Pages |
How It Works
Restaurant websites are not static templates. They are dynamically rendered based on page and section configurations stored in the Yum API:
- The website loads and fetches the restaurant's page definitions (e.g.,
GET /restaurants/{id}/pages/name/homepage) - Each page contains ordered sections with content types, view types, and display properties
- The Page Renderer package renders each section based on its content type (
hero,text,chefs_favorites,featured_menu,reviews,address, etc.) - Styling is driven by the restaurant's theme configuration
Section Types
| Content Type | Description |
|---|---|
text |
Static content (hero banners, about sections) |
chefs_favorites |
Chef-curated menu picks |
crowd_favorites |
Popular items based on order data |
featured_menu |
Specific menu items selected by the owner |
reviews |
Customer testimonials |
address |
Restaurant location with map |
special_offers |
Active promotions |
recent_orders |
Personalized order history (auth required) |
Build and Deploy
npm run build
# Runs: type-check -> lint -> vite build
Deployed via Cloudflare Pages with Wrangler (wrangler.toml config). Build output goes to build/.
On QA builds, a prebuild script automatically installs the latest QA versions of shared packages (shared-core@qa, shared-ui@qa, page-renderer@qa).
Key Files
Smackz-Websites/CLAUDE.md-- Build and branch ruleswrangler.toml-- Cloudflare Pages configurationscripts/install-qa-packages.js-- QA package override script