Capacidades
- Back office
- Registro de auditoría
- Imágenes en CDN
- Email transaccional
Frontend
Next.js
TypeScript
TailwindBackend
PostgreSQL
Drizzle
Cloudinary
ResendLopezCars
CompletadoLópez Cars es un concesionario de vehículos de ocasión en Carabanchel (Madrid) cuya web vivía dentro de un CRM multi-tenant de terceros. La reconstruí entera como un proyecto Next.js 16 propio —catálogo con filtros, fichas de vehículo, colecciones, servicios, tasación y contacto— y le monté detrás un back office desde el que gestiona inventario, fotos, marcas, leads, valoraciones y contabilidad sin llamar a nadie.
El reto
El cliente pagaba una plataforma que no controlaba: no podía tocar el diseño, ni exportar sus datos, ni añadir nada fuera de lo que el CRM permitía. El encargo era migrar sin perder posicionamiento ni contenido, replicando lo que ya funcionaba y dándole por fin la llave de su propia web.
Capturas
Escritorio 
Móvil
Arquitectura
Diagrama de arquitectura de LopezCars
Implementación
Migración desde un CRM de terceros
Inventarié assets, textos y estructura del sitio antiguo antes de escribir código, para mantener paridad de páginas, URLs y tono, y no romper el SEO ya ganado durante el cambio.
Back office con Server Actions
Panel de administración propio con vehículos y galerías, marcas, colecciones, contabilidad, leads, valoraciones, usuarios y ajustes del sitio. Todas las mutaciones son Server Actions de Next validadas con Zod, sin API REST intermedia.
Acceso al admin con roles
Auth.js v5 con credenciales sobre bcrypt y sesión en JWT, con dos roles (propietario y administrador). El login devuelve el mismo mensaje tanto si el email no existe como si la contraseña falla, para no permitir enumerar cuentas, y el restablecimiento de contraseña va por email con Resend.
Drizzle ORM sobre PostgreSQL
Esquema tipado con Drizzle (vehículos, imágenes, marcas, transacciones, colecciones, leads, valoraciones, ajustes, auditoría) con migraciones versionadas y utilidades de snapshot e importación de la base de datos.
Imágenes en Cloudinary
Las fotos de los vehículos se suben a Cloudinary con un upload preset dedicado y se sirven optimizadas con next-cloudinary, de modo que las fichas cargan rápido incluso con galerías largas.
Captación de leads end-to-end
Los formularios de contacto y tasación gratuita usan React Hook Form + Zod, están protegidos con rate limiting, notifican por email al concesionario y aterrizan como registros gestionables en el panel.
Modo solo-lectura del despliegue
Una variable de entorno (ADMIN_READONLY) congela el admin: la web pública y los formularios siguen vivos, pero cualquier mutación se ignora y se avisa con un banner. Pensado para que el sitio siga en pie si algún día el cliente migra de hosting.
Trazabilidad y SEO
Registro de eventos de auditoría de las acciones del admin, y del lado público renderizado en servidor con metadatos, sitemap y robots generados por código.