¿Por qué Atlas?
Atlas no es un kit de UI ni una página de aterrizaje: es un directorio de trabajo y mercado de reservas. Cada pantalla a continuación está respaldada por un esquema real de PostgreSQL (48 tablas de Drizzle), acciones del servidor, autenticación basada en roles y datos de semillas ricos, para que puedas lanzar una guía de ciudad, un mercado de alquileres, un directorio de restaurantes, una plataforma de eventos o cualquier directorio de nicho en días en lugar de meses.
Cubre todo el ciclo: un visitante busca en el mapa, elige un lugar, reserva y paga, el propietario confirma desde su panel de control, el administrador del directorio mantiene la comisión, y la plataforma ejecuta muchos directorios como un SaaS. Sin WordPress, sin plugins, sin bloqueo de constructores de páginas.
- Aplicación independiente de Next.js 16 + React 19, 100% TypeScript, toda la UI y el código en inglés
- SaaS multi-inquilino: subdominios o dominios personalizados por directorio, planes, pruebas y facturación
- Cuatro modos de reserva: estancias nocturnas, reservas de un solo día, franjas horarias y entradas para eventos con check-in QR
- Stripe Checkout + pagos de Stripe Connect, efectivo a la llegada, cupones, tarifas opcionales, depósitos, reembolsos y un libro de comisiones
- Búsqueda con mapa agrupado, filtros, búsquedas guardadas, comparar y "buscar mientras muevo el mapa"
- Constructor de páginas de 32 bloques, marca, navegación, textos y alternancias de funciones — todo desde el administrador
- Estudio de diseño por listado para que cada propietario pueda estilizar su propia página pública
- Reseñas con fotos y respuestas, marcadores, reclamaciones, informes, leads, mensajería y notificaciones
- Plantillas de correo electrónico editables, blog, boletín y formularios de contacto
- 12 plantillas de nicho (guía de ciudad, alquileres, restaurantes, eventos, servicios, bienestar…) intercambiables en cualquier momento
- Modo claro y oscuro, completamente responsivo, componentes accesibles, metadatos SEO y OpenGraph
- Datos de demostración realistas: 24 listados, reservas, pedidos, reseñas y conversaciones
01. Velo en acción: un visitante reserva en segundos
El widget de reserva se adapta al tipo de listado. Las estancias muestran un calendario de rango de fechas con precios nocturnos, tarifas de limpieza e impuestos de la ciudad. Los restaurantes y servicios muestran un solo día con franjas horarias calculadas a partir de las horas de apertura, la duración de la franja y las reservas existentes. Los eventos venden entradas con un contador de capacidad que nunca puede sobrepasarse. Los huéspedes pueden realizar el check-out sin una cuenta cuando lo permites, aplicar cupones y pagar con tarjeta o en efectivo a la llegada.
02. Una página de inicio que vende tu directorio
La página de inicio está construida a partir de bloques: héroe con búsqueda, categorías, listados destacados, cómo funciona, estadísticas, regiones, eventos próximos, reseñas y un llamado a la acción. Reordena, oculta o rediseña cada bloque desde el constructor de páginas; cada encabezado y etiqueta es editable.
03. Búsqueda en el mapa con filtros
Palabra clave, ubicación, tipo de listado, categoría, fechas, huéspedes, precio, abierto ahora, reserva instantánea y filtros verificados. Los resultados se sincronizan con un mapa Leaflet agrupado (tiles de OpenStreetMap por defecto, cualquier proveedor de tiles a través de una variable de entorno). Los visitantes pueden guardar una búsqueda y recibir notificaciones, o comparar listados uno al lado del otro.
04. Páginas de listados de las que los propietarios están orgullosos
Galería, insignia verificada, calificación, rango de precios, estado de abierto ahora, comodidades, campos personalizados, menú o servicios con precios, video, mapa de ubicación, horas de apertura, preguntas frecuentes, tarjeta del anfitrión, reseñas y una barra lateral de reservas persistente. Los propietarios pueden reordenar secciones, agregar bloques personalizados y cambiar el diseño desde su propio estudio de diseño.
05. Panel de control del propietario: un verdadero cockpit de negocio
Resumen con gráfico de ingresos y reservas próximas, gestor de listados, reservas con aprobar / rechazar / cancelar / check-in, calendario de disponibilidad con importación y exportación de iCal, mensajes, leads, reseñas, estadísticas, cupones, promociones (destacados / patrocinados), miembros del equipo, billetera con incorporación de Stripe Connect y paquetes.
06. Administrador del directorio: personaliza todo, sin código
Marca (logo, colores, fuentes, radio), apariencia (estilo de encabezado, barra de anuncios, pie de página), navegación de mega-menú, 127 cadenas de texto editables, alternancias de funciones, plantillas de correo electrónico, tipos de listados con campos personalizados y taxonomías, paquetes, anuncios, cupones, moderación, reclamaciones, informes, usuarios, análisis y herramientas. Cambia entre las 12 plantillas de nicho en cualquier momento.
07. Ejecútalo como un SaaS
El dominio raíz es tu plataforma: sitio de marketing, precios, registro y un proceso de incorporación de 4 pasos que provisiona un nuevo directorio en su propio subdominio en segundos. Planes con límites (listados, usuarios, características), pruebas, Stripe Billing y un superadministrador de la plataforma para gestionar sitios, usuarios y planes. O establece TENANCY_MODE=single para ejecutar un directorio en un dominio.
08. Móvil, modo oscuro y accesibilidad
Cada página funciona al ancho del teléfono sin desplazamiento horizontal, el modo oscuro sigue el sistema o un interruptor, los componentes provienen de un sistema de diseño original (marca índigo, neutros cálidos, Plus Jakarta Sans) con navegación por teclado y estados de enfoque.
Desglose de características por rol
Visitantes / invitados: búsqueda con mapa y filtros · búsquedas guardadas · comparar · marcadores · reservar estancias, espacios o entradas · pago de invitados · cupones · reseñas con fotos · mensajes con anfitriones · viajes, entradas con QR y billetera
Propietarios: listados con galería, campos personalizados, menú, preguntas frecuentes, horarios y video · flujo de trabajo de reservas · calendario de disponibilidad + iCal · clientes potenciales y mensajes · estadísticas · cupones y promociones · miembros del equipo · estudio de diseño · billetera Stripe Connect · paquetes
Administradores de directorio: marca, apariencia, navegación, textos, características · creador de páginas (32 bloques) · conmutador de plantillas · tipos de listados, campos, taxonomías · moderación, reclamaciones, informes, reseñas · reservas, pedidos, pagos · paquetes, cupones, anuncios · plantillas de correo electrónico · análisis · biblioteca de medios · dominio
Administradores de la plataforma: sitios, usuarios, planes, suspensión, facturación
Pila tecnológica
- Next.js 16 (App Router, acciones del servidor, enrutamiento de inquilinos basado en proxy)
- React 19, TypeScript, Tailwind CSS v4
- PostgreSQL 16 + Drizzle ORM (48 tablas, migraciones incluidas)
- Better Auth (correo electrónico + contraseña, sesiones, restablecimiento de contraseña)
- Stripe (Checkout, Billing, Connect) con un modo de prueba que funciona sin claves
- Validación Zod 4, Leaflet + supercluster maps, Recharts
- nodemailer (transporte de consola en desarrollo), node-ical / ical-generator, códigos QR
- Vitest (55 pruebas), ESLint, GitHub Actions CI, Docker + docker-compose, salida independiente, punto final de salud
Lo que obtienes
- Código fuente completo de la plataforma, directorio, panel de control del propietario y administrador
- 12 plantillas de nicho con scripts de semillas y contenido de demostración
- Migraciones de base de datos, trabajos cron y una interfaz de controlador de almacenamiento (local / compatible con S3)
- Guía de arquitectura, README con implementación, configuración de Stripe y SMTP, guía de privacidad y datos, avisos de terceros, registro de cambios
Instalación en 4 pasos
pnpm install- Copia
.env.example a .env y establece DATABASE_URL, ROOT_DOMAIN y BETTER_AUTH_SECRET pnpm db:migrate && pnpm seedpnpm dev y abre la plataforma en tu dominio raíz y la demostración en demo.<root domain>
Requisitos
- Node.js 20 o más reciente y pnpm
- PostgreSQL 16 (Docker compose incluido)
Cuentas de demostración (después de la siembra)
La siembra crea cuentas de demostración para evaluación local: admin@atlas.test (administrador de plataforma + directorio), sofia@nooks.test (propietario) y emma@nooks.test (invitado). No hay contraseña incorporada: establece DEMO_PASSWORD en tu .env, o deja que la siembra genere una aleatoria y la guarde en .seed-credentials.txt. La siembra se niega a ejecutarse en producción sin un DEMO_PASSWORD explícito.
Bueno saber
- Construcción en sala limpia: código original y sistema de diseño original, sin código de tema GPL o activos licenciados
- Stripe es opcional; sin claves, el pago se ejecuta en un modo de prueba que puedes demostrar de inmediato
- Todas las cadenas públicas son editables desde el administrador, por lo que puedes traducir el front end a cualquier idioma
- Defaults de seguridad: inicio de sesión limitado por tasa y restablecimiento de contraseña, encabezados de seguridad, verificación de configuración de inicio, sin análisis ni scripts de terceros cargados por defecto
−27%
