E-commerce · Desodorante Natural · Hecho en Colombia · Envío Nacional

Nivo
Desodorante

Tienda online de desodorante spray de origen natural. SPA completamente hecha en React con API PHP propia, pasarela de pagos Wompi y panel de administración integrado.

En Desarrollo React 18 E-commerce Colombia Wompi

¿Qué es Nivo Desodorante?

🌱
El producto

Nivo es una marca colombiana de desodorante spray de origen natural. Sin parabenos, sin disruptores hormonales, hecho en Colombia y con envío a nivel nacional. Disponible en 60 ml, 120 ml y combos (Pack x3, Kit Viajero).

🛒
La solución web

Una Single Page Application (SPA) de e-commerce completa: catálogo de productos, carrito de compras, checkout con datos de envío, pasarela de pagos integrada (Wompi) y panel de administración propio para gestionar pedidos e inventario.

⚙️
Arquitectura

Frontend React 18 completamente desacoplado de un backend PHP que actúa como API REST. Base de datos MySQL con integración DIVIPOLA para cobertura geográfica completa de Colombia en el formulario de envíos.

Línea de productos

🧴
120 ml
$37.000

SKU: NIVO-120 · Stock: 100

🧴
60 ml
$19.000

SKU: NIVO-60 · Stock: 100

📦
Pack x3 (120ml)
$99.900

SKU: NIVO-PACK3 · Stock: 50

🎒
Combo Kit Viajero
$49.900

SKU: NIVO-COMBO · 120ml + 60ml · Stock: 49

E-commerce completo y propio

Sin plataformas de terceros: todo el flujo de compra, gestión de pedidos e inventario desarrollado a medida.

🏠

Landing Page Premium

Hero animado con Framer Motion, ticker scrolling de características ("Sin parabenos · Hecho en Colombia · Sin disruptores hormonales"), sección origen, modo de uso y galería de productos.

🛒

Carrito de Compras

Carrito lateral tipo drawer con gestión de cantidades, subtotal en tiempo real y persistencia durante la sesión. Diseño elegante coherente con la marca.

💳

Checkout con Wompi

Formulario de checkout con datos de envío, selección de departamento y ciudad vía DIVIPOLA Colombia, resumen del pedido y botón "Pagar Pedido" con integración directa a Wompi (pasarela colombiana).

🗺️

Cobertura Nacional (DIVIPOLA)

Integración del sistema DIVIPOLA con todos los departamentos y municipios de Colombia. Selección dependiente en cascada: al elegir departamento, se filtran automáticamente las ciudades disponibles.

⚙️

Panel de Administración

Dashboard propio con autenticación de administrador. Módulo de Productos: inventario con imagen, SKU, precio de venta, costo y stock. Módulo de Pedidos: gestión de órdenes recibidas.

🔗

API PHP Custom

Backend RESTful propio en PHP. Módulos: autenticación JWT, gestión de productos (CRUD), manejo de pedidos, webhooks de Wompi para confirmación de pagos y actualización de stock automática.

💬

WhatsApp Integrado

Botón flotante de WhatsApp en todas las vistas para contacto directo con la marca. Canal oficial de soporte y consultas integrado en la experiencia de compra.

Animaciones con Framer Motion

Transiciones de página fluidas, animaciones de entrada de elementos, ticker de características animado y micro-interacciones en productos y botones CTA.

Tecnologías
del proyecto

Frontend React 18 totalmente desacoplado de un backend PHP hecho desde cero. Sin librerías de e-commerce de terceros — todo el flujo: carrito, checkout, pagos y administración es código propio.

⚛️
Frontend (SPA)
React 18 · React Router 6 · Framer Motion · Tailwind CSS 3 · Lucide Icons
🔧
Backend (API REST)
PHP nativo · MySQL · Módulos: auth, products, orders, webhooks
💳
Pagos
Wompi Colombia · Webhooks para confirmación automática de pedidos
🗺️
Cobertura geográfica
DIVIPOLA Colombia · Todos los departamentos y municipios del país
Frontend
React 18
Vite 5
Tailwind 3
Framer Motion
Backend & Datos
PHP API
MySQL
WOMPI Wompi
DIVIPOLA DIVIPOLA

Estado de Desarrollo

Proyecto de e-commerce desarrollado específicamente para la marca Nivo. El stack y la arquitectura personalizada permiten control total sobre el flujo de compra sin comisiones de plataformas externas.

Landing Page & Diseño de Marca
Hero animado, ticker de características, galería de productos, sección Origen y Modo de Uso
Completado
Catálogo y Carrito de Compras
Página de Productos con 4 SKUs, carrito lateral (drawer), gestión de cantidades y subtotal
Completado
Checkout & Integración Wompi
Formulario de envío con DIVIPOLA, resumen del pedido, pago seguro y webhooks de confirmación
Completado
Panel de Administración
Login, gestión de productos (inventario, SKUs, precios) y módulo de pedidos
Completado
🔄
QA, Pruebas y Ajustes Finales
Testing del flujo completo de compra, responsividad y optimización de imágenes
En progreso
Despliegue en Producción
Hosting en servidor con dominio propio para la marca Nivo
Pendiente