Implementación de Shopping Cart

[TAMQuiroz]

Plan de Implementación: Shopping Cart

1. Modelado y Backend API

• Crear un modelo Cart y CartItem en el backend (Express, TypeScript).
• Definir endpoints REST:
  • POST /cart para crear un carrito.
  • GET /cart/:id para obtener el carrito.
  • POST /cart/:id/items para agregar productos.
  • DELETE /cart/:id/items/:itemId para eliminar productos.
  • PUT /cart/:id/items/:itemId para actualizar cantidad.
  • POST /cart/:id/checkout para procesar la compra.
• Actualizar relaciones en el ERD si es necesario.

2. Lógica de Negocio

• Validar stock y disponibilidad de productos al agregar al carrito.
• Calcular totales y descuentos (si aplica).
• Integrar con el flujo de órdenes existente.

3. Frontend (React)

• Crear contexto global CartContext para manejar el estado del carrito.
• Componentes principales:
  • CartIcon (en la navegación, muestra cantidad de ítems).
  • CartDrawer o CartPage (lista de productos, cantidades, total).
  • Botón de checkout.
• Integrar con la API usando hooks (useEffect, useState).

4. UI/UX

• Usar Tailwind CSS para diseño responsivo y moderno.
• Mensajes de confirmación, errores y validaciones.
• Animaciones para agregar/eliminar productos.

5. Pruebas

• Unit tests para lógica de carrito (API y frontend).
• Pruebas de integración para el flujo de compra.

6. Documentación

• Actualizar documentación de API y frontend.
• Incluir ejemplos de uso y screenshots.