Trabajos Seleccionados

Una colección de artefactos digitales que exploran la intersección entre la ingeniería de diseño, el desarrollo full stack y la experiencia de usuario.

Página de inicio de ViajeroX
Sección de comunidad de ViajeroX
Sección de gastronomía de ViajeroX
HTML5 CSS3 Bootstrap 5

ViajeroX

Sitio web temático sobre las 7 maravillas del mundo, desarrollado en equipo (4 personas) con HTML5, CSS3, Bootstrap 5, FontAwesome y AOS para animaciones de scroll.

  • Arquitectura multi-página: +25 páginas HTML organizadas por dominio funcional (autenticación, comunidad, servicios, panel admin, detalle de producto).
  • Diseño responsive: adaptado a mobile, tablet y desktop con Bootstrap grid y 16 hojas de estilo modulares por sección.
  • UI interactiva sin frameworks JS: cards, modales de video/información y navbar adaptativo resueltos con Bootstrap y CSS puro.
  • Flujos de producto simulados: login, registro, contacto y panel de administración funcionales a nivel de frontend.
  • Trabajo colaborativo con Git: desarrollo por ramas de feature, con pull requests y merges — ~680 commits totales en equipo.
  • Validación de formularios nativa: patrones regex en registro, login y contacto (contraseñas con letra, número y carácter especial) junto con minlength y required, sin depender de JS.
  • Contenido enriquecido por destino: cada maravilla tiene su propia página de detalle con historia, tips de viaje, fotos, video y opiniones de viajeros.
  • Servicios complementarios como secciones propias: transporte, alojamiento, gastronomía y asistencia al viajero, pensados como plataforma y no como una landing.
  • Gamificación: sección de millas con objetivos y recompensas para fomentar el retorno de usuarios.
2025 · EN PRODUCCIÓN VISITAR SITIO →
Home de PadelTime
Agenda de reservas de PadelTime
Catálogo de canchas de PadelTime
React Node.js MongoDB

PadelTime

Plataforma SaaS para la gestión integral de complejos de pádel: los jugadores buscan canchas y reservan turnos, los dueños administran su negocio (canchas, horarios, torneos, pagos, reportes) y un superadmin gobierna la plataforma aprobando y suspendiendo complejos.

  • Tres paneles por rol con rutas protegidas: cliente (reservas, favoritos), dueño con 10 secciones (agenda, canchas, torneos, reportes) y superadmin.
  • Motor de disponibilidad en tiempo real: cruza horarios, reservas, mantenimientos y bloqueos, con expiración automática de reservas pendientes.
  • Pagos multi-tenant con Mercado Pago: cada dueño conecta su cuenta; el token se cifra con AES-256-GCM y la confirmación llega por webhook, polling y redirect.
  • Chatbot con IA (Llama 3.3 70B vía Groq): usa function calling para consultar disponibilidad real en MongoDB y sugerir turnos.
  • Generador de PDF y analítica propios: reportes construidos a mano y agregaciones en MongoDB para ingresos, ocupación y ranking de canchas.
  • Frontend SPA con React 19: Vite, React Router 7, Zustand para estado global, React Hook Form + Zod para validación y Axios con interceptores JWT.
  • Backend en arquitectura de capas: routes → validación con express-validator → controllers → modelos, con JWT + bcrypt y RBAC de 3 roles.
  • Analítica con mapa de calor: tendencias período a período y heatmap de ocupación por día y hora, además de ranking de canchas.
  • Auditoría e integraciones: subida de imágenes a Cloudinary, emails transaccionales con Nodemailer y registro de acciones del superadmin (ActivityLog).
2026 · EN PRODUCCIÓN VISITAR SITIO →
Home de El Garage Automóviles
Stock de vehículos de El Garage Automóviles con filtros
Formulario de tasación online de El Garage Automóviles
React Node.js MongoDB Claude API

El Garage Automóviles

Plataforma web para una concesionaria de autos usados: los clientes exploran el stock, filtran por marca/carrocería/precio, consultan la ficha de cada unidad y tasan su auto actual online, mientras el dueño gestiona todo el inventario, las tasaciones recibidas y las conversaciones del chat desde un panel propio.

  • Dos experiencias con rutas protegidas: sitio público (stock, ficha de auto, tasación, chat) y panel admin detrás de login con JWT, sin exponer ninguna ruta de gestión sin autenticar.
  • Carga de vehículos con moneda dual (USD/ARS): cada auto se publica en dólares o en pesos según convenga, con selector de moneda en el formulario y precio formateado correctamente en toda la web.
  • Chatbot con IA (Claude Haiku vía Anthropic SDK): usa function calling para consultar el stock real en MongoDB y responder con datos concretos (marca, precio, disponibilidad) en vez de inventar información.
  • Carga de fotos directa a Cloudinary: subida sin pasar por el servidor (unsigned upload), hasta 7 fotos por vehículo, con reordenamiento y selección de portada desde el panel.
  • SEO técnico completo: metadata dinámica por página (hook propio useSeo), datos estructurados JSON-LD (AutomotiveBusiness), sitemap.xml generado en cada build consultando la API en vivo, y robots.txt.
  • Backend en Express + MongoDB: autenticación con JWT y bcrypt, rate limiting propio por IP (con trust proxy para Render), CORS multi-origen para soportar dominio propio y subdominios.
  • Notificaciones automáticas por email (Nodemailer): el dueño recibe un correo apenas entra una tasación nueva, sin tener que estar pendiente del panel.
  • Frontend SPA con React 18 + Vite + React Router 7: sin librerías de UI, diseño propio con tokens de color/tipografía consistentes en todo el sitio.
  • Infraestructura productiva real: frontend en Vercel, backend en Render, base de datos en MongoDB Atlas y dominio propio conectado a mano (DNS, SSL, verificación en Google Search Console).
2026 · EN PRODUCCIÓN VISITAR SITIO →
Pantalla principal de FocusOnWeb
Funcionalidades de FocusOnWeb
React Node.js Express MongoDB

FocusOnWeb

Plataforma SaaS multi-tenant de gestión de tareas para equipos: cada empresa administra su propia organización con proyectos, tareas y empleados, mientras cada empleado ve y actualiza únicamente lo que tiene asignado. Todo el ciclo de vida de una tarea —asignación, revisión, aprobación, aclaraciones, reapertura— queda modelado de punta a punta, con notificaciones automáticas por email que cada empresa configura con su propio Gmail.

  • Multi-tenant real: cuentas "empresa" (dueñas de su organización) y "empleado" (miembros), con permisos separados del rol técnico de membresía (admin/miembro) — nunca se mezclan.
  • Ciclo de vida completo de tareas: pendiente → en progreso → en revisión → completada, con aprobación por nivel de calidad, reapertura con motivo, extensión de plazos vencidos y solicitud de aclaraciones entre empresa y empleado.
  • Emails automáticos por organización: cada empresa conecta su propio Gmail (contraseña de aplicación cifrada con AES-256-GCM) para avisos e invitaciones; la recuperación de contraseña usa una cuenta de sistema separada.
  • Gestión de equipo: invitación por email, WhatsApp o link compartible, eliminación con confirmación y borrado en cascada de tareas, y departamentos derivados de los proyectos reales de cada persona.
  • Tablero Kanban: filtros por miembro y estadísticas en vivo por columna.
  • Onboarding guiado: crear el primer proyecto, invitar al primer empleado y activar los avisos automáticos, con acciones reales contra el backend en cada paso.
  • Seguridad end-to-end: contraseñas con bcrypt (select:false a nivel de schema), JWT con expiración, rate limiting en login/registro/recuperación, CORS restringido y mensajes de error que no revelan qué emails existen.
  • Frontend con React 19 + Vite: React Router 7, React Hook Form + Zod, Framer Motion y un sistema de diseño oscuro construido a mano, sin Tailwind ni UI kit.
  • Backend en capas con Express 5 + MongoDB: rutas → validadores → controllers → modelos, Nodemailer, Cloudinary y un job de limpieza automática de tareas antiguas.
  • Testing y deploy real: 22 tests de backend (Jest) y 18 de frontend (Vitest + Testing Library), desplegado en Render (API) y Vercel (frontend).
2026 · EN PRODUCCIÓN VISITAR SITIO →