← Todos los proyectos
Producción

The Moment

Una plataforma de comercio electrónico en producción para una panadería artesanal, construida como un monorepo multi-marca que impulsa tres sitios de negocios desde un solo codebase.

Situación

Una pequeña panadería artesanal tomando pedidos principalmente por teléfono y mensaje de texto. Productos de alta demanda con producción limitada, lo que significa ventanas de pedido específicas y necesidad de gestión de cumplimiento. La base de clientes estaba creciendo, y los procesos manuales ya no escalaban. Al mismo tiempo, el mismo equipo de ingeniería (yo) estaba construyendo sitios para otras dos marcas.

El Problema

Necesitaban más de lo que Shopify podía ofrecer de fábrica: ventanas de pedidos personalizadas, gestión de cumplimiento a través de un panel visual, procesamiento de pagos con tarjeta y por transferencia, y un catálogo de productos que pudieran actualizar sin llamarme cada vez.

Tres repositorios separados para tres marcas no iba a funcionar. Necesitaba infraestructura compartida con identidades de marca distintas.

Lo Que Hice

Configuré un monorepo de Turborepo: los tres sitios de marca, una biblioteca de componentes compartida, un sistema de tokens de diseño con variables CSS por marca, y un estudio de Sanity CMS. Los pipelines de build en paralelo mantienen todo rápido.

El flujo de comercio electrónico cubre el ciclo completo: catálogo en Sanity, carrito de compras con estado en tiempo real, checkout en múltiples pasos, pagos duales (Square para tarjetas, Interac e-Transfer por correo electrónico), y un panel de administración con gestión de pedidos estilo Kanban que se actualiza en tiempo real a través de suscripciones de Supabase.

hoodii-platform/
├── apps/
│   ├── themoment-site      Customer-facing e-commerce (port 3002)
│   ├── themoment-admin      Order management dashboard (port 3004)
│   ├── hoodii-site          Portfolio site (port 3001)
│   ├── brixel-site          Construction coordination (port 3003)
│   └── studio               Sanity CMS (port 3333)
├── packages/
│   ├── ui                   60+ shared React components
│   ├── tokens               Design system (per-brand CSS variables)
│   ├── motion               Animation primitives
│   ├── forms                Validated form components
│   ├── seo                  Metadata generators
│   └── env                  Type-safe environment validation
└── tests/
    ├── smoke/               Health checks across all systems
    ├── e2e/                 38 end-to-end customer + admin tests
    └── accessibility/       WCAG compliance checks

Resultado

Una plataforma de comercio electrónico completa en producción, con actualizaciones en tiempo real, cobertura de pruebas end-to-end y un pipeline de build que ahora impulsa cuatro marcas distintas. La bakery maneja su catálogo a través de Sanity. Los pedidos fluyen a través del panel de administración. El sistema sigue funcionando.

6 apps

Ejecutándose desde un solo monorepo

60+ components

Biblioteca UI compartida con docs en Storybook

38 E2E tests

Cobertura completa de cliente y admin

2 métodos de pago

Square + Interac e-Transfer

Admin en tiempo real

Tablero Kanban con actualizaciones en vivo

Builds < 2 min

Pipeline con caché de Turborepo

Stack Tecnológico

Frontend

  • Next.js 14
  • React 18
  • TypeScript
  • Tailwind CSS
  • Framer Motion

CMS

  • Sanity.io
  • Portable Text
  • Image CDN

Backend

  • Supabase (PostgreSQL)
  • Row-Level Security
  • Real-time Subscriptions

Payments

  • Square SDK
  • Interac e-Transfer
  • Nodemailer

Testing

  • Playwright
  • Axe-core
  • Page Object Model
  • 38 E2E tests

Infrastructure

  • Turborepo
  • Vercel
  • PNPM Workspaces
  • Sentry
← Todos los proyectosSiguiente: Operations Hub →