This is the eleventh part of a journey to build and publish a Flutter™ based app.
This section contains the Firebase configuration, database configuration and project settings required to make the app capable of working with Cloud Firestore. It is quite a set of chores and must be followed carefully. Heres the list of things to accomplish before getting back to Flutter code.
- Not using Flutter Web
- Firebase configuration for mobile apps in the Firebase Console
- Add Firebase to the iOS part of our Flutter project
- Add Firebase to the Android part of our Flutter project
- Check the Firebase console shows iOS and Android apps
- Creating a Cloud Firestore database
- Import the Cloud Firestore plugin from FlutterFire in our app
- Adjust the build configuration files (pubspec.yaml, android/build.gradle, android/app/buildgradle
Not using Flutter Web
At this point the codelab on Cloud Firestore has us enable web support for Flutter and essentially work through building a web app. This feature is currently in
Firebase configuration for mobile apps in the Firebase Console
- Register iOS and Android apps in the Firebase console
- Download the platform-specific configuration files, and add it to the project.
In the top-level directory of the codelab app, there are subdirectories called
android for platform-specific configuration files. These need to be modified to configure the app to use Firebase correctly.
Add Firebase to the iOS part of our Flutter project
- In the Firebase console, select Project Overview in the left navigation bar, and click the iOS button under Get started by adding Firebase to your app.
- The iOS bundle ID, is the ID you created in App Store Connect if you followed the previous article.
- You need to set it in Xcode for your Flutter app. In the Terminal, change to the topmost directory and type
- In Xcode, click the 'Runner' item in the left pane, to show the General tab in the right pane. Set the Bundle Identifier value to the value you chose in the Apple Developer website and provided for App Store Connect.
Remember: This is a production app, you must use the Bundle Identifier you created on Apple's developer platform.
- Make sure the bundle ID from Xcode is entered correctly, optionally set the app nickname, and Store ID, then select the now enabled 'Register app' button.
- Download the configuration file
GoogleService-Info.plist. Expand the Runner folder in Xcode and then drag the plist file into the Runner folder. You must do this in Xcode to correctly add the file. Click finish to add the file to the project properly.Important! Adding the file via the finder or terminal will not correctly add it to the project
- Click Next, and skip the remaining steps to return to the Firebase console and that completes the iOS setup.
Add Firebase to the Android part of our Flutter project
- In the Firebase console, select Project Overview in the left navigation bar, and click the 'Add App' button and then the 'Android' button to add Firebase to the Android part of our Flutter project
- In the Flutter app directory, open
- Find and edit
package="com.example.friendlyeats"replacing it with your reverse domain notation package name. This is probably going to be identical to the string you used for your Apple Bundle ID but it isn't a Bundle ID in Android it is the package name. It is your code namespace for this project. Save the file with your change. Note that this will not affect the application ID in
app/src/main/AndroidManifest.xml. The application ID is used separately by Google Play and must not be changed once your app binary has been published to any track in Google Play.
- Enter the same package name in Firebase Console and select the now enabled 'Register app' button.
- Download the configuration file
google-services.json. Open the Finder and then drag the plist file into the projects app/android folder.
- Click Next, and skip the remaining steps to return to the Firebase console and that completes the Android setup.
Check the Firebase console shows iOS and Android apps
The Firebase console should now show your iOS and Android apps and their names on the Project Overview page.
Creating a Cloud Firestore database
In the Firebase Console, Select Database and create a new collection. There are only collections and documents to worry about. Give your collection a name.
Add a few documents to the collection by selecting auto-id which generates a Document id and then adding one or two fields and saving - I added
capacity fields just to try it out.
Now there is some data in the collection. The data is in the cloud. It is ready to be used by our app.
Import the Cloud Firestore plugin from FlutterFire in our appCloud Firestore is a FlutterFire plugin, one of several that enable Flutter apps to use Firebase services. It is in
Adjust the build configuration files (pubspec.yaml, android/build.gradle, android/app/buildgradle
Firebase setup does require changes to your projects
pubspec.yamland the project level and app level gradle configuration files (Gradle is a build tool used for android projects).
- Add a dependecy to your
dependencies: cloud_firestore: ^0.13.7
cloud_firestorefrom the terminal $ flutter pub get or by directly running pub get in Android Studio.
- Import it into your project so you can use it in your code by adding the following line to your
- Now open
android/build.gradleand add the
classpathto the dependencies section.
classpath 'com.google.gms:google-services:4.3.3' // Google Services plugin
- Then open
android/app/build.gradleand adjust your
minSdkVersionto 21 or later as required by Firebase. Note also this file is where the
applicationIDlives, just check it is correct.
Then add the line to apply the plugin at the bottom of the file.
apply plugin: 'com.google.gms.google-services' // Google Services plugin
Once this is all completed successfully test to ensure your app will build without errors. Errors here can be quite opaque but you'll find answers in the flutter project github issues and must resolve them before continuing. On the plus side these platform specific customisations need to be completed only once per project that uses these plugins, and although they are a pain they should not need to be adjusted often.