Supabase Authentication es el sistema de login que te permite añadir usuarios a tu aplicación sin montar todo desde cero. Con esto puedes gestionar registro, inicio de sesión y acceso a tu app.
Lo más habitual es usar email y contraseña, pero también puedes hacerlo con login social, magic links u otros métodos según el tipo de producto que estés construyendo.
Si estás creando una app con Supabase y quieres tener el login funcionando rápido y bien montado, sigue leyendo, vas a ver qué opciones tienes y cómo configurar la autenticación paso a paso.
Supabase ofrece varios métodos de autenticación según el tipo de app que estés construyendo. El más común es email y contraseña, el sistema clásico que funciona bien en la mayoría de productos.
Si quieres reducir fricción, puedes usar login social con Google, GitHub o Apple, donde el usuario entra en un clic. También tienes opciones sin contraseña como magic link, donde el usuario recibe un enlace por email para acceder, o códigos OTP de un solo uso. Son útiles en productos donde quieres simplificar al máximo el acceso.
Para casos más avanzados, Supabase ofrece SSO, pensado para entornos B2B donde los usuarios acceden con la cuenta de su empresa.
El proceso tiene varias partes. Primero dejas Supabase listo, luego conectas tu aplicación y, por último, pruebas el flujo completo para asegurarte de que los usuarios pueden registrarse y acceder sin problemas.
.png)
Entra en Supabase y crea un proyecto desde el panel. Tendrás que elegir un nombre, una contraseña para la base de datos y la región más cercana a tus usuarios. En unos minutos lo tienes listo.
Una vez creado, guarda las claves del proyecto. Las encuentras en Project Settings > API, donde verás la URL del proyecto y la anon key. Las vas a necesitar para conectar tu aplicación.
Dentro de Supabase ve a Authentication > Providers y activa el método que quieras usar. Aquí decides cómo van a acceder tus usuarios a la app.
Si estás empezando, lo más práctico es email y contraseña, que viene activado por defecto. Para login con Google copias el Client ID y el Client Secret desde Google Cloud Console, los pegas en la pantalla del proveedor en Supabase y añades en Google Cloud la URL de callback que te indica el propio panel. Más adelante puedes sumar otros proveedores según lo necesites.
Con el método de login activo, instala la librería en tu proyecto con npm install @supabase/supabase-js e inicializa el cliente con la URL y la anon key que guardaste antes.
import { createClient } from '@supabase/supabase-js'
const supabase = createClient(SUPABASE_URL, SUPABASE_ANON_KEY)
A partir de aquí ya puedes gestionar registro, inicio de sesión y sesiones de usuario directamente desde tu aplicación. Lo recomendable es guardar las claves en variables de entorno para no exponerlas en el código.
.png)
Ahora toca construir las pantallas que verá el usuario. Login, registro y, si lo necesitas, recuperación de contraseña. Cuanto más simples y claras sean, mejor funciona la experiencia.
Cada formulario llama a un método del SDK. Para registro usas supabase.auth.signUp({ email, password }), para login con email supabase.auth.signInWithPassword({ email, password }) y para login con Google supabase.auth.signInWithOAuth({ provider: 'google' }). Con magic link sería signInWithOtp({ email }).
El último paso es decidir qué partes de tu app requieren login y proteger esas rutas. Antes de renderizar una sección privada, comprueba la sesión con supabase.auth.getSession() o el usuario con supabase.auth.getUser(), y redirige al login si no hay nadie autenticado.
Después, prueba todo el flujo de principio a fin. Registro, confirmación por email, login, navegación dentro de la app y cierre de sesión con supabase.auth.signOut().
Con Supabase Authentication bien montado gestionas usuarios sin tener que mantener infraestructura propia y eliges el método de acceso que mejor encaje con tu producto y la experiencia que quieres ofrecer.
Una vez configurado, podrás proteger rutas según el tipo de usuario, gestionar sesiones activas y controlar quién accede a qué partes de tu app.
Si quieres pasar a la acción y construir algo real, tenemos un curso gratuito para crear tu primera aplicación con Vibe Coding usando Lovable.