How to integrate firebase : Flutter Guide

--

Integrating Firebase with Flutter involves a series of steps to set up Firebase in your Flutter project and configure the necessary services. Here’s a step-by-step guide on how to integrate Firebase with Flutter:

1. Create a Firebase Project:

  • Go to the Firebase Console (https://console.firebase.google.com/).
  • Click “Add Project” and follow the setup wizard to create a new Firebase project.
  • Once your project is created, you’ll be redirected to the project dashboard.

2. Add Your Flutter App to Firebase:

  • Click the “Add app” button in the Firebase project dashboard.
  • Select the platform you’re developing for, which is “iOS” or “Android” in the case of Flutter.
  • Follow the on-screen instructions to register your app. You’ll need to provide a package name for Android (usually found in your AndroidManifest.xml) and a bundle ID for iOS (found in your Xcode project).

3. Download and Add Configuration Files:

  • After registering your app, Firebase will provide you with a configuration file for each platform (google-services.json for Android and GoogleService-Info.plist for iOS).
  • Download these configuration files and place them in the respective directories of your Flutter project.

4. Add Firebase SDK Dependencies:

  • In your Flutter project’s pubspec.yaml file, add the Firebase dependencies you intend to use. For example, to include Firebase Authentication, Realtime Database, and Cloud Firestore, add the following dependencies:
dependencies:
flutter:
sdk: flutter
firebase_core: ^latest_version
firebase_auth: ^latest_version
firebase_database: ^latest_version
cloud_firestore: ^latest_version
  • Replace latest_version with the latest version number of each package, which you can find on the Flutter packages website or in your pubspec.yaml file.
  • Run flutter pub get to fetch the dependencies.

5. Initialize Firebase:

  • In your Flutter app’s main.dart file, import the necessary Firebase libraries:
import 'package:firebase_core/firebase_core.dart';

void main() async {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp();
runApp(MyApp());
}
  • Ensure that await Firebase.initializeApp(); is called before runApp(MyApp()); to initialize Firebase before running your app.

6. Use Firebase Services:

  • In your Flutter app, initialize Firebase Cloud Messaging by creating a function to configure the Firebase Cloud Messaging instance. You should call this function during your app’s initialization process, typically in your main.dart file:
import 'package:firebase_core/firebase_core.dart';
import 'package:firebase_messaging/firebase_messaging.dart';

Future<void> main() async {
WidgetsFlutterBinding.ensureInitialized();
await Firebase.initializeApp();
runApp(MyApp());
}

Future<void> configureFirebase() async {
final FirebaseMessaging _firebaseMessaging = FirebaseMessaging.instance;

_firebaseMessaging.subscribeToTopic('your_topic_name'); // Optional: Subscribe to a topic

// Request permission to receive notifications
NotificationSettings settings = await _firebaseMessaging.requestPermission(
alert: true,
badge: true,
sound: true,
);

if (settings.authorizationStatus == AuthorizationStatus.authorized) {
print('User granted permission to receive notifications');
} else {
print('User declined or has not granted permission');
}
}
  • To retrieve the Firebase token, you can call the getToken method of the Firebase Messaging instance. You can do this in your app wherever it makes sense to retrieve the token. For example, you might do this in your app's home screen or during the user's authentication process:
String? firebaseToken;

Future<void> getFirebaseToken() async {
FirebaseMessaging _firebaseMessaging = FirebaseMessaging.instance;

try {
firebaseToken = await _firebaseMessaging.getToken();
print('Firebase Token: $firebaseToken');
} catch (e) {
print('Failed to get Firebase token: $e');
}
}
  • Make sure to handle exceptions appropriately, as the token retrieval process can fail for various reasons.
  • Remember to request permission from the user to receive notifications, as shown in the configureFirebase function. Without permission, the app won't receive Firebase tokens or push notifications.

7. Test Your App:

  • Run your Flutter app on an emulator or physical device to ensure that Firebase services are working as expected.

Remember to keep your Firebase dependencies up to date and refer to Firebase and Flutter documentation for any specific usage instructions and updates. Firebase offers a wide range of services, so you can choose which ones are relevant to your app’s needs and integrate them accordingly.

--

--

Prashant Vaddoriya - Senior Flutter Developer

Senior Flutter Developer | Mobile App Development | Android App Development | iOS App Development