Case study / v1.0.0 released storefront prototype

HYD VNTG Storefront

A responsive synthetic streetwear storefront with a safe local order preview and fail-closed provider boundaries.

Repository ↗

Problem

Small catalog prototypes need a credible browse-to-order workflow without implying payment, inventory, or messaging integrations are live.

Target user

Reviewers evaluating a bounded storefront and order-preparation workflow.

Solution

A responsive React storefront with deterministic single-unit fixtures, local product media, an explicit not-sent message preview, and optional provider adapters that stay disabled until configured.

Personal contribution

Built and qualified the storefront workflow, removed placeholder handoffs, hardened local and Supabase admin boundaries, added deterministic tests, and published narrated release evidence.

Architecture

Boundaries before buzzwords.

React client with deterministic local catalog fixtures
Local message-preview boundary with optional validated WhatsApp handoff
Optional Supabase adapter with server-assigned admin-role policy reference
Repository-local catalog and walkthrough media

Main workflow

State moves with a reason.

01
Browse and filter the synthetic catalog
02
Inspect stock and choose a size
03
Enter synthetic delivery details
04
Generate a local preview explicitly marked not sent
05
Inspect the fail-closed admin boundary

Technical decisions

The trade-offs that define the system.

No placeholder WhatsApp or Instagram destination
Unconfigured and unauthorized admin paths fail closed
Supabase mutations never silently fall back to local writes
No payment or fake order-success state

Difficult engineering challenge

The product needed to demonstrate a complete storefront interaction while keeping every external commerce, messaging, inventory, and authorization claim visibly bounded.

Verification

Evidence and boundaries.

Testing

9 deterministic unit tests
3 applicable desktop/mobile Playwright workflows
Vite production build and Storefront CI
0 known npm vulnerabilities

Security and privacy

Client-side local admin remains a browser-only demonstration boundary
Supabase mode requires a server-assigned app_metadata admin role
WhatsApp opens only for an explicitly configured 10-15 digit destination

Known limitations

No payment, reservation, fulfillment, customer account, live inventory, or production order backend
Supabase policy deployment and provider ownership are not claimed