Cómo usar Firebase Authentication para validar usuarios en tu MVP sin backend

Si estás construyendo un MVP o validando una idea de producto, no necesitas escribir cientos de líneas de código para manejar usuarios. Firebase Authentication te permite agregar login seguro en minutos, ya sea con correo electrónico, Google, Facebook o incluso sin cuenta alguna. Esto te ayuda a enfocarte en el producto, no en la infraestructura.

¿Para quién sirve esto?

Este tutorial está pensado para emprendedores, equipos de producto y desarrolladores que necesitan validar una idea rápidamente. Si tu objetivo es probar si la gente usa tu app, no si puedes construir un sistema de usuarios complejo, Firebase es tu mejor aliado.

Pasos para integrar Firebase Authentication

1. Crea un proyecto en Firebase: Ve a Firebase Console, inicia sesión con tu cuenta de Google y crea un nuevo proyecto.
2. Habilita métodos de autenticación: En el menú lateral, ve a ‘Authentication’ > ‘Sign-in method’ y activa los proveedores que necesites: Email/Password, Google, Facebook, etc.
3. Agrega Firebase a tu app: Descarga el archivo de configuración (google-services.json para Android o GoogleService-Info.plist para iOS) y colócalo en tu proyecto.
4. Instala el SDK: Si usas JavaScript, agrega <script src="https://www.gstatic.com/firebasejs/9.23.0/firebase-auth-compat.js"></script> en tu HTML o instala con npm: npm install firebase.
5. Inicializa Firebase en tu código: Copia las credenciales de tu proyecto desde la consola y pega el fragmento de inicialización en tu app.
6. Implementa el login: Usa signInWithEmailAndPassword(), signInWithPopup() o el widget de Google para permitir el acceso.
7. Guarda datos del usuario: Una vez autenticado, guarda información adicional en Firestore o Realtime Database usando el UID del usuario.

Ejemplo concreto: Login con Google en una web

import { initializeApp } from "firebase/app";
import { getAuth, signInWithPopup, GoogleAuthProvider } from "firebase/auth";

const firebaseConfig = {
  apiKey: "TU_API_KEY",
  authDomain: "TU_PROYECTO.firebaseapp.com",
  projectId: "TU_PROYECTO",
  storageBucket: "TU_PROYECTO.appspot.com",
  messagingSenderId: "XXX",
  appId: "TU_APP_ID"
};

const app = initializeApp(firebaseConfig);
const auth = getAuth(app);
const provider = new GoogleAuthProvider();

function loginConGoogle() {
  signInWithPopup(auth, provider)
    .then((result) => {
      const user = result.user;
      console.log("Usuario logueado:", user);
    })
    .catch((error) => {
      console.error("Error de login:", error);
    });
}

Errores frecuentes y cómo evitarlos

• No habilitar el proveedor: Si activaste Google pero no lo habilitaste en ‘Sign-in method’, el login fallará. Revisa siempre la consola.
• Usar el SDK viejo: Firebase lanzó la versión 9 con sintaxis modular. Si usas getAuth() pero importas funciones de la versión 8, obtendrás errores.
• No manejar errores: Si un usuario cierra la ventana emergente de Google, tu app se romperá si no usas .catch().
• No proteger rutas: Después del login, verifica con onAuthStateChanged() que el usuario esté autenticado antes de mostrar contenido privado.

¿Cuándo no conviene usar Firebase Authentication?

Si tu producto requiere cumplir con normativas como HIPAA o SOC 2, o si necesitas control total sobre los datos de los usuarios, quizás debas construir tu propio sistema. Pero para un MVP, validación de ideas o apps internas, Firebase es rápido, confiable y gratuito hasta cierto volumen.

Próximos pasos

Una vez que tengas usuarios autenticados, conecta Firestore para almacenar su información, o usa Cloud Functions para ejecutar lógica personalizada cuando alguien se registre. También puedes integrar Firebase Hosting para desplegar tu app en segundos.