POS Development • Inventory Management • Web Development

Sorella Tea POS & Inventory System

A touch-friendly POS and inventory management system designed for milk tea and beverage businesses — order management, payment processing, inventory tracking, product costing, profit monitoring, and customizable business workflows.

HTML5CSS3JavaScriptGitHubNetlifyLive Demo Available

Touch-first

Designed for tablets at the counter

Cash + GCash

Payment flows with automatic change

Inventory

Ingredient and stock tracking built in

Costing

Product costing and profit monitoring

Overview

A practical business system, not just an ordering app

Sorella Tea POS covers the full daily flow of a beverage business: taking orders on a touch-friendly menu, applying discounts, processing cash or GCash payments with automatic change calculation, and keeping inventory, costing, and profit figures in sync behind the counter.

The system follows the real business chain: Business Process → POS → Inventory → Costing → Payment → Reporting → Customization. Every part is built to be adapted — menus, sizes, prices, recipes, payment methods, and reports can all change without rebuilding the system.

Portfolio Demo: This is a demonstration system. POS features, menu, pricing, recipes, inventory, payment workflows, reports, and integrations can be customized according to each client's requirements.

Features

Key features

Touch-friendly ordering

Large, tablet-ready menu tiles with category and series filters for fast counter service.

Sizes & variants

Products support size and variant selection so one menu item covers 12, 16 and 22 oz options.

Payments & change

Cash payment with automatic change calculation, plus an online/GCash payment workflow.

Order management

Review, hold, and complete orders from a dedicated order summary panel.

Inventory tracking

Ingredient and stock levels tracked alongside sales so shortages are visible early.

Costing & profit

Product costing and profit monitoring show which drinks actually make money.

Customizable menu

Menus, categories, and pricing can be adjusted without touching the underlying system.

Workflow customization

Business-specific workflows — from discounts to reports — adapt to each client's process.

Customization

Built for customization

This is a customizable business solution that can be adapted to different client requirements — not a fixed milk tea app.

Menu and categories

Product sizes and variants

Pricing

Recipes and ingredient quantities

Inventory structure

Payment methods

Reports and dashboards

Business-specific workflows

Automation integrations

Interface

Inside the POS

The live interface — click to view it full size.

Capability

Skills Demonstrated

The concrete technical skills applied while planning, building, and shipping this project.

Front-end application structure

State management for orders and cart

Payment and change-calculation logic

Discount and totals computation

Inventory and ingredient data modeling

Costing and profit calculations

Touch-friendly, responsive UI design

Deployment and version control

Engineering

Technical Challenges Solved

Real problems hit during the build — and how each one was diagnosed and resolved.

Problem

Order totals had to stay accurate across sizes, variants, discounts, and mixed payment types.

How I solved it

Centralized all pricing in one computation path so every change to the order — size switch, discount, or removal — recalculates from a single source of truth.

Problem

Counter staff need speed, so small touch targets slowed ordering down.

How I solved it

Designed the interface tablet-first with large menu tiles, category filters, and one-tap actions, then verified the layout on phone and desktop widths.

Problem

Cash payments are error-prone when change is computed mentally.

How I solved it

Added automatic change calculation with quick cash buttons, so the cashier enters or taps the amount received and the change is shown instantly.

Problem

Inventory and costing drift apart when they live in separate spreadsheets.

How I solved it

Linked menu items to their recipes and ingredient quantities so sales, stock levels, and profit monitoring update from the same order data.

Stack

Built with

HTML5 CSS3 JavaScript Git GitHub Netlify

Outcome

Why it matters

A working POS a real beverage business can run at the counter

End-to-end coverage: ordering, payments, inventory, costing, reporting

Architecture built to be customized per client, not hardcoded to one menu

Demonstrates practical business-system thinking, not just a landing page

Live and publicly testable — clients can try the demo themselves

Growth

Lessons Learned

Building this POS system sharpened my skills in:

JavaScript application logicOrder & cart state managementPayment flow designInventory data modelingCosting calculationsTouch-first responsive UIBusiness workflow thinkingClient-ready customization design

Need a system like this for your business?

This POS is a demonstration of how I build practical business systems — menus, payments, inventory, and reports shaped around your actual workflow. Let's talk about yours.