Firebase Auth Login in Flutter: solved exercise
If you are looking for Firebase Auth login in Flutter, this solved exercise gives you a practical implementation pattern you can reuse in real projects.
Problem statement
Build a screen with:
- email input
- password input
- authenticate user
- show success or error feedback
Flutter solution
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 successful')));
} 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('Sign in')),
],
),
),
);
}
}Expected result
Users can sign in with valid credentials and get clear error messages otherwise.
Common mistakes
- Using Auth before Firebase initialization.
- Showing raw technical errors to users.
- Skipping basic input validation.
Practical use
A frequent starting point for MVP apps, community products, and internal tools.
Recommended next exercise
- Flutter API Call with http: solved REST exercise
- SharedPreferences in Flutter: solved exercise for local settings
- FutureBuilder in Flutter: solved exercise for loading states
- All Flutter exercises
Guided practice and next step
- More Flutter exercises
- C exercises to strengthen fundamentals
- Programming in C in 100 Solved Exercises
- View the C book on Amazon (included in Kindle Unlimited)
- Subscribe to the newsletter
FAQ
Is Firebase Auth production-ready?
Yes, when properly configured and monitored.
Can I combine email login with Google Sign-In?
Yes. Multi-provider auth is supported in the same project.
What should happen after successful login?
Persist session state, load profile data, and redirect to main flow.