Short guide: sign in with email & password.
Introduction
Authentication is one of the most common features in mobile apps. With Firebase, Flutter developers can quickly implement secure login systems. In this guide, we’ll walk through setting up email and password authentication using Firebase in Flutter.
Step 1: Add Firebase to Your Flutter Project
- Create a Firebase project at Firebase Console.
- Register your iOS/Android app and download the google-services.json (Android) or GoogleService-Info.plist (iOS).
- Add the Firebase SDK dependencies in your pubspec.yaml:
dependencies:
firebase_core: ^3.0.0
firebase_auth: ^5.0.0
- Initialize Firebase in main.dart:
void main() async {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp();
runApp(const MyApp());
}
Step 2: Implement Authentication Methods
import 'package:firebase_auth/firebase_auth.dart';
class AuthService {
final FirebaseAuth _auth = FirebaseAuth.instance;
// Sign up with email & password
Future<User?> signUp(String email, String password) async {
final userCredential = await _auth.createUserWithEmailAndPassword(
email: email,
password: password,
);
return userCredential.user;
}
// Sign in with email & password
Future<User?> signIn(String email, String password) async {
final userCredential = await _auth.signInWithEmailAndPassword(
email: email,
password: password,
);
return userCredential.user;
}
// Sign out
Future<void> signOut() async {
await _auth.signOut();
}
}
Step 3: Simple UI for Login
class LoginScreen extends StatefulWidget {
@override
_LoginScreenState createState() => _LoginScreenState();
}
class _LoginScreenState extends State<LoginScreen> {
final emailController = TextEditingController();
final passwordController = TextEditingController();
final authService = AuthService();
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: const Text("Login")),
body: Padding(
padding: const EdgeInsets.all(16),
child: Column(
children: [
TextField(controller: emailController, decoration: const InputDecoration(labelText: "Email")),
TextField(controller: passwordController, decoration: const InputDecoration(labelText: "Password"), obscureText: true),
const SizedBox(height: 20),
ElevatedButton(
onPressed: () async {
await authService.signIn(emailController.text, passwordController.text);
},
child: const Text("Sign In"),
)
],
),
),
);
}
}
Conclusion
With just a few lines of code, you’ve set up Firebase Authentication in Flutter. From here, you can extend authentication with Google, Facebook, or phone number logins.
Leave a Reply