Software empresarial · 2026Entrada general · no reembolsable
Vileads Events
La infraestructura completa para operar eventos: catálogo, landing por evento, ticketing, pagos y check-in.
Categoría
Plataforma web SaaS multi-tenant para eventos
Rol
Arquitectura frontend y desarrollo (React + TypeScript), en equipo
Estado
En desarrollo activo, integrado contra el backend real de producción
Dos entradas para el mismo evento: una vencida, una válida
Así se opera un evento cuando las herramientas están cosidas a mano, y así se opera cuando el evento vive entero dentro de una sola aplicación.
El problema
VencidaMedia docena de herramientas cosidas
Un operador de eventos serio termina cosiendo a mano media docena de herramientas: una hoja de cálculo para el aforo, un ticketera de terceros que se queda con la marca y con el dinero, un constructor de sitios aparte para la landing, otra app para escanear entradas en la puerta y correos sueltos para gestionar ponentes y patrocinadores. El resultado son datos partidos, cobros que nadie concilia y una experiencia pública que no parece del organizador sino del proveedor.
La solución
VálidaUna sola aplicación de punta a punta
Una sola aplicación React donde el evento vive de punta a punta. El organizador recibe un panel con diez secciones (resumen, eventos, entradas, órdenes, fondos, ponentes, patrocinadores, analítica, asesoría y ajustes) más el check-in con QR; publica la landing pública del evento desde un editor de plantillas gobernadas que renderiza exactamente igual en el editor y en producción; cobra por checkout con confirmación asíncrona y descarga del ticket en PDF; y valida entradas en la puerta con la cámara del teléfono, incluso sin conexión. Encima de todo, un panel de super-admin con quince secciones controla organizaciones, pagos manuales, liquidaciones, servidor de anuncios, auditoría y términos legales.
Cinco talones que validan el producto
Landing propia por evento en subdominio
Un utilitario resuelve el host: si el navegador está en `<evento>.vileadsevents.com` la app entera se convierte en la landing de ese evento (con excepciones para el retorno de checkout y el pago de postulaciones). En el dominio principal el mismo evento se ve con el chrome del catálogo. Dos vistas públicas, un solo código.
Site Builder con seis plantillas gobernadas
Cada plantilla no es un recoloreado: define tokens de color, secciones activas y una 'persona' visual propia (tipo de eyebrow, radio de esquinas, alineación del hero, patrón decorativo, navegación monoespaciada). El editor y la página pública construyen su aspecto desde el mismo módulo de tema, así que lo que se previsualiza es literalmente lo que se publica.
Check-in QR que funciona sin señal
Escaneo en vivo con la cámara trasera vía BarcodeDetector del navegador, más ingreso manual como respaldo. Si el dispositivo pierde la conexión, cada escaneo se guarda en una cola local por evento y se sincroniza en lote al volver online, con indicadores de estado y contador de pendientes.
Dinero trazable de punta a punta
El checkout confirma de forma asíncrona: como el pago se cierra por webhook, la pantalla de éxito hace polling con fases (procesando, recibido, lento) antes de declarar la compra. Del otro lado, el organizador ve ganancia neta, disponible a liberar, pendiente, pagado, bruto, comisiones y reembolsos, con el historial de liquidaciones.
Trilingüe, con tema claro y oscuro
Español, inglés y portugués con unas 1.909 claves por idioma, idioma y tema persistidos en el store y enviados al backend como cabecera `Accept-Language`. Cada componente trae sus variantes `dark:`; no hay pantalla que se quede a medias al cambiar de tema.
Cuatro pantallas, tres audiencias
El asistente que compra, el organizador que administra y el staff que abre la puerta: todos viven dentro de la misma aplicación React.
01 · Home — hero con maqueta del panel
El sistema operativo para
eventos ambiciosos.
Vileads le da a los operadores modernos la plataforma para lanzar, vender y operar eventos de punta a punta — con tu marca arriba, nuestra ingeniería abajo.
Crear cuentaACME
Resumen
Eventos
Constructor
Entradas
Ponentes
Patrocin.
Ajustes
Asistentes
8,432
+12%
Ingresos
$278,600
+18%
Entradas
1,204
+9%
Eventos
14
+2
02 · Ficha de evento (vista catálogo)
Cumbre Vileads 2026
Dos días de producto, operación y negocio para equipos que organizan.
Sobre el evento
Una cumbre para organizadores: cómo se vende una entrada, cómo se abre la puerta y cómo se liquida el dinero cuando el recinto ya está vacío.
Agenda
Entradas
Acceso a las dos jornadas
Networking y sala privada
Organiza
ACME Producciones
Caracas, Venezuela
Powered by Vileads03 · Check-in QR en puerta
En sitio
Check-in con QR
Escanea el QR del ticket o pega el código. Funciona offline.
Cámara apagada. Usa ingreso manual o enciende la cámara.
Invitados registrados · 218
04 · Panel del organizador — Resumen
Ventas totales
$278.600
+18%
Entradas emitidas
1.204
+9%
Asistentes activos
8.432
+12%
Ventas por mes
Suscripción anual
Al día
Vence el 14 de marzo de 2027
Eventos recientes
Las maquetas reproducen la interfaz real; los datos que muestran son de ejemplo.
Seis plantillas con persona propia
Site Builder — galería de plantillas y editor
Tech Conference
Cian sobre casi negro
Music Festival
Granate, violeta y naranja
Executive Summit
Azul marino con dorado
Creative Workshop
Rosa y ámbar de taller
Industry Expo
Acero y cielo técnico
Community Event
Verde de barrio
El lienzo del editor y la página publicada construyen su aspecto desde el mismo módulo de tema: lo que se previsualiza es literalmente lo que se publica.
Nueve cifras del proyecto
36
páginas React
15
módulos de feature
83
endpoints REST consumidos
15
secciones del panel super-admin
10
secciones del panel del organizador
6
plantillas de landing
3
idiomas (es · en · pt)
1.909
claves de traducción por idioma
5
tipos de postulación
Diecisiete líneas ya impresas
El programa completo de la plataforma, tal y como está construido hoy.
Con qué está impreso
Núcleo
Estado y datos
Interfaz
Calidad y tooling
La letra pequeña de la arquitectura
Condiciones de uso · reverso
Arquitectura feature-first: `src/app` (bootstrap, providers y rutas con carga perezosa), `src/shared` (cliente HTTP, primitivos de UI, layouts, hooks, i18n, store y utilidades) y `src/features` con quince módulos independientes (account, admin, advisory, applications, auth, checkin, checkout, events, home, legal, marketing, organization, site-builder, sponsors, tenant), cada uno con sus `api/`, `components/` y `pages/`. Todo el tráfico HTTP pasa por un único `apiAxios` sobre axios que inyecta el token del store, traduce el idioma activo a `Accept-Language`, desenvuelve el sobre del backend (`{ data, message, status, pagination }`) preservando la paginación, y centraliza el refresco de token y el logout ante 401. El estado global es Redux Toolkit con redux-persist para sesión, tema e idioma; nada de `localStorage` suelto salvo la cola de check-in offline. El enrutado combina tres layouts —catálogo con chrome y anuncios, standalone sin chrome, y panel con sidebar— más guardas por rol, y se bifurca antes de todo eso según el subdominio del host. Reglas duras verificadas por lint: ningún archivo supera 1.000 líneas y no se permiten importaciones cruzadas profundas entre features.
src/app
bootstrap, providers y rutas perezosas
src/shared
HTTP, UI, layouts, i18n y store
src/features
quince módulos independientes
Vileads Events es el frontend de una plataforma de eventos donde conviven tres audiencias en una sola aplicación React: el asistente que descubre y compra entradas, el organizador que administra su evento desde un panel privado, y el super-admin que gobierna toda la plataforma.
La aplicación resuelve el ciclo completo de un evento: asesoría inicial, creación del evento, construcción de su landing con un editor de plantillas, venta de entradas con checkout y confirmación asíncrona por webhook, postulaciones de ponentes, patrocinadores, expositores, voluntarios y participantes, control de acceso con QR en puerta, y liquidación de fondos al organizador.
Cada evento puede publicarse en su propio subdominio (`<evento>.vileadsevents.com`): cuando la app detecta ese host, toda la aplicación se convierte en la landing de ese evento, sin el chrome del catálogo Vileads.
El proyecto está construido sobre una guía de arquitectura frontend propia (`FRONTEND_ARCHITECTURE_SKILL.md`, 58 KB) que fija estructura feature-first, cliente HTTP único, manejo unificado de errores, i18n por slice y un límite duro de 1.000 líneas por archivo.
Cinco entradas partidas en dos
Arriba, lo que se rompía. Abajo, lo que quedó impreso en el código.
Reto 01 · lo que se rompía
El mismo evento debe verse de dos maneras públicas incompatibles: dentro del catálogo Vileads (con cabecera, pie y anuncios) y como landing independiente del organizador, sin rastro de la plataforma salvo si él lo autoriza.
Cómo se resolvió
VL-RT-01Se separaron dos páginas sobre el mismo modelo de datos y dos layouts (`AppLayout` y `StandaloneLayout`). La vista standalone no monta el chrome ni los anuncios globales, y lee `branding_mode` de la organización para decidir si muestra el sello 'Powered by Vileads'. La resolución del subdominio ocurre antes del árbol de rutas, así que el host decide qué aplicación es esta antes de renderizar nada.
Reto 02 · lo que se rompía
El pago no termina cuando el usuario vuelve del proveedor: la orden la confirma un webhook del backend, así que declarar 'compra exitosa' al aterrizar sería mentir la mitad de las veces.
Cómo se resolvió
VL-RT-02La pantalla de éxito modela el estado en fases (procesando, recibido, lento) y consulta la orden cada dos segundos hasta cinco intentos antes de dar un veredicto, distinguiendo además los casos que ya llegan pagados —órdenes gratuitas— de los que dependen del webhook. Confirmada la compra, ofrece la descarga del ticket en PDF y autoredirige al evento con cuenta regresiva.
Reto 03 · lo que se rompía
El check-in ocurre en la puerta de un recinto, donde el wifi es exactamente donde falla. Un escaneo perdido es un asistente que no entra.
Cómo se resolvió
VL-RT-03Cada escaneo se intenta contra la API y, si falla o el navegador está offline, cae en una cola local por evento con marca de tiempo y sin duplicados. La interfaz muestra el estado de conexión, cuántos escaneos hay pendientes y un botón de sincronización en lote que reporta cuántos de cuántos se subieron. La detección del QR usa la API nativa del navegador, con ingreso manual siempre disponible como respaldo.
Reto 04 · lo que se rompía
Un editor visual suele mentir: lo que se previsualiza no es lo que se publica, y cada plantilla nueva multiplica el código de render.
Cómo se resolvió
VL-RT-04Se extrajo un módulo de tema compartido que resuelve paleta, tipografía y rasgos de layout a partir de la definición de la plantilla más el acento elegido. El lienzo del editor y la landing pública construyen su aspecto desde esa misma función; lo único que cambia entre uno y otro son los datos —contenido de ejemplo frente al evento real—.
Reto 05 · lo que se rompía
El panel de super-admin creció hasta quince secciones y el del organizador hasta diez; en un archivo monolítico eso se vuelve intocable.
Cómo se resolvió
VL-RT-05Cada pestaña es un archivo propio bajo `components/tabs/`, y la definición de navegación vive en un módulo aparte compartido por el dashboard y la página de check-in, para que el menú lateral sea idéntico en ambos. La regla de lint de 1.000 líneas por archivo obliga a partir cualquier pestaña que se desborde.
La marca sobre papel y sobre tinta
El infinito azul-rojo de Visionary Leaders App, en sus dos versiones y su favicon.
Arrastra para ver las 5 piezas
Editorial corporativo: papel y tinta. Azul institucional con un rojo de acento que viene del logotipo (el infinito azul-rojo de 'Visionary Leaders App'), titulares en DM Serif Display sobre cuerpo Inter, superficies claras color crema con líneas finísimas, y un violeta reservado para los degradados de énfasis. Serio, denso en datos, nada festivo.
Vileads Events
¿Quieres algo así para tu producto?
Catálogo, landing por evento en subdominio, checkout confirmado por webhook y check-in offline en la puerta: si tu producto necesita esa clase de infraestructura, es exactamente el terreno que trabajo.