Autres langues: anglais
Ce projet vise à être un modèle de base ou un démarreur pour démarrer un projet avec Flutter et Firebase rapidement.
Les paris se compose de deux écrans: Connexion et maison
Sur cet écran, l'utilisateur peut:
Écran que nous arrivons une fois identifié et cela nous permet de terminer la session.
L'application crée également un document dans la base de données appelée activité dans laquelle le temps d'utilisateur et l'ID sont enregistrés à chaque fois que vous vous connectez.
L'objectif de ce projet est de démontrer l'utilisation de Flutter ensemble avec Firebase pour créer rapidement une application avec un backend pour gérer les utilisateurs et l'authentification et une base de données pour stocker des informations.
Installez Flutter dans l'équipe de développement:
https://flutter.dev/docs/get-started/install/macos
Assurez-vous que nous avons installé Android Studio et Xcode:
Téléchargement Xcode
Téléchargement du studio Android (pour Mac)
Une fois installé, vérifiez l'installation avec:
flutter doctor
git clone [email protected]:ramoncardena/flutter-firebase-starter.git flutter-firebase-starter
cd flutter-firebase-starter
flutter packages get
Nous ouvrons le projet iOS dans Xcode: ~/flutter-firebase-starter/ios
Dans la structure du projet, nous sélectionnons le Root Runner et dans la section générale dans la section d'identité , nous définissons l'ID de bundle ( identifiant de bundle ) et la version ( version ).
Ensuite, nous allons à la section Signature et capacités et dans la section de signature , nous sélectionnons l'équipement ( équipe ) approprié pour signer le projet.
Passons au dossier du projet où la graduation est définie pour l'application dans: ~/flutter-firebase-starter/android/app/build.gradle
Et nous modifions la section defaultConfig avec l'ID d'application ( ApplicationId ) et définissons la version minimale de SDK ( Minsdkversion ) sur 21
defaultConfig {
applicationId "com.ramoncardena.firebasestarter"
minSdkVersion 21
targetSdkVersion 28
versionCode flutterVersionCode.toInteger()
versionName flutterVersionName
testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
}
Nous trouverons les informations détaillées en anglais, dans cet article.
Nous allons à la console Firebase.
Nous créons un nouveau projet et une fois créé, ajoutons deux applications, un Android et un autre iOS.
Nous créons une nouvelle application iOS à partir de la console Firebase et remplissons les données de base.
Ensuite, nous téléchargeons le fichier de configuration GoogleService-info.plist .
IMPORTANT: Nous ouvrons Xcode et avec le bouton droit du dossier Runner / Runner, ajoutant le fichier de configuration Firebase et Fermed Xcode.
De plus, pour l'authentification avec la connexion Google , nous devons ajouter la clé correspondante au fichier ios/Runner/Info.plist :
<!-- 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 -->
Nous créons une nouvelle application Android à partir de la console Firebase avec les données de base.
Pour ajouter la touche SHA Signature, à partir d'un terminal, nous allons dans le dossier du projet et exécutez:
keytool -list -v -alias androiddebugkey -keystore ~/.android/debug.keystore
(En tant que mot de passe, nous utilisons android )
À partir de cette partie, il est déjà mis en œuvre dans le projet, ce n'est que informatif
Ensuite, nous téléchargeons le fichier Google-Services . Paramètres et copiez-le dans le dossier du projet: android/app .
Une fois le fichier copié, nous devons configurer la graduation pour travailler avec Firebase. Nous modifions en premier lieu 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
// ...
}
}
Et sur 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
Enfin, nous modifions le fichier android/gradle.properties et ajoutez:
android.useAndroidX=true
android.enableJetifier=true
Enfin, nous exécutons:
flutter packages get
Une fois l'ID modifié, nous vérifions que l'application nouvellement installée est exécutée dans les deux systèmes (nous connectons un mobile Android et un iPhone:
flutter packages get
flutter run -d all
(ou démarrer le projet depuis Android Studio)
Cette partie est déjà mise en œuvre dans le projet, ce n'est que des informations informatives
Nous ajoutons les plugins dont nous avons besoin de Firebase dans pubspec.yaml dans la section de dépendance :
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
Une fois les plugins définis, nous les installons:
flutter packages get
Et nous exécutons l'application pour voir que tout fonctionne:
flutter run -d all
Vous pouvez en savoir plus sur moi sur mon site Web ou lire mes articles sur le blog