Gigante de los Azulejos
Ecommerce de azulejos y mármoles conectado al sistema que la empresa ya usaba.
Desarrollé el ecommerce de Gigante de los Azulejos: la tienda en línea de azulejos y mármoles y la aplicación web con la que el equipo la administra. Lo diseñé alrededor de una integración con el sistema que la empresa ya usaba, para que el catálogo y los precios nunca se desactualicen.
- Mi rol
- Arquitectura, backend, integraciones y despliegue
- Sector
- Retail / Construcción
- Alcance
- Ecommerce + App web
- 8 meses
- Duración del proyecto
- 2 sistemas
- Ecommerce + panel admin
- Por distancia
- Cálculo del costo de envío
- Stripe + Google Maps
- Integraciones externas
Stack
- Next.js 15
- Tailwind CSS
- React (Vite)
- Node.js
- Express
- TypeScript
- MongoDB
- Docker
- Dokploy (CD/CI)
- MinIO
- Stripe
- Google Maps
Pantallas
Capturas del sistema real en operación.
Ecommerce
Catálogo con filtros, lista de deseos, carrito y pago con tarjeta. Envíos calculados por distancia y buscador de sucursales.
App web
Aplicación web de administración
Conexión con el sistema que ya usaban, y manejo de productos, fotos, promociones, categorías y sucursales.
El problema
El catálogo y los precios de Gigante de los Azulejos ya vivían en el sistema interno que el equipo usaba todos los días. Una tienda en línea con su propia base de productos habría significado capturar todo dos veces y quedar desfasada la primera semana. Además, el envío no podía ser tarifa plana: el costo depende de qué tan lejos vive el cliente, y el comprador necesita saber qué sucursal tiene más cerca.
Lo que construí
Entregué dos sistemas: la tienda en línea y la aplicación web de administración. El punto de partida fue la integración: el panel se conecta con el sistema que la empresa ya usaba, así que productos y precios se sincronizan solos y nadie los recaptura. Sobre esa base construí el catálogo con buscador, filtros, lista de deseos, carrito y pago con tarjeta vía Stripe, con promociones de portada que enlazan directo a los productos en oferta. El costo del envío se calcula por distancia con Google Maps, que también alimenta el buscador de sucursales cercanas. Lo que el sistema interno no cubría —fotos, promociones, categorías, fichas técnicas y sucursales— se administra desde el panel. Ocho meses de proyecto.
Decisiones técnicas
- 01
El sistema interno como fuente de verdad
Conecté el panel con el sistema que la empresa ya usaba: productos y precios se sincronizan solos. El equipo solo administra lo que ese sistema no cubre, sin capturar nada dos veces y sin catálogos desfasados.
- 02
Envío por distancia y sucursal más cercana
El costo del envío se calcula según qué tan lejos vive el cliente, y el sitio le muestra las sucursales que tiene más cerca. Ambas cosas se resuelven con Google Maps.
- 03
Dos frontends, dos problemas distintos
La tienda va en Next.js 15 porque un catálogo público necesita render en servidor y URLs indexables; el panel de administración es React con Vite, donde eso no aporta nada. Un solo backend en Node, Express y TypeScript sobre MongoDB sirve a los dos.
- 04
Del buscador al pago con tarjeta
Buscador, filtros, lista de deseos, carrito y cobro con Stripe forman un solo camino de compra. Las promociones de la portada enlazan directo a los productos en oferta, en lugar de soltar al comprador en el catálogo completo.
- 05
Imágenes propias y despliegue reproducible
Un catálogo de azulejos es un producto visual: las fotos y las fichas técnicas se sirven desde MinIO, almacenamiento compatible con S3 autoalojado. Todo corre en Docker con CI/CD en Dokploy.
Siguiente proyecto
NONSTOP Fitness Center
El gimnasio abre 24 horas. Ahora el entrenador también.