Selene Luna Store

A complete e-commerce for a leather goods brand in Córdoba: public storefront, admin panel and live Mercado Pago payments, all in one Next.js app. Built, shipped and operated end to end, and designed on one principle: nothing the customer's browser sends is ever trusted with money.

Role
Studio build, solo: storefront, admin, payment integration and operations.
Stack
Next.js 16 · React 19 · Supabase (RLS) · Mercado Pago · Cloudflare R2
Status
In production, taking real payments

A small brand selling leather handbags and boots ran on Instagram and WhatsApp: catalog in a spreadsheet, orders in chat, stock in someone's head. It needed a real store, with a browsable catalog, stock per color and size, online payment, and a panel the owner could run alone, without touching code.

And a store that takes real money has a second, quieter requirement: every number arriving from the customer's browser has to be treated as hostile.

One Next.js 16 app serves two worlds, separated by route groups: the public storefront, and an admin panel where the owner manages products with per-variant stock, the order pipeline, customers, suppliers and the store's own configuration, shipping zones, coupons and payment methods included, all without a deploy.

  • The sale price is computed in exactly one place: cost plus freight per unit, target margin, grossed up so the margin survives Mercado Pago's commission, rounded to the local ".900" price convention.
  • The catalog is seeded from the owner's own inventory spreadsheet plus photos organized by SKU, through an idempotent script. The tool the owner already trusts stays the source of truth.

Admin access is guarded twice: a proxy verifies the JWT server-side on every admin request, and every server action re-checks the admin before mutating anything. The database has row-level security on all eight tables; the public storefront can only read visible products, their photos and the store config.

The money paths assume the client is lying. The order endpoint recomputes every total server-side against fresh product data, so a tampered price can never reach the database. The Mercado Pago webhook validates the HMAC signature, re-queries the payment against Mercado Pago's own API instead of trusting the notification body, and compares the amount actually paid against the stored order total before the order advances. Stock is decremented atomically in SQL, idempotent under webhook retries.

  • Order numbers are sequential, so confirmation pages would be enumerable. Each one is protected by a random per-order token instead.
  • Money is stored as integer pesos end to end. No floating point near a price.
screenshots coming soon
Application
One Next.js 16 app (React 19): public storefront plus admin panel, separated by route groups.
Payments
Mercado Pago Checkout Pro, live. HMAC-signed webhook, payment re-queried server-side, paid amount cross-checked against the order.
Data
Supabase Postgres, eight tables, row-level security on all of them. Public read limited to visible products, photos and config.
Stock
Tracked per color and size, decremented atomically in SQL, idempotent under retries.
Catalog pipeline
Idempotent seed from the owner's inventory spreadsheet plus product photos by SKU.
Media
Product photos on Cloudflare R2.
Test coverage
377 automated tests across 36 files, on business logic extracted into pure modules.

The store is live and the owner runs it alone: loads products, manages orders, adjusts prices and configuration, no developer in the loop. It closes the full arc I offer: a brand with no web presence to an online business taking real payments, designed, built and operated by one person.

Livein production, with real Mercado Pago payments verified
377automated tests on the business logic, prices and stock included
0client-sent amounts trusted anywhere on the money path