What is this?
Sizzle POS is a custom-built, browser-based point of sale system designed to explore real-time ordering, kitchen bump screens, and fast-paced hospitality workflows.
The system runs entirely in the browser and syncs instantly between the POS interface and kitchen screens using Firebase — no page refreshes, no manual updates.
How it Works
Orders are created through the POS interface and written directly to Firestore. Kitchen screens listen for live updates and display orders instantly as they arrive.
When an order is completed, it’s “bumped” from the system, keeping the workflow clean and fast during busy service periods.
Live Orders
Instant POS → kitchen sync
Bump Screen
Touch-friendly kitchen display
Menu Builder
Dynamic items and pricing
Realtime Backend
Powered by Firebase
// Create a new order
await addDoc(collection(db, "sizzleOrders"), {
sessionId,
orderNumber,
items: currentOrder,
created: Date.now()
});
// Listen for live orders (POS & Kitchen)
onSnapshot(
query(
collection(db, "sizzleOrders"),
where("sessionId", "==", sessionId)
),
snapshot => {
snapshot.forEach(docSnap => {
renderOrder(docSnap.id, docSnap.data());
});
}
);
// Bump order when completed
await deleteDoc(
doc(db, "sizzleOrders", orderId)
);
Designed for Speed
Sizzle POS was built with speed and clarity in mind — large touch targets, minimal friction, and instant feedback for both front-of-house and kitchen staff.
Challenges & Solutions
One of the biggest challenges was keeping multiple screens perfectly in sync without introducing lag or complex state management.
Using Firestore’s real-time listeners allowed the system to behave like a live service without needing a traditional backend server.
What I Learned
This project strengthened my understanding of real-time databases, transactional UI flows, and designing tools that work under real-world pressure.
It also highlighted how powerful browser-based systems can be when paired with the right backend architecture.