
Proyecto
Plataforma full-stack de descubrimiento y gestión de eventos construida con Next.js App Router, Clerk y Prisma/PostgreSQL, con experiencias diferenciadas por rol (admin, organizer, attendee). El proyecto arrancó como un deep dive en TypeScript estricto —sin any, contratos claros entre UI, API y base de datos— y creció hasta convertirse en un sistema con lógica de negocio no trivial en varias capas.
El núcleo de la plataforma incluye un sistema de pagos completo con Stripe y Stripe Connect: onboarding de organizadores con payout routing real (destination charges + application fee), creación de eventos pagos condicionada a la disponibilidad del Connect account, y un lifecycle de PaymentIntent resiliente con idempotency keys versionadas y política explícita para intents desactualizados. El checkout usa una intercepted route con overlay UX, validación pre-confirmación y limpieza del retorno 3DS. La asistencia a eventos no depende solo del RSVP: está vinculada al estado de pago y se actualiza automáticamente ante reembolsos. Ante un caso edge donde el pago llega después de que el evento ya no es joinable, el sistema dispara un reembolso de compensación automático. Todo el ciclo está respaldado por webhooks para payment_intent.*, refund.updated y account.updated, con tests cubriendo los failure modes, no solo el happy path.
Encima de eso, hay dashboards operacionales por rol: el organizer dashboard combina un signal deck (métricas de refunds, pipeline de eventos pagos, risk/opportunity rotativos) con carruseles, spotlight, trend analytics por ventana de 7/30 días, y workspaces de pagos y reembolsos con filtros y drill-down. El admin dashboard agrega KPIs globales de plataforma, un shell de gestión de usuarios con drilldown por organizador, y herramientas de moderación (Admin's Pick, archivado, reembolso manual). Los attendees tienen una agenda propia con dashboard de cues contextuales y un drawer con todos sus tickets.
En UX y performance: micro-interacciones con Motion One, cards con tilt/3D, fondos WebGL con fallbacks y respeto a prefers-reduced-motion, lógica timezone-aware para ordenamiento today/upcoming, y envío de emails automatizado vía cron con plantillas en React Email. Testing con Vitest + Playwright para mantener los flujos críticos regresión-safe.
Tecnologias
Next.js
Clerk
Prisma
Typescript
Stripe
Shadcn UI
Radix UI
Motion One
OGL
Recharts
LordIcons
Tailwind CSS
SWR
Neon
Brevo
Svix
Zod
Vitest
Playwright