Agregar registro, inicio de sesión y roles de usuario

Permitir que las personas creen cuentas e inicien sesión, y proteger las páginas correspondientes.

Tiempo: ~20 minutos Dificultad: Intermediate Funciona con: Base44 / Lovable / v0

Cuándo usarlo

Cuando tu aplicación necesite cuentas, un área de miembros o una sección exclusiva para administradores.

Antes de empezar

  • Una aplicación que ya exista (ejecuta primero el prompt de MVP si no es así).
  • Decide antes de empezar: ¿quién puede registrarse (cualquiera o solo personas invitadas?) y qué deberían poder ver los diferentes roles? Escríbelo, ya que el prompt lo solicitará.
  • Base44 y Lovable incluyen sistemas de inicio de sesión; en v0 estarás conectando un servicio externo, lo cual toma más tiempo.

El prompt

Estos prompts funcionan mejor en inglés — pégalos tal como están, incluso en páginas traducidas.

Add secure user accounts to my app.
Outcome: visitors can sign up and log in, and the right pages are protected.
Requirements:
- Email + password sign-up and login, plus "Sign in with Google".
- A "forgot password" reset flow by email.
- Two roles — [regular user] and [admin] — where only admins can open [the admin area / these pages].
- A profile page where a user can edit [name, email, photo].
- Require login to view these pages: [list the private pages].
Must-haves (don't skip): validate all inputs, store passwords hashed, never expose secret keys in the frontend, and show clear messages for a wrong password, an email that already exists, and expired reset links. Add basic rate limiting on login and password reset.
Build it end to end, then tell me what changed and exactly how to test each flow.

¿Ya estás creando? Pega esto en tu proyecto. ¿Empiezas de cero? Abre una cuenta gratuita en un creador compatible a continuación.

Créalo en

Cómo ganamos dinero

Qué crea esto

  • Pantallas de registro, inicio de sesión y restablecimiento de contraseña
  • Una lista guardada de tus usuarios que puedes visualizar
  • Separación de roles, para que diferentes personas vean cosas distintas
  • Páginas protegidas que redirigen a cualquier persona que no tenga permiso de acceso

Comprueba que funcionó

Pega el prompt, espera a que termine la construcción y luego confirma esto — en lenguaje sencillo, sin comprobaciones técnicas:

  • Puedes crear una cuenta de prueba e iniciar sesión con ella
  • Cerrar e iniciar sesión funciona, y el correo de restablecimiento de contraseña llega correctamente
  • Un visitante que no ha iniciado sesión y abre una página protegida es enviado a la pantalla de inicio de sesión en lugar de ver el contenido
  • Tu usuario de prueba aparece en la lista de usuarios de tu aplicación
  • Si solicitaste un rol de administrador, tu cuenta de administrador verá elementos administrativos y una cuenta de prueba normal no los verá

¿Falta algo? Es normal — pídelo en un mensaje corto de seguimiento en vez de volver a ejecutar todo el prompt.

Siguientes pasos

Comprobar que los bloqueos realmente funcionen

Inmediatamente después de que el inicio de sesión funcione

Review every page and every piece of data in the app and list which of them a logged-out visitor, a normal logged-in user, and an admin can each reach. Then fix anything a normal user or logged-out visitor can reach that they should not — the restriction must be enforced by the access rules, not by hiding links.

Sabrás que funcionó cuando: Obtienes una lista clara de quién puede ver qué, y las pruebas con una cuenta normal lo confirman.

Añadir una página de perfil

Una vez que los usuarios existen y quieres que se sientan como en casa

Add a profile page where a logged-in user can see and edit their own details: [NAME, PHOTO, PHONE, WHATEVER APPLIES]. They can only ever see and edit their own profile. Add a link to it in the account menu.

Sabrás que funcionó cuando: Un usuario que ha iniciado sesión puede actualizar sus propios detalles y no puede abrir el perfil de nadie más.

Registro solo por invitación

Para herramientas internas o clientes privados

Turn off public sign-up. Instead, let an admin invite people by email from an admin screen; invited people get a link to set their password and join. Everyone else who tries to sign up sees a short message explaining the app is invite-only.

Sabrás que funcionó cuando: Un extraño no puede crear una cuenta, pero una dirección de correo electrónico invitada sí puede.

Ojo con

  • Prueba con una segunda cuenta, no solo con la tuya. Todo parece estar permitido cuando eres el administrador. Crea un usuario normal e intenta acceder a las páginas de administrador; esa es la verdadera prueba.
  • Nunca crees tu propio sistema de contraseñas. Utiliza el inicio de sesión integrado de la plataforma; el prompt solicita exactamente eso. La autenticación hecha en casa es el error grave más común en aplicaciones creadas por IA.
  • "Oculto" no es "protegido". Eliminar un enlace del menú no impide que alguien escriba la dirección manualmente. El prompt solicita reglas de acceso reales; confirma que funcionan probando con la cuenta que no ha iniciado sesión.

Notas por plataforma

Base44 tiene autenticación y gestión de usuarios integradas. Lovable puede usar la autenticación nativa de Lovable Cloud o Supabase Auth opcional. v0 construye la lógica de inicio de sesión y permisos alrededor de un proveedor de autenticación seleccionado, comúnmente conectado a través de Vercel o el SDK del proveedor. En cualquier plataforma, protege los datos almacenados así como las páginas y prueba cada rol con una cuenta de usuario normal.

Gasta menos créditos

Toda plataforma te cobra por el trabajo que hace su IA — así que el hábito más barato es pensar antes de construir. Estas seis reglas eliminan la mayor parte del desperdicio, elijas la plataforma que elijas.

  1. Planifica primero en un chat gratuito. Esboza todo en ChatGPT, Claude o Gemini — páginas, funciones, qué recoge cada formulario, cómo debe verse. Pensar allí es gratis; pensar dentro de un builder se factura.
  2. Empieza con un prompt escrito, no con una frase. "Hazme una web" es la frase más cara al construir con IA. Un primer prompt completo — como los de este sitio — ahorra decenas de rondas de corrección.
  3. No seas perezoso con los detalles. Cada detalle que omites vuelve como una corrección que pagas. Nombre del negocio, colores, cada página, cada campo del formulario, qué pasa tras el envío — ponlo todo en el primer prompt.
  4. Después, un cambio por mensaje. "Arregla la cabecera, y el formulario, y los colores" produce un enredo que cuesta más deshacer de lo que ahorró.
  5. ¿Atascado? Deja de parchear. Si la misma corrección falla unas tres veces, no envíes una cuarta — describe el estado final deseado de toda la sección en un mensaje nuevo.
  6. Empieza gratis. Mejora el plan cuando necesites más. Usa la cuota gratuita para crear y explorar tu primera versión. Mejora el plan cuando necesites más uso o funciones de pago, y revisa el coste de los servicios conectados antes del lanzamiento.

Los prompts de esta página están escritos para hacer casi todo este trabajo por ti — de eso se trata.

Lee la guía completa
authentication login users roles security

Revisado el: 2026-08-27

Preguntas Frecuentes

Usamos cookies para analizar el tráfico y rastrear clics de afiliados. Al continuar, aceptas nuestra Política de Privacidad.