Websites · React
Neighbourhood café
Warm café website with a full menu, opening hours, events and a table booking form.
What you get
A one-page site for a café or bakery: an inviting hero, the full menu with prices, a story section, guest quotes, opening hours with the address, and a booking form. All content lives in src/site.ts.
Files
Exactly what is copied into a new project: 13 files, nothing generated.
Explorer 13
import type { Site } from "./types"; /** Everything this site shows. Edit freely. */export const site: Site = { "brand": "Larder & Loaf", "nav": [ { "label": "Menu", "href": "#menu" }, { "label": "Our story", "href": "#story" }, { "label": "Visit", "href": "#visit" } ], "navCta": { "label": "Book a table", "href": "#contact" }, "sections": [ { "kind": "hero", "variant": "split", "eyebrow": "Bakery & kitchen · Since 2014", "title": "Slow bread, good coffee, and a table by the window.", "text": "Sourdough baked before sunrise, seasonal plates from 8 until 3, and espresso from a small roaster down the road.", "primary": { "label": "See the menu", "href": "#menu" }, "secondary": { "label": "Book a table", "href": "#contact" }, "visual": { "type": "tiles", "tones": [ "#c2410c", "#e9d5c0", "#4d7c0f", "#78350f" ], "caption": "Morning bake, 6:30 am" }, "note": "Walk-ins welcome. Booking recommended for weekend brunch." }, { "kind": "menu", "id": "menu", "eyebrow": "Menu", "title": "Made here, every day", "text": "Menu changes with the season. Ask us about allergens.", "groups": [ { "name": "Breakfast", "items": [ { "name": "Sourdough toast", "text": "Cultured butter, house jam", "price": "$7" }, { "name": "Shakshuka", "text": "Baked eggs, peppers, feta, flatbread", "price": "$16" }, { "name": "Ricotta pancakes", "text": "Poached rhubarb, honeycomb", "price": "$15" }, { "name": "Granola bowl", "text": "Greek yoghurt, stone fruit", "price": "$12" } ] }, { "name": "Lunch", "items": [ { "name": "Roast chicken sandwich", "text": "Aioli, pickled onion, rocket", "price": "$17" }, { "name": "Market salad", "text": "Grains, roast squash, tahini", "price": "$15" }, { "name": "Soup of the day", "text": "With a thick slice of rye", "price": "$11" }, { "name": "Cardamom bun", "price": "$5" } ] } ] }, { "kind": "split", "id": "story", "eyebrow": "Our story", "title": "A bakery that grew a kitchen", "text": "We started with one oven and a 40-year-old starter. Ten years on we still mill some of our own flour and still close at 3 so the bakers can sleep.", "bullets": [ "Organic flour from two local mills", "Coffee roasted weekly, 3 km away", "Nothing on the menu comes frozen" ], "visual": { "type": "card", "tone": "#7c2d12", "title": "Saturday bread class", "lines": [ "Monthly, 9 am to 1 pm", "Take home your own starter", "Six places per class" ] } }, { "kind": "quotes", "eyebrow": "Regulars", "title": "What people come back for", "items": [ { "quote": "The cardamom buns sell out by ten, so I've started setting an alarm.", "name": "Maya R.", "role": "Weekday regular" }, { "quote": "Best shakshuka in the city and they never rush you out.", "name": "Tom B.", "role": "Brunch every Sunday" }, { "quote": "We ordered our wedding loaves here. Guests still ask about them.", "name": "Priya & Sam", "role": "Catering customers" } ] }, { "kind": "hours", "id": "visit", "eyebrow": "Visit", "title": "Find us on Alder Street", "text": "Step-free entrance, dogs welcome on the terrace.", "rows": [ { "day": "Monday – Friday", "time": "7:00 – 15:00" }, { "day": "Saturday", "time": "8:00 – 15:00" }, { "day": "Sunday", "time": "8:00 – 14:00" } ], "address": "214 Alder Street, Portland, OR", "phone": "(503) 555-0142", "email": "hello@larderandloaf.com" }, { "kind": "contact", "eyebrow": "Bookings", "title": "Book a table", "text": "For groups of up to eight. For larger parties or catering, send us a message.", "fields": [ "name", "email", "date", "guests", "message" ], "button": "Request booking" } ], "footer": { "text": "Bread, coffee and seasonal plates on Alder Street.", "columns": [ { "title": "Visit", "links": [ "214 Alder Street", "Open daily from 7" ] }, { "title": "Order", "links": [ "Bread subscription", "Catering", "Gift cards" ] }, { "title": "Follow", "links": [ "Instagram", "Newsletter" ] } ], "legal": "© Larder & Loaf. Sample content: replace it in src/site.ts." }};Remix
Remix this template
Describe what to change and the agent starts from Neighbourhood café's files. The box is already started for you: finish “Start from Neighbourhood café and …”
Dependencies
Documented from the template's package.json. The runtime has a prebuilt dependency set for Vite + React + TypeScript, so installs are fast.
- react^19.1.0
- react-dom^19.1.0
- vite^6.3.0
- @vitejs/plugin-react^4.4.0
- tailwindcss^4.1.0
- @tailwindcss/vite^4.1.0
- typescript^5.8.0
How it runs
- Framework
- Vite + React + TypeScript
- Dev command
- npm run dev
- Build command
- npm run build
- Output directory
- dist
- Port
- 5173
- Entry route
- /
Projects run in an isolated sandbox with a live preview. Read the projects documentation for settings, snapshots and deployment.
Keep browsing
All templates
Architecture studio
Editorial architecture practice site with selected projects, the studio's approach, a short history and the team.
Boutique hotel
Elegant small-hotel website with rooms and rates, the restaurant, guest notes, arrival details and a stay request form.
Static website
Plain HTML, CSS, and JavaScript with no build step. Ideal for simple sites and learning.
Build on Neighbourhood café
Create a free account, start from this template, and ask the AI agent to turn it into your app.