← All work

A specialty-coffee storefront with the admin panel that runs it.

Project Type
Client Work
Stack
Full-stackDatabaseDockerUX/UI
Year
2026
Status
Built, not launched

Case study

  1. Overview

    Coffee Shop Website, a client engagement where I was the product designer and the full-stack developer. It is a storefront plus the admin panel that runs it, built full-stack with its own database, UX/UI and Docker packaging.

  2. Problem

    The client had a product line and no way to sell it online or see where the business stood day to day. Every sale, every stock check, every new customer was invisible to him.

  3. Research

    I worked from what the client already had, his product line, his branches, and the way he described a day of trading, and looked at the ready-made e-commerce platforms he could have signed up for instead. Those would have put a store online quickly, but none of them gave him his own control panel or a design built around his brand, which was what he was asking for.

  4. Process

    I built both sides at once, storefront and admin, so the catalogue a customer browses and the products the owner edits are the same records. The template platform is the alternative I rejected, for the reason above. On the storefront an out-of-stock product stays visible but dimmed with its button disabled instead of vanishing from the grid, so the catalogue never silently changes shape; on the admin side an activity log means nothing changes without a trace.

  5. Result

    A finished storefront and admin panel, packaged in Docker as a portable unit. The shots below are split into the two sides: what the customer sees, and what the owner runs the shop from.

  6. Impact

    The build is complete and parked one step from launch, because the payment gateway and delivery integration need API keys only the client can issue, so there is no live trading figure to report yet.

  7. Takeaway

    This is where I first used APIs, payment gateways and delivery interfaces for real, and learned to package a whole app with Docker so it is easy to hand off and move. What I would change: get the gateway and delivery accounts opened at the start of the project rather than the end, since that dependency is what is holding a finished build offline.

Storefront, what the customer sees

Home: the hero, three entry points, best sellers that add to the cart from the card itself, and the four-step sourcing story.
Home: the hero, three entry points, best sellers that add to the cart from the card itself, and the four-step sourcing story.
Catalog: category filter, search and sort. A product that is out of stock stays visible but dimmed with its button disabled, rather than disappearing from the grid.
Catalog: category filter, search and sort. A product that is out of stock stays visible but dimmed with its button disabled, rather than disappearing from the grid.

Admin panel, what the owner runs the store from

Admin overview: 30 days of sales, new customers, low stock, the recent orders queue, and stock alerts.
Admin overview: 30 days of sales, new customers, low stock, the recent orders queue, and stock alerts.
Sales: daily, weekly and monthly views, with revenue and VAT broken out per day under the chart.
Sales: daily, weekly and monthly views, with revenue and VAT broken out per day under the chart.
Products: the full catalogue with category, price and active state, filtered by the same categories the storefront uses.
Products: the full catalogue with category, price and active state, filtered by the same categories the storefront uses.
Branches: address, map location and opening hours per branch, added from the same panel.
Branches: address, map location and opening hours per branch, added from the same panel.