Guides / How to build

How to Build a Food Ordering Website: Menu, Cart, Pickup Times and Kitchen View

How to build your own food ordering website: menu and options, cart, pickup slots, payments, a kitchen screen, and when a delivery platform is better.

Mythex Team · 2026-09-29 · 5 min read

A food ordering website lets customers choose from your menu, customise items, pick a pickup or delivery time, pay, and get a confirmation — while the kitchen sees each order appear on a screen and marks it ready. To build one you need a menu with options (sizes, extras, "no onions"), a cart that calculates totals correctly, time slots with limits so the kitchen isn't flooded, card payments, and a simple order board for staff. An AI app builder can produce all of this from a clear description. The work is in the details: opening hours, sold-out items, order caps and what happens when a payment succeeds but the order didn't save.

What the site needs

Pages

  • Customer: menu by category, item detail with options, cart, checkout (name, phone, pickup or delivery, time), payment, and a confirmation page showing the order number and status.
  • Kitchen: a live list of new, in-progress and ready orders, each with items, options, notes and the pickup time.
  • Owner: menu editor (items, prices, photos, options, sold out), opening hours, slot limits, and a sales summary.

Data

TableKey fields
CategoriesName, order
ItemsCategory, name, description, price, photo, allergens, available yes/no
Option groupsItem, name ("Size", "Extras"), required yes/no, min and max choices
OptionsGroup, name, price change
OrdersNumber, customer name, phone, email, type (pickup or delivery), address, slot time, subtotal, fees, total, payment status, order status
Order linesOrder, item, quantity, chosen options, line price, note
SettingsOpening hours, slot length, max orders per slot, delivery zones and fees

Save the item name and price on each order line at the time of ordering. If you later change the menu, old orders should still show what the customer actually paid for.

Permissions

Customers see only their own order via the confirmation link. Kitchen staff see and update orders but cannot change prices. The owner edits the menu and settings. A shared kitchen login on a tablet is common; the owner should have a separate one.

Decisions and trade-offs

Pickup, delivery or both

Pickup only is much simpler and is where most small places should start. Delivery adds zones, fees, minimum orders, address validation, driver assignment and a longer list of things that can go wrong.

ASAP or scheduled times

"As soon as possible" is easy to offer but hard to keep honest on a busy night. Scheduled slots with caps — say, no more than eight orders per 15-minute window — protect the kitchen and set expectations. You can still show "earliest available: 18:45".

Payment up front or on collection

Paying online reduces no-shows and speeds up pickup. Paying on collection is simpler to build but invites fake orders. Most places take card payment up front through a hosted checkout such as Stripe Checkout; our payments guide covers the setup. Tips, taxes and receipt rules vary by country — check local rules.

How orders reach the kitchen

Options: a browser tab on a tablet that refreshes automatically (simplest), an email or message per order as a backup, or sending orders to a receipt printer (needs extra hardware and setup). A sound when a new order arrives matters more than you think.

A first prompt that works

Build an online ordering website for Casa Verde, a taqueria in Austin, Texas, for pickup only. Menu categories: Tacos, Bowls, Sides, Drinks. Items have options: tacos choose a protein (chicken, carnitas, mushroom +$1), a tortilla (corn or flour) and optional extras (guac +$1.50, cheese +$0.75); bowls choose a base and protein. Customers add items to a cart, choose a 15-minute pickup slot during opening hours (Tue–Sun 11:00–21:00, Central time), enter name and phone, and see a total with 8.25% sales tax. Cap each slot at 8 orders and hide full slots. Save orders in a database with statuses new, preparing, ready, collected. A kitchen page (login required) shows today's orders by pickup time, plays a sound for new orders, and lets staff move orders along. Owner page to edit the menu, mark items sold out, and pause ordering. Card payment comes later — for now orders are "pay at pickup". Bold, colourful, mobile-first design with large tap targets.

Starting with pay-at-pickup lets you test the full order flow with staff before payments are in the mix.

Build steps

  1. Menu and options. Get the menu, option groups and price calculations right. Test an item with every option combination.
  2. Cart and checkout. Quantities, notes, totals, tax, and a slot picker that respects opening hours.
  3. Order saving and confirmation. Server-side total calculation — never trust the price the browser sends — and a confirmation page with the order number.
  4. Kitchen board. Live list, new-order sound, status buttons, large text readable from a metre away.
  5. Owner controls. Sold out, pause ordering, slot caps, hours.
  6. Payments in test mode. Only mark an order as paid when the payment provider confirms it, and handle the case where payment succeeds but the order didn't save.
  7. Notifications. An email or text confirmation and a "ready for pickup" message via your own provider. See adding notifications.
  8. A soft launch. Run it with staff and friends for a few days, watching the kitchen side as much as the customer side.

Common mistakes

  • Calculating prices in the browser only. Anyone can change them. Recalculate on the server.
  • No sold-out switch. You will sell the last portion five times.
  • No slot limits. A busy Friday turns into 40 orders due at 19:00.
  • Allergen information missing or out of date. Show allergens per item and keep them accurate; rules on this are strict in many countries.
  • Time zone confusion. Store times in UTC, display in the restaurant's local time, and test near midnight and daylight-saving changes.
  • The kitchen tablet goes to sleep. Keep the screen awake and test that new orders appear without a refresh.

When a ready-made product is the better choice

If you want to be found by new customers in your area, delivery platforms bring demand you cannot easily create yourself — in exchange for commission. If you already use a point-of-sale system, check whether it includes online ordering; orders that land straight in your till and kitchen printer are hard to beat.

Build your own when you want commission-free direct orders from regulars, an ordering flow tailored to how you work (pre-orders for a bakery, catering trays, a weekly meal-prep menu), or ordering tied into a loyalty scheme or your own website. The restaurant website guide covers the rest of the site around it.

Building it with Mythex

On Mythex you describe the ordering flow in chat and it appears in a live preview you can check in a phone-size frame. Orders and the menu live in a Postgres database the agent adds when you ask to save them. Card payments use your own Stripe account and keys stored as project secrets — the Stripe recipe shows the prompt — and texts or emails go through your own provider, since Mythex has no built-in payments, email or SMS product. Payment webhooks need the app published at a public URL. Before launch, /test has the agent click through ordering in the preview and report what breaks.

For a starting prompt, try the bakery order page or coffee order page templates, or the restaurant online store builder.

Questions

What does a food ordering website need?

A menu with prices, options and sold-out states; a cart; pickup or delivery details with a time; payment; an order confirmation; and a kitchen view where staff see new orders and mark them ready.

How do I stop taking more orders than the kitchen can handle?

Limit orders per time slot. Split the day into 15-minute pickup windows, cap how many orders or items each window accepts, and let the kitchen pause ordering with one button when it is overwhelmed.

Can I handle delivery myself?

Yes, if you have drivers. Define delivery zones by postcode or distance, set a minimum order and a delivery fee per zone, and give drivers a simple list of orders with addresses. Many restaurants start with pickup only.

Is my own ordering site better than delivery apps?

Your own site avoids per-order commission on direct orders and keeps the customer relationship, but you bring the traffic and handle delivery yourself. Most restaurants use both: platforms for discovery, their own site for regulars.

Keep reading

  • AI se App Kaise Banaye (Free, Bina Coding) — Step by Step Guide — AI se app kaise banaye, bilkul free aur bina coding: idea likhiye, Mythex app bana deta hai, live preview mein test kijiye aur ek click mein publish kijiye.
  • AI se Website Kaise Banaye — Free mein, Prompt se Publish Tak — AI se website kaise banaye: dukaan, clinic ya portfolio ka prompt likhiye, Mythex website bana kar live link deta hai. Free shuru, coding nahi chahiye.
  • Android App Kaise Banaye — AI se Banaiye aur Google Play par Upload Kijiye — Android app kaise banaye: AI se app banaiye, Mythex se Android file (AAB) lijiye aur Google Play Console mein upload kijiye. Coding nahi chahiye.
  • App Kaise Banaye: Coding, No-Code aur AI — Saare Tareeke aur Kharcha — App kaise banaye? Coding seekh kar, developer se, no-code tool se ya AI se. Har tareeke ka time, ₹ mein rough kharcha aur kiske liye sahi hai.
  • How to Build an App With Vibe Coding: From Idea to Published App — How to build an app with vibe coding, step by step: a one-page spec, the first prompt, data and login, testing, security, publishing and first users.
  • How to Make a Mobile App: Native, Cross-Platform or Web-Wrapped — Mobile app development explained: native, cross-platform and web-wrapped apps compared honestly, the steps to ship one, store costs, and where AI fits.

Start building free · Templates · Docs

አማርኛ العربية Български বাংলা Bosanski Català Čeština Dansk Deutsch Ελληνικά Español Español (España) Eesti فارسی Suomi Français Français (Canada) ગુજરાતી हिन्दी Hrvatski Magyar Հայերեն Bahasa Indonesia Íslenska Italiano 日本語 ქართული Қазақ тілі ಕನ್ನಡ 한국어 Lietuvių Latviešu Македонски മലയാളം Монгол मराठी Bahasa Melayu မြန်မာ Norsk bokmål Nederlands ਪੰਜਾਬੀ Polski Português (Brasil) Português (Portugal) Română Русский Slovenčina Slovenščina Soomaali Shqip Srpski Svenska Kiswahili தமிழ் తెలుగు ไทย Tagalog Türkçe Українська اردو Tiếng Việt 简体中文 繁體中文(香港) 繁體中文(台灣)