Stefcos · Product builder
Stefcos, an e-commerce site with its own order back-office
Online store for a cosmetics brand for Black and mixed-race skin, built with Claude Code, plus a dashboard that replaces manual order re-entry.
- Role
- Product builder
- Period
- Dashboard delivered in April 2026
- Tools
- Claude Code, React, TypeScript, Supabase, Resend, GitHub Actions
- Team
- Me, Claude Code, the brand's assistant (main user)
Context
Stefcos is a cosmetics brand for Black and mixed-race skin, based in Lomé, Togo. The site presents the store, the brand philosophy and a journal, and takes orders online.
The site was built with Claude Code and deploys automatically to GitHub Pages through GitHub Actions. An admin dashboard was added in April 2026.
The problem
Orders came in through WhatsApp Business. The assistant re-entered them one by one in a Google Sheet connected through Apps Script, which also tracked deliveries and couriers.
- Every order was entered twice: in WhatsApp, then in the spreadsheet.
- Tracking lived in a tool separate from the site, with no overview of the business.
- No consolidated metrics: revenue, orders awaiting payment or out for delivery.
My role
Product framing
Defining the need, prioritizing features, designing the ordering and admin journeys.
Architecture
Choosing the stack: React and TypeScript for the front end, Supabase for authentication, database, row-level security and storage, Resend for emails.
Steering Claude Code
Writing the prompts, breaking the work down, reviewing the generated code at every step.
Testing and evolution
Functional testing before every release, then all the technical evolution of the product over time.
Approach
AI writes the code; the product work stays the same: understand real usage, break it down, validate.
- 01
Observe the existing flow
Start from the assistant's real workflow: WhatsApp, spreadsheet, couriers. The dashboard had to mirror her habits, not impose new ones.
- 02
Build the store
A site in React 18, TypeScript, Vite, React Router, Tailwind, shadcn/ui and TanStack Query, continuously deployed to GitHub Pages.
- 03
Add the back-office
Authentication, database and row-level security rules on Supabase; transactional emails with Resend.
- 04
Test and iterate
Testing before every release, then improvements for the assistant, who manages orders day to day.
Deliverables
Impact
Order tracking now lives inside the site, in three tabs.
- Key metrics and revenue in FCFA: today, this month, total, average basket.
- Orders: search, filters by status, payment and period, creation and editing.
- Couriers: area, availability and today's deliveries.
- No more re-entering orders in a separate spreadsheet.
Learnings
- With AI, the bottleneck is no longer writing code but framing well: a vague prompt produces a vague product.
- A good back-office mirrors the user's existing habits before adding new ones.
- Owning the architecture and security (row-level rules, authentication) is still human work.
