How to Set Up Firebase Authentication in Your Flutter App
It provides various authentication methods such as email/password, Google, Facebook, and phone authentication.
jane-foster
Firebase Authentication is a powerful and flexible way to manage user sign-ins in your Flutter applications. It provides various authentication methods such as email/password, Google, Facebook, and phone authentication. Whether you are developing a startup application or integrating ERP solutions like Odoo for Small Business, Firebase Authentication can help streamline user management efficiently. In this guide, we will walk through setting up Firebase Authentication in a Flutter app step-by-step.
Prerequisites
Before diving into the setup process, ensure that you have the following:
- Flutter installed on your machine
- A Firebase account
- Android Studio or VS Code
- A basic Flutter app
If you haven't installed Flutter yet, follow the official documentation at Flutter.dev.
Step 1: Create a Firebase Project
- Go to Firebase Console.
- Click on Create a Project and follow the setup wizard.
- Enable Authentication in the Firebase Console by navigating to Build > Authentication.
- Click on Sign-in method and enable your desired authentication providers (Email/Password, Google, etc.).
Step 2: Add Firebase to Your Flutter App
For Android
- In Firebase Console, select Android and register your app with your package name.
- Download the google-services.json file and place it in the android/app/ directory.
- Modify android/build.gradle:
4. dependencies {
5. classpath 'com.google.gms:google-services:4.3.10'
6. }
- Modify android/app/build.gradle:
8. apply plugin: 'com.google.gms.google-services'
For iOS
- Select iOS and register your bundle identifier.
- Download the GoogleService-Info.plist file and place it in the ios/Runner/ directory.
- Modify ios/Runner/Info.plist and enable Firebase services.
Step 3: Install Firebase Dependencies in Flutter
In your Flutter project, install the required dependencies by adding them to pubspec.yaml:
dependencies:
firebase_core: latest_version
firebase_auth: latest_version
google_sign_in: latest_version
Run:
flutter pub get
Step 4: Initialize Firebase in Your App
Modify your main.dart file to initialize Firebase:
import 'package:firebase_core/firebase_core.dart';
import 'package:flutter/material.dart';
void main() async {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp();
runApp(MyApp());
}
Step 5: Implement User Authentication
Email and Password Authentication
Use Firebase's authentication service to register and sign in users with email and password:
import 'package:firebase_auth/firebase_auth.dart';
class AuthService {
final FirebaseAuth _auth = FirebaseAuth.instance;
Future<User?> signInWithEmail(String email, String password) async {
try {
UserCredential userCredential = await _auth.signInWithEmailAndPassword(
email: email, password: password);
return userCredential.user;
} catch (e) {
print("Error: $e");
return null;
}
}
Future<User?> registerWithEmail(String email, String password) async {
try {
UserCredential userCredential = await _auth.createUserWithEmailAndPassword(
email: email, password: password);
return userCredential.user;
} catch (e) {
print("Error: $e");
return null;
}
}
}
Google Sign-In Authentication
To implement Google Sign-In, add the following code:
import 'package:firebase_auth/firebase_auth.dart';
import 'package:google_sign_in/google_sign_in.dart';
Future<User?> signInWithGoogle() async {
final GoogleSignInAccount? googleUser = await GoogleSignIn().signIn();
if (googleUser == null) return null;
final GoogleSignInAuthentication googleAuth = await googleUser.authentication;
final OAuthCredential credential = GoogleAuthProvider.credential(
accessToken: googleAuth.accessToken, idToken: googleAuth.idToken);
UserCredential userCredential =
await FirebaseAuth.instance.signInWithCredential(credential);
return userCredential.user;
}
Step 6: Implement Authentication in the UI
Create a simple login screen in login_screen.dart:
import 'package:flutter/material.dart';
import 'auth_service.dart';
class LoginScreen extends StatefulWidget {
@override
_LoginScreenState createState() => _LoginScreenState();
}
class _LoginScreenState extends State<LoginScreen> {
final TextEditingController _emailController = TextEditingController();
final TextEditingController _passwordController = TextEditingController();
void _signIn() async {
var user = await AuthService()
.signInWithEmail(_emailController.text, _passwordController.text);
if (user != null) {
print("Login successful: \${user.email}");
} else {
print("Login failed");
}
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text("Login")),
body: Padding(
padding: EdgeInsets.all(16.0),
child: Column(
children: [
TextField(controller: _emailController, decoration: InputDecoration(labelText: "Email")),
TextField(controller: _passwordController, decoration: InputDecoration(labelText: "Password"), obscureText: true),
ElevatedButton(onPressed: _signIn, child: Text("Login"))
],
),
),
);
}
}
Conclusion
Setting up Firebase Authentication in a Flutter app is a straightforward process that provides a secure and scalable user authentication system. By leveraging Firebase, you can integrate multiple authentication methods, such as email/password and Google Sign-In, with minimal effort. If you're building an ERP-integrated mobile app and need expert guidance, consider hiring an Odoo consultant to streamline your business operations efficiently.
