Volver al portafolio
2026 E-commerce
La Guarida — Tienda oficial
Tienda oficial del Club León: catálogo por línea, personalización de jersey, probador virtual, checkout con envío y puntos de lealtad.
Tecnologías
Next.js React TypeScript Firebase Auth Stripe FedEx
01. Contexto
La colección oficial necesitaba una tienda propia, no solo un catálogo. Quien compra tiene que ver el producto con claridad, pagar sin fricción y seguir su pedido. Quien opera la tienda necesita inventario, órdenes y ofertas en el mismo sistema.
02. Objetivo
Poner en producción la tienda de La Guarida, conectada al backend real, con compra, lealtad y operación diaria del catálogo.
03. Mi Rol
Construimos el storefront y las herramientas de operación: home editorial, ficha de producto, carrito, checkout, historial de pedidos, puntos y el panel de productos, inventario, órdenes, ofertas y banners.
Arquitectura
- Storefront en Next.js con App Router
- Autenticación con Firebase
- Pagos con Stripe en el checkout
- Envíos integrados con FedEx
- Panel de administración para catálogo, inventario, pedidos y contenido
Decisiones Técnicas
- La tienda y el panel comparten el mismo producto para no duplicar reglas de negocio
- El checkout guarda el avance de la compra para no perder el carrito
- Los puntos de lealtad se aplican en la compra, no en un flujo aparte
- La misma cuenta sirve en la web y en la app del club
Galería del Proyecto
…
01 / 17
Impacto y Resultados
- Tienda pública en tiendalaguarida.com
- Inicio editorial, líneas y catálogo con filtros
- Ficha de producto con talla, personalización y probador virtual
- Carrito, envío a domicilio o recolección, y pago
- Cuenta con puntos, recomendaciones e historial de pedidos
Lecciones Aprendidas
- En una tienda oficial, la ficha de producto y el checkout deciden la venta
- El panel tiene que servir para el día del partido, no solo para cargar fotos
- La cuenta del aficionado debe ser la misma en la app y en la web