Configura Atlas — SaaS de gestión de alquiler de coches

Hosting de Hostinger

El código de Atlas es gratis; el hosting es un plan de pago. Aquí funciona tu sitio web en vivo.

Elige un plan de Hostinger

Usa el plan Unlimited o un plan Cloud con despliegue de Web App.

Claude Desktop

Tu asistente de IA para la configuración. Claude hace el trabajo técnico en su pestaña Code.

Descarga Claude Desktop

https://claude.ai/download

Node.js

Versión 20.19 o posterior. Claude se encarga del resto.

Descargar Node.js

https://nodejs.org/en/download

Git

Sirve para publicar tu copia de Atlas. Claude ejecuta los comandos de Git por ti.

Descargar Git

https://git-scm.com/

Cuenta de Supabase

El plan gratuito basta para empezar. Crearás un proyecto nuevo cuando Claude te lo pida.

Crear cuenta de Supabase

https://supabase.com/dashboard

Cuenta de GitHub

Gratis. Guarda tu propia copia privada de Atlas, desde la que Hostinger despliega.

Crear cuenta de GitHub

https://github.com/signup

Descargar Atlas

Atlas es gratuito y de código abierto bajo la licencia MIT.

Abrir Atlas en GitHub

https://github.com/salhiworks/atlas-car-rental-saas

Haz clic en Code y luego en Download ZIP Descomprime el archivo descargado Guarda la carpeta atlas-car-rental-saas-main en un lugar fácil de encontrar, como Documentos

¿Ya usas Git? Puedes clonar el repositorio en su lugar. La configuración de Claude funciona con ambas opciones.

Abre Atlas en Claude Desktop

Claude Desktop Code Local Select Project Folder Open Trust Workspace

Elige la propia carpeta de Atlas: la que contiene README.md.

Pide a Claude que configure Atlas

En la pestaña Code, con la carpeta de Atlas abierta, envía este mensaje:

Prompt de configuración de Atlas

Inicia la configuración integrada de Atlas. Claude hace el trabajo técnico por ti.

Set up Atlas for me.

Claude sigue la skill de configuración integrada de Atlas. Revisa tu ordenador, instala lo que Atlas necesita y hace el trabajo técnico por sí mismo. Solo se detiene cuando te necesita, y cada uno de esos momentos es una tarea de esta guía.

Crea tu proyecto de Supabase

Claude te pide esto primero. Atlas siempre se instala en un proyecto nuevo y vacío.

Abrir el panel de Supabase

https://supabase.com/dashboard

Haz clic en New project: el plan Free es suficiente Ponle un nombre y guarda la contraseña de la base de datos en un lugar seguro Cuando esté listo, copia su Project ID y pégalo en Claude

Supabase Project Settings General

Si Claude te pide iniciar sesión en Supabase o conectar tu proyecto, sigue exactamente las instrucciones que te dé.

Aprueba la instalación

Claude muestra el nombre, la región y la fecha de creación de tu proyecto y te pide permiso para instalar Atlas en él. Comprueba que es el proyecto que acabas de crear y responde yes. Ese único yes cubre todo lo demás:

Crea la base de datos de Atlas (54 migraciones, con vista previa primero)

Despliega y verifica las 4 Edge Functions de Atlas

Configura la app solo con tu publishable key

Ejecuta el build y las comprobaciones automáticas de Atlas

Tarda unos minutos y no tienes que abrir ni probar nada. Si el proyecto no está vacío, Claude se detiene y no cambia nada.

Crea un repositorio privado vacío

Es tu propia copia de Atlas en GitHub. Hostinger despliega tu sitio web desde ella.

Crear repositorio en GitHub

https://github.com/new

Ponle nombre al repositorio Elige Private Deja desactivados README, .gitignore y license Haz clic en Create repository Copia la URL del repositorio

Aprueba la publicación

Pega la URL del repositorio en Claude cuando te la pida. Claude prepara Git, comprueba que no se incluya ningún secreto y muestra un breve resumen: tu repositorio y la rama main. Comprueba que el repositorio es tuyo y responde yes.

Claude nunca hace push al repositorio original de Atlas. Si Git te pide iniciar sesión, Claude te pedirá que hagas el push tú mismo: inicia sesión desde el navegador, porque GitHub no acepta ahí la contraseña de tu cuenta.

Importa tu repositorio

¿Aún no tienes hosting? Consigue un plan primero en Requisitos.

Hostinger Websites Add Website Web App Import Git Repository

Conecta GitHub y elige Only select repositories Selecciona tu repositorio de Atlas y la rama main Elige el dominio temporal gratuito o tu propio dominio

Configura el build y despliega

Mantén el preset de framework Vite que detecta Hostinger Elige Node.js 22 o la versión más reciente disponible Define el comando de build como npm run build Define el directorio de salida como dist

Añade exactamente estas dos variables de entorno. Claude te muestra ambos valores, y puedes ignorar cualquier otra sugerencia:

VITE_SUPABASE_URL VITE_SUPABASE_PUBLISHABLE_KEY

VITE_SUPABASE_URL

URL del proyecto

VITE_SUPABASE_PUBLISHABLE_KEY

Publishable key

Obtén estos valores en Supabase

Abrir Connect

https://supabase.com/dashboard/project/_?showConnect=true

Seguridad

Aquí solo va la Publishable key. Nunca añadas una Secret key ni una service_role key a una variable VITE_: todo lo que empieza por VITE_ es visible en el navegador.

Haz clic en Deploy y espera a que termine el build Copia la dirección de tu sitio web y pégala en Claude

Claude comprueba que el sitio en vivo carga por HTTPS y está conectado a tu proyecto de Supabase.

Añade tu dirección en vivo a Supabase

Los emails de registro y de contraseña enlazan a estas direcciones. Claude te envía la Site URL exacta y las cuatro Redirect URLs para tu dominio de Hostinger: cópialas del mensaje de Claude.

Supabase Authentication URL Configuration

Define la Site URL con tu dirección en vivo, empezando por https:// Añade las cuatro Redirect URLs, una por una Haz clic en Save y luego dile a Claude que ya está

Cada Redirect URL es tu dirección en vivo seguida de una de estas rutas:

/auth/callback

/accept-invite

/auth/reset-password

/confirm-email

Crea tu agencia

Abre el enlace de registro que te da Claude: tu dirección en vivo seguida de /sign-up Crea tu agencia con el mismo email que tu cuenta de Supabase Abre el email de confirmación en el mismo navegador Inicia sesión y avisa a Claude cuando el panel muestre tu agencia

Por qué el mismo email: el email integrado de Supabase solo llega a las direcciones de tu equipo de Supabase, unos dos mensajes por hora. Después, Claude confirma que tu agencia existe y que tú eres su Owner: no tienes nada que probar.

Atlas está en vivo. Cada push a la rama main lo vuelve a desplegar en Hostinger, así que pide a Claude cualquier cambio, incluidos tu nombre, logo o colores, y luego pídele que haga push.

Antes de tener clientes reales

Conecta tu propio proveedor de email (Custom SMTP) antes de que se registren clientes o personal ajenos a tu equipo de Supabase:

Supabase Authentication Emails SMTP Settings