Other languages: English
This project aims to be a base template or starter to start a project with Flutter and Firebase quickly.
The betting consists of two screens: login and home
On this screen the user can:
Screen that we arrive once identified and that allows us to finish the session.
The application also creates a document in the database called Activity in which the user time and ID is saved every time you log in.
The objective of this project is to demonstrate the use of Flutter together with Firebase to quickly create an application with a backend to manage users and authentication and a database to store information.
Install flutter on the development team:
https://flutter.dev/docs/get-started/install/macos
Make sure we have Android Studio and Xcode installed:
XCODE download
Android Studio download (for Mac)
Once installed, check the installation with:
flutter doctor
git clone [email protected]:ramoncardena/flutter-firebase-starter.git flutter-firebase-starter
cd flutter-firebase-starter
flutter packages get
We open the iOS project in Xcode: ~/flutter-firebase-starter/ios
In the structure of the project we select the Root Runner and in the general section in the identity section we define the Bundle ID ( Bundle Identifier ) and the version ( version ).
Then we go to the signing & capabilities section and in the signing section we select the appropriate equipment ( TEAM ) to sign the project.
Let's go to the project folder where the graduation is defined for application in: ~/flutter-firebase-starter/android/app/build.gradle
And we modify the defaultconfig section with the application ID ( Applicationid ) and set the minimum version of SDK ( Minsdkversion ) to 21
defaultConfig {
applicationId "com.ramoncardena.firebasestarter"
minSdkVersion 21
targetSdkVersion 28
versionCode flutterVersionCode.toInteger()
versionName flutterVersionName
testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
}
We will find the detailed information in English, in this article.
We go to the Firebase console.
We create a new project and once created, add two applications, one Android and another iOS.
We create a new iOS application from the Firebase console and fill the basic data.
Then we download the Googleservice-Info.Plist configuration file.
Important: We open Xcode and with the right button on the Runner/Runner folder, add the Firebase configuration file and closed Xcode.
In addition, for authentication with Google Sign-In , we have to add the corresponding key to the ios/Runner/Info.plist file:
<!-- Google Sign-in Section -->
<key>CFBundleURLTypes</key>
<array>
<dict>
<key>CFBundleTypeRole</key>
<string>Editor</string>
<key>CFBundleURLSchemes</key>
<array>
<!-- TODO Replace this value: -->
<!-- Copied from GoogleService-Info.plist key REVERSED_CLIENT_ID -->
<string>com.googleusercontent.apps.861823949799-vcuujjn0vvnmcvjppkn</string>
</array>
</dict>
</array>
<!-- End of the Google Sign-in Section -->
We create a new Android application from the Firebase console with the basic data.
To add the SHA signature key, from a terminal we go to the project folder and execute:
keytool -list -v -alias androiddebugkey -keystore ~/.android/debug.keystore
(as a password we use android )
From this part it is already implemented in the project, it is only informative
Then we download the Google-Services file. Settings and copy it into the project folder: android/app .
Once the file is copied, we have to configure the graduation to work with Firebase. We edit in the first place android/build.gradle :
buildscript {
repositories {
// Check that you have the following line (if not, add it):
google() // Google's Maven repository
}
// ...
dependencies {
// ...
// Add the following line:
classpath 'com.google.gms:google-services:4.3.3' // Google Services plugin
}
}
allprojects {
// ...
repositories {
// Check that you have following line (if not, add it):
google() // Google's Maven repository
// ...
}
}
And on android/app/build.gradle :
dependencies {
// ...
}
// Add the following line to the bottom of the file:
apply plugin: 'com.google.gms.google-services' // Google Play services Gradle plugin
Finally we edit the android/gradle.properties file and add:
android.useAndroidX=true
android.enableJetifier=true
Finally we execute:
flutter packages get
Once the ID is modified, we verify that the newly installed application is executed in the two systems (we connect an Android mobile and an iPhone:
flutter packages get
flutter run -d all
(or starting the project from Android Studio)
This part is already implemented in the project, it is only informative
We add the plugins that we need Firebase in pubspec.yaml in the dependence section:
dependencies:
flutter:
sdk: flutter
# The following adds the Cupertino Icons font to your application.
# Use with the CupertinoIcons class for iOS style icons.
cupertino_icons: ^0.1.2
## AQUÍ DEPENDENCIAS FIREBASE Y OTRAS...
firebase_core: ^0.4.1+5
firebase_analytics: ^5.0.6
cloud_firestore: ^0.12.10
firebase_auth: ^0.14.0+9
google_sign_in: ^4.0.14
rxdart: ^0.22.6
provider: 2.0.0+1
font_awesome_flutter: 8.4.0
Once the plugins are defined, we install them:
flutter packages get
And we execute the app to see that everything works:
flutter run -d all
You can learn more about me on my website or read my articles on the blog