El reto
Una peluquería necesita que la clienta reserve en un minuto, sin llamar, y que el salón gestione su agenda sin que dos citas se pisen. Quise resolverlo con disponibilidad en tiempo real y una base de datos que lo impida por sí misma, cuidando la privacidad de quien reserva desde el primer día.
La solución
Reserva sin doble reserva
servicio, estilista, día y hora, con las horas libres al momento. La base de datos impide que una estilista tenga dos citas solapadas, aunque dos personas reserven a la vez.
Gestionar la cita, con o sin cuenta
un enlace personal por email para ver, cambiar o cancelar (solo se guarda su huella), o una cuenta por enlace mágico, sin contraseña.
Panel de administración
agenda semanal por estilista, mover y cancelar citas con aviso por email, servicios, horarios y vacaciones.
Un panel que cualquiera puede probar
con un clic entras en una cuenta de solo lectura que impone la propia base de datos, y los datos de otras personas aparecen enmascarados.
Privacidad desde el diseño
borrado y anonimización a petición, límites contra el abuso que guardan solo huellas con caducidad, y páginas que cuentan qué se guarda.
Accesible y responsive
nivel AA de WCAG, controles de al menos 44 px y un barrido automático de 18 anchos entre 320 y 1280 px.
Modo demostración
avisos de datos ficticios en los formularios y galería antes y después con imágenes generadas con IA, señaladas como tales.
Resultado
Una web de reservas completa y con seguridad probada: 480 tests unitarios, 255 de integración contra la base de datos y 1130 de extremo a extremo. La construí con especificación, plan, 44 tareas con su revisión y evidencia, y 31 decisiones documentadas.
Para desarrolladores
Next.js 16 (App Router) + React 19, con acciones de servidor.
TypeScript estricto, sin
any. Tailwind CSS v4 con tokens de diseño y una paleta validada por contraste.Supabase (Postgres, Auth y Realtime) con seguridad por filas en todas las tablas y funciones SQL para las operaciones críticas.
Zod en toda entrada externa; los tipos salen de los esquemas.
Vitest y Testing Library; pruebas de integración contra Supabase local; Playwright con axe para el recorrido completo y la accesibilidad.
Desarrollo guiado por especificación: spec, plan, 44 tareas con su revisión y 31 decisiones documentadas (ADR).
Vercel y Supabase, con CI en GitHub Actions y un keep-alive diario.
Repositorio público:
github.com/Terryqg10/estudio-peluqueria