All works
Megatha Restaurant App
AIPOSNext.jsTailwind CSSPOS

Megatha Restaurant App

Wayan Phantom Megaditha

Wayan Phantom Megaditha

Fullstack Developer

Live ↗GitHub ↗

The Problem

The restaurant was running on paper tickets and a whiteboard for table status. Staff were making decisions without shared context. During busy service, orders got lost, tables sat empty while guests waited at the door, and the kitchen had no reliable view of what was coming. The problem was not that they lacked technology. It was that everyone on the floor was working from different information at the same time, and no one had a single shared view of the current state of service.


How It Works

  1. Staff take orders on a tablet via the POS screen. They browse the menu by category, select items, add modifier notes, and send to the kitchen in a single flow.
  2. The floor plan screen shows live table status with color coding: available, occupied, bill requested. Any staff member with a tablet can see the current state.
  3. The kitchen display receives incoming orders in sequence. New orders appear at the top. The kitchen team marks items as in progress and completed.
  4. State is managed with Zustand. Every update from any device is broadcast via WebSocket so all connected tablets stay in sync without polling.
  5. Order state is cached locally so a network drop during service does not lose an in-progress order.

Tech Stack

Next.jsPOS and floor plan are route segments sharing state through Zustand
ZustandMuch less boilerplate than Redux for a real-time POS state shape
PostgreSQLRelational model with ACID transactions for order and menu data
WebSocketReal-time kitchen sync, polling would add perceptible lag during service
Tailwind CSSLarge tap targets throughout for 10-inch tablet use in kitchen environments

What I Would Improve

The WebSocket server is a simple Node process. Under a real production load with multiple concurrent connections it would need a proper message broker like Redis pub/sub to stay reliable. The menu management is hardcoded in a config file. A backend with a simple menu editor would let the restaurant manager update prices and 86 items without a developer. Reporting is missing. A simple end-of-day summary showing covers, average ticket size, and top items would add significant operational value for a restaurant manager.

Screenshots

Wayan Phantom Megaditha

Wayan Phantom Megaditha

Fullstack Engineer · AI & Web3

Next.jsTailwind CSSPOSRestaurantFull-stack