Firebase Auth login en Flutter: ejercicio resuelto con email y password

Firebase Auth login en Flutter: ejercicio resuelto

Si buscas login en Flutter con Firebase Auth, este ejemplo te permite autenticar por email y password rápidamente.

Enunciado

Implementa inicio de sesión con:

  • email,
  • password,
  • mensaje de éxito o error.

Solución en Flutter

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
import 'package:flutter/material.dart';
import 'package:firebase_auth/firebase_auth.dart';

class LoginPage extends StatefulWidget {
  const LoginPage({super.key});

  @override
  State<LoginPage> createState() => _LoginPageState();
}

class _LoginPageState extends State<LoginPage> {
  final emailCtrl = TextEditingController();
  final passCtrl = TextEditingController();

  Future<void> signIn() async {
    try {
      await FirebaseAuth.instance.signInWithEmailAndPassword(
        email: emailCtrl.text.trim(),
        password: passCtrl.text,
      );
      if (!mounted) return;
      ScaffoldMessenger.of(context).showSnackBar(const SnackBar(content: Text('Login correcto')));
    } on FirebaseAuthException catch (e) {
      if (!mounted) return;
      ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text('Error: ${e.code}')));
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Firebase Login')),
      body: Padding(
        padding: const EdgeInsets.all(16),
        child: Column(
          children: [
            TextField(controller: emailCtrl, decoration: const InputDecoration(labelText: 'Email')),
            TextField(controller: passCtrl, decoration: const InputDecoration(labelText: 'Password'), obscureText: true),
            const SizedBox(height: 12),
            ElevatedButton(onPressed: signIn, child: const Text('Iniciar sesión')),
          ],
        ),
      ),
    );
  }
}

Resultado esperado

El usuario accede con credenciales válidas y recibe feedback claro en caso de error.

Errores frecuentes

  • No inicializar Firebase antes de usar Auth.
  • Mostrar mensajes técnicos sin traducir al usuario.
  • No validar formato de email previamente.

Aplicación práctica

Es una base común para MVPs móviles, paneles internos y apps de comunidad.

Siguiente ejercicio recomendado

Práctica guiada y siguiente paso

FAQ

¿Es seguro usar Firebase Auth para producción?

Sí, bien configurado es una opción sólida para muchos casos.

¿Puedo combinar email/password con Google login?

Sí. Firebase permite múltiples proveedores en el mismo proyecto.

¿Qué hacer tras el login?

Guardar estado de sesión, cargar perfil y redirigir a la pantalla principal.