Name: Restaurant Ordering App
Availability: InStock

Get started

Ready to build

Build the app you keep thinking about.

Describe your idea. Sanic AI builds the real app, end to end.

Start building See how it works

Built with Appsanic

Restaurant Ordering App

Menus and ordering in your pocket

A complete single-restaurant ordering starter on your own Supabase. Browse a sectioned menu with a hero and sticky category pills; customise dishes with single/multi-select modifiers, instructions, and a live price preview; build a cart with delivery/pickup and ETA; check out with a tip selector; then track the order live (Confirmed to Delivered). Checkout is server-authoritative: a place_order RPC reprices the cart from the database so totals can't be forged.

Sectioned menu with restaurant hero, sticky category pills, and quick-add rows
Item detail with single/multi-select modifiers, notes, and live price preview
Cart with delivery / pickup toggle, ETA, and a minimum-order hint
Checkout with delivery address and a 4-way tip selector (None / 10% / 15% / 20%)
Live order tracking via Supabase Realtime, from Confirmed to Delivered
Server-authoritative place_order RPC with Supabase Auth, RLS, and preview mode

Use this template

What you can do

A complete single-restaurant ordering app (Olive & Ember) built with Expo/React Native and Supabase. Customers browse a sectioned menu, customise dishes with modifiers and special instructions, build a cart, choose delivery or pickup, add a tip, place an order, and track it live to delivery. It runs on your own Supabase project, so it opens on a Connect screen until you add your URL and anon key and apply the schema (there's a 'Preview with sample data' button to look around first); it does not work the moment you open it without a backend. Checkout is server-authoritative: a SECURITY DEFINER place_order function reprices the cart from the database, so totals can't be forged.

Made forSingle restaurants and food businesses that want their own branded mobile ordering app backed by a Supabase project they control.

Browse a sectioned menu with a restaurant hero (name, cuisine, rating, ETA), sticky category pills that jump to each section, and quick-add dish rows
Customise any dish with single-select modifiers (e.g. Size) and multi-select add-ons, a special-instructions note, and a quantity stepper, with a running price preview
Build a cart with a delivery / pickup toggle, ETA, line-item modifiers and instructions, quantity steppers, and a minimum-order hint
Check out with a delivery address and a 4-way tip selector (None / 10% / 15% / 20%) over a full, server-mirrored breakdown
Track an order live as the kitchen advances it through Confirmed > Preparing > Out for delivery > Delivered, with ETA, address, and an itemised receipt
Review order history with status chips and tap any order to track it
Sign in / sign up with email and password via Supabase Auth, with carts and orders kept private to each customer
Forge-proof checkout: prices are recomputed in the database (never trusted from the client) and the cart clears in one transaction
Look around before connecting a backend via an opt-in sample-data preview that is never shown once real keys are present

Under the hood

For developers: exactly what is included when you start from this template, taken straight from the template's own code.

Stack

Expo SDK 54React Native 0.81.5React 19.1.0TypeScript ~5.9.2Supabase (@supabase/supabase-js ^2.45.0) for Auth, Postgres, and Realtimereact-native-safe-area-context ~5.6.0react-native-svg 15.12.1react-native-web ^0.21.0 (Metro web bundler)Hand-rolled useState router (no navigation library) and a useSyncExternalStore cart store; money handled as integer cents throughout

Screens

Connect
Shown until Supabase is configured: explains how to connect a backend and offers an optional 'Preview with sample data' button to explore without one.
Auth
Email/password sign-in and sign-up via Supabase; sign-up passes a display name written into the customers row.
Menu
The storefront: restaurant hero, sticky category pills that track scroll, the sectioned dish list with quick-add, and a sticky cart bar.
Item Detail
A dish with single-select (radio) and multi-select (checkbox) modifier groups, a special-instructions note, a quantity stepper, and a running price preview.
Cart
Review the order: delivery / pickup toggle with ETA, line items with modifiers and instructions, quantity steppers, a minimum-order hint, and a running summary.
Checkout
Confirm fulfillment (with delivery address), pick a tip (None / 10% / 15% / 20%), review the full total, and place the order.
Orders
Order history with status chips; tap an order to track it.
Order Tracking
Live status stepper (Confirmed > Preparing > Out for delivery > Delivered) updated in real time, with ETA, fulfillment/address, itemised order, and totals; cancelled orders get a dedicated state.
Account
Customer greeting, the restaurant you're ordering from, settings scaffold rows (saved addresses, payment methods), and sign out.

Data model

customers
One row per signed-in user (mirrors auth.users) holding email and display name; created automatically on signup.
restaurant
Single-row config for the one restaurant: name, cuisine, hero image, rating, ETA range, open-until, delivery fee, and minimum order.
menu_categories
Menu sections with a sort order and a maintained item_count.
menu_items
Dishes with name, description, price (cents), image, tag, availability flag, and sort order, each belonging to a category.
modifier_groups
Per-item option groups marked single- or multi-select and optionally required (e.g. Size, Add-ons).
modifier_options
Individual choices within a modifier group, each with a price delta in cents.
cart_items
A customer's cart lines: item, quantity, and special instructions.
cart_item_modifiers
The chosen modifier options attached to each cart line (unique per line+option).
orders
Placed orders with a unique reference, status, fulfillment, address, subtotal/delivery/tip/total (cents), tip percentage, and ETA; created only by place_order.
order_items
Line snapshots taken at order time: name, quantity, unit price (cents), a modifiers summary, and instructions.

Backend

Row Level Security on all 10 tables: customers/cart/orders are scoped to auth.uid() (a customer sees only their own row, cart, and orders); cart_item_modifiers and order_items are reachable only through a parent row the user owns; restaurant, menu_categories, menu_items, modifier_groups, and modifier_options are public-read with no client write policy (manage via the dashboard or service-role tooling).
Trigger handle_new_customer (on auth.users via on_auth_user_created): SECURITY DEFINER, inserts the customers row on signup using the display_name from user metadata (falling back to the email local-part).
Trigger bump_item_count (on menu_items via trg_item_count): SECURITY DEFINER, keeps menu_categories.item_count in sync on insert, delete, and category change.
SECURITY DEFINER RPC place_order(p_fulfillment, p_tip_pct, p_address): server-authoritative checkout granted to authenticated users - validates fulfillment/tip/required-modifier/min-order rules, refuses unavailable items, reprices the cart from menu_items + modifier_options, computes the tip from the percentage, snapshots order_items, and clears the cart in one transaction; customers have no insert policy on orders so they cannot forge orders or totals.
Realtime: the app subscribes to exactly two tables - cart_items (multi-device cart sync; REPLICA IDENTITY FULL so delete payloads carry customer_id) and orders (live status on the tracking screen).
No Storage buckets and no Edge Functions are included. Only the Supabase anon key ships in the app (safe behind RLS); no real payment is captured - gate place_order behind a verified payment before going live.

More templates

All templates

Commerce

Ecommerce Store

A clean storefront for any brand

View template

Social

Photo Journal App

One photo a day, with your friends

View template

Social

Social Feed App

An Instagram-style starter: feed, stories, likes, comments, follows, and an activity inbox

View template

Social

Live Streaming App

Broadcast yourself, watch others live

View template

Built with Appsanic

Restaurant Ordering App

Menus and ordering in your pocket

Sectioned menu with restaurant hero, sticky category pills, and quick-add rows
Item detail with single/multi-select modifiers, notes, and live price preview
Cart with delivery / pickup toggle, ETA, and a minimum-order hint
Checkout with delivery address and a 4-way tip selector (None / 10% / 15% / 20%)
Live order tracking via Supabase Realtime, from Confirmed to Delivered
Server-authoritative place_order RPC with Supabase Auth, RLS, and preview mode

Use this template

What you can do

Made forSingle restaurants and food businesses that want their own branded mobile ordering app backed by a Supabase project they control.

Browse a sectioned menu with a restaurant hero (name, cuisine, rating, ETA), sticky category pills that jump to each section, and quick-add dish rows
Customise any dish with single-select modifiers (e.g. Size) and multi-select add-ons, a special-instructions note, and a quantity stepper, with a running price preview
Build a cart with a delivery / pickup toggle, ETA, line-item modifiers and instructions, quantity steppers, and a minimum-order hint
Check out with a delivery address and a 4-way tip selector (None / 10% / 15% / 20%) over a full, server-mirrored breakdown
Track an order live as the kitchen advances it through Confirmed > Preparing > Out for delivery > Delivered, with ETA, address, and an itemised receipt
Review order history with status chips and tap any order to track it
Sign in / sign up with email and password via Supabase Auth, with carts and orders kept private to each customer
Forge-proof checkout: prices are recomputed in the database (never trusted from the client) and the cart clears in one transaction
Look around before connecting a backend via an opt-in sample-data preview that is never shown once real keys are present

Under the hood

For developers: exactly what is included when you start from this template, taken straight from the template's own code.

Stack

Screens

Connect
Shown until Supabase is configured: explains how to connect a backend and offers an optional 'Preview with sample data' button to explore without one.
Auth
Email/password sign-in and sign-up via Supabase; sign-up passes a display name written into the customers row.
Menu
The storefront: restaurant hero, sticky category pills that track scroll, the sectioned dish list with quick-add, and a sticky cart bar.
Item Detail
A dish with single-select (radio) and multi-select (checkbox) modifier groups, a special-instructions note, a quantity stepper, and a running price preview.
Cart
Review the order: delivery / pickup toggle with ETA, line items with modifiers and instructions, quantity steppers, a minimum-order hint, and a running summary.
Checkout
Confirm fulfillment (with delivery address), pick a tip (None / 10% / 15% / 20%), review the full total, and place the order.
Orders
Order history with status chips; tap an order to track it.
Order Tracking
Live status stepper (Confirmed > Preparing > Out for delivery > Delivered) updated in real time, with ETA, fulfillment/address, itemised order, and totals; cancelled orders get a dedicated state.
Account
Customer greeting, the restaurant you're ordering from, settings scaffold rows (saved addresses, payment methods), and sign out.

Data model

customers
One row per signed-in user (mirrors auth.users) holding email and display name; created automatically on signup.
restaurant
Single-row config for the one restaurant: name, cuisine, hero image, rating, ETA range, open-until, delivery fee, and minimum order.
menu_categories
Menu sections with a sort order and a maintained item_count.
menu_items
Dishes with name, description, price (cents), image, tag, availability flag, and sort order, each belonging to a category.
modifier_groups
Per-item option groups marked single- or multi-select and optionally required (e.g. Size, Add-ons).
modifier_options
Individual choices within a modifier group, each with a price delta in cents.
cart_items
A customer's cart lines: item, quantity, and special instructions.
cart_item_modifiers
The chosen modifier options attached to each cart line (unique per line+option).
orders
Placed orders with a unique reference, status, fulfillment, address, subtotal/delivery/tip/total (cents), tip percentage, and ETA; created only by place_order.
order_items
Line snapshots taken at order time: name, quantity, unit price (cents), a modifiers summary, and instructions.

Backend

Row Level Security on all 10 tables: customers/cart/orders are scoped to auth.uid() (a customer sees only their own row, cart, and orders); cart_item_modifiers and order_items are reachable only through a parent row the user owns; restaurant, menu_categories, menu_items, modifier_groups, and modifier_options are public-read with no client write policy (manage via the dashboard or service-role tooling).
Trigger handle_new_customer (on auth.users via on_auth_user_created): SECURITY DEFINER, inserts the customers row on signup using the display_name from user metadata (falling back to the email local-part).
Trigger bump_item_count (on menu_items via trg_item_count): SECURITY DEFINER, keeps menu_categories.item_count in sync on insert, delete, and category change.
SECURITY DEFINER RPC place_order(p_fulfillment, p_tip_pct, p_address): server-authoritative checkout granted to authenticated users - validates fulfillment/tip/required-modifier/min-order rules, refuses unavailable items, reprices the cart from menu_items + modifier_options, computes the tip from the percentage, snapshots order_items, and clears the cart in one transaction; customers have no insert policy on orders so they cannot forge orders or totals.
Realtime: the app subscribes to exactly two tables - cart_items (multi-device cart sync; REPLICA IDENTITY FULL so delete payloads carry customer_id) and orders (live status on the tracking screen).
No Storage buckets and no Edge Functions are included. Only the Supabase anon key ships in the app (safe behind RLS); no real payment is captured - gate place_order behind a verified payment before going live.