Web Application Development
An online menu platform with a built‑in automated inventory system that tracks stock levels in real time — logging items in and out as they’re added or sold — and instantly updates availability.
View on Github
Kopi82 is an online menu platform featuring a real-time, automated inventory system. It tracks stock levels dynamically, updating item availability instantly as items are added or sold, streamlining operations for the business.

Key features include a dynamic online menu, automated stock tracking, real-time availability updates, and an admin dashboard for inventory management. Built with React, Next.js, Typescript, and Supabase for a robust and scalable solution. The system ensures seamless updates for both customers and staff, minimizing order errors and improving service efficiency. Its modern tech stack allows for easy integration with future features such as customer analytics and order history tracking.
One of the first things we were tasked to do in our Software Engineering 1 class was to find a company and solve a problem they had. Upon consulting with Kopi82, we were explicitly requested to create an online menu for their cafe, which would make it easier for customers to see what was available and order from their seats. We also learned that they had a manual inventory system, which was prone to human error and inefficiencies. We proposed a solution that would not only create an online menu but also automate their inventory system. The first step was creating a prototype on Figma of the design we wanted to implement. We went with a neutral coffee-themed palette to match the cafe's aesthetic. We also chose to make the interface as straightfoward as possible in order to put accessibility above all else, all while not compromising on the design.
The frontend was developed using React with Next.js and TypeScript, ensuring a type-safe and efficient development process. Supabase powers the backend, providing real-time database updates and secure authentication. For design, Figma was utilized to create intuitive UI/UX prototypes and maintain a consistent design system. Styling was handled with CSS modules, enabling component-scoped styles for better modularity and maintainability.
8 months
Aug 2024 - Dec 2024
Ivan James Lo
Mary Vee Magsigay
Frontend Development
Backend Development
UI/UX Design