Restaurant · Floor operations
Grill Perrón OS
Order taking and a kitchen display for a birria restaurant, synced in real time across devices.
- Client
- Grill Perrón, birria restaurant
- Role
- Product design and full-stack development
- Year
- 2026
- Stack
- Astro 7 · React 19 · TypeScript · Tailwind CSS 4 · nanostores · BroadcastChannel API
The problem
At peak hours the waiter writes orders by hand, walks to the kitchen and repeats them out loud. Dishes get forgotten, the grill and the bar don't know what comes next, and nobody knows how long each table has been waiting.
The solution
A tablet app where the waiter builds the order per table, and a kitchen display system (KDS) that receives it instantly, split by station. Each station marks its part as ready and the waiter sees it on the tablet without anyone shouting.
Highlights
- Cross-device sync in under 100 ms using BroadcastChannel, with a localStorage fallback.
- Kitchen display per station (kitchen, grill and bar) with timers and late-order alerts.
- The full waiter flow, from opening a table to closing the check — 12-table floor map, order composer, tracking and payment.
- A two-device auto tour that presents the system hands-free.
- Deterministic initial state, so every demo starts with the same tables and orders.
Demo entry points
- Auto tour The waiter's tablet and the kitchen display side by side, with an order that moves on its own.(opens in a new tab)
- Waiter Pick a waiter, open a table and send an order.(opens in a new tab)
- Kitchen Open it in a second tab next to the waiter view and watch each order arrive.(opens in a new tab)
How it's built
Island architecture. The site is built with Astro and only hydrates what needs state: the table map, the order composer, the kitchen display and the auto tour are React islands. Everything else ships as static HTML.
A single source of truth. Tables, orders and the session live in nanostores. Every change is published on a BroadcastChannel; other tabs or devices apply the same event and converge on the same state. When the channel is unavailable, a versioned envelope in localStorage acts as a fallback and survives reloads.
Designed for the floor. Large one-handed touch targets, type that reads from two meters away on the kitchen screen, and status colors that are also distinguished by text and icons.
An honest demo. There is no backend and no login: everything runs in the browser. To see the sync, open the waiter view and the kitchen view in two tabs.
Screens
