firebase Tutoriel
Démarrer avec Firebase

Remarques

Versions

Ajouter Firebase à votre projet Android

Voici les étapes requises pour créer un projet Firebase et pour vous connecter à une application Android.

Ajouter Firebase à votre application

1. Créez un projet Firebase dans la console Firebase et cliquez sur Créer un nouveau projet .

2. Cliquez sur Ajouter Firebase à votre application Android et suivez les étapes de configuration.

3. Lorsque vous y êtes invité, entrez le nom du package de votre application .
   Il est important de saisir le nom du package utilisé par votre application. Cela ne peut être défini que lorsque vous ajoutez une application à votre projet Firebase.

4. Pour ajouter le certificat de signature de débogage SHA1 requis pour les liens dynamiques, les invitations et la prise en charge de Google Sign-In dans Auth, accédez à votre projet dans Android Studio, cliquez sur l'onglet Gradle à droite de la fenêtre, cliquez sur le bouton Refresh . pour project(root) -> Tasks -> android -> signingReport . Cela va générer MD5 et SHA1 dans l'onglet Run . Copiez collez SHA1 dans la console firebase.

5. À la fin, vous allez télécharger un fichier google-services.json . Vous pouvez télécharger ce fichier à tout moment.

6. Si vous ne l'avez pas déjà fait, copiez-le dans le dossier du module de votre projet, généralement app /.

L'étape suivante consiste à ajouter le SDK pour intégrer les bibliothèques Firebase dans le projet.

Ajouter le SDK

Pour intégrer les bibliothèques Firebase dans un de vos propres projets, vous devez effectuer quelques tâches de base pour préparer votre projet Android Studio. Vous l'avez peut-être déjà fait dans le cadre de l'ajout de Firebase à votre application.

1. Ajoutez des règles à votre fichier build.gradle niveau build.gradle pour inclure le plug-in google-services :

buildscript {
    // ...
    dependencies {
        // ...
        classpath 'com.google.gms:google-services:3.0.0'
    }
}

Ensuite, dans le fichier Gradle de votre module (généralement app/build.gradle ), ajoutez la ligne de plug-in apply au bas du fichier pour activer le plug-in Gradle:

apply plugin: 'com.android.application'

android {
  // ...
}

dependencies {
  // ...
  compile 'com.google.firebase:firebase-core:9.4.0'
}

// ADD THIS AT THE BOTTOM
apply plugin: 'com.google.gms.google-services'

La dernière étape consiste à ajouter les dépendances du kit SDK Firebase en utilisant une ou plusieurs bibliothèques disponibles pour les différentes fonctionnalités Firebase.

Configuration de Firebase pour IOS

1. Tout d'abord, vous souhaitez accéder au tableau de bord de Firebase et créer un nouveau projet à l'aide du bouton "Créer un nouveau projet".

2. Vous souhaitez créer un nouveau projet en ajoutant le nom de votre application, par exemple, je mets le mien en tant que «Cool app name», puis choisissez votre région et appuyez sur «Create Project».

3. Après avoir créé le projet, vous serez dirigé vers cette page qui est le tableau de bord et à partir de là, vous devez choisir une plate-forme sur laquelle vous souhaitez installer Firebase pour cet exemple, nous choisirons IOS.

4. Après avoir sélectionné IOS, vous devriez voir la même fenêtre que celle de l'image ci-dessous demandant le paquet IOS et l'ID du magasin d'applications. Vous aurez seulement besoin de fournir le paquet IOS car notre application ne figure pas encore sur l'App Store.

5. Obtenez l'ID de bundle de xcode après avoir créé un projet xcode de toute façon vous devriez normalement obtenir l'identifiant de bundle pour votre application sur la vue Genral de l'application dans xcode, il sera le premier champ en haut et une fois le champ Bundle dans firebase par exemple le mien serait 'MauginInc.KIKOO'

6. Après avoir fait cela et appuyé sur "Suivant", un fichier "GoogleService-Info.plist" sera téléchargé et ce que vous devez faire est de le déplacer dans le dossier racine de votre application dans xcode.

7. Vous voudrez initialiser les modules et installer les modules de base de données dont vous avez besoin pour effectuer cette opération en accédant à votre terminal et en accédant à votre dossier de projet xcode et suivez les instructions données par firebase.

8. Enfin, vous voulez configurer votre application pour que swift fasse ce qu'elle fait de mieux et que cela rend le développement d'applications beaucoup plus facile et efficace.

C'est tout ce que vous avez maintenant FireBase installé dans votre projet xcode pour IOS

Mise en route de Firebase avec une simple application Web Hello World en JavaScript

Cet exemple montre comment démarrer avec Firebase dans vos applications Web avec JavaScript.

Nous allons ajouter un enfant de texte dans notre base de données Firebase et l’afficher en temps réel sur notre application Web.

Commençons.

• Accédez à la console Firebase - https://console.firebase.google.com et créez un nouveau projet. Entrez le nom du projet, pays / région et cliquez sur créer un projet .

• Maintenant, créez un fichier index.html sur votre ordinateur. Et ajoutez-y le code suivant.

    <body>
        <p>Getting started with Firebase</p>
        <h1 id="bigOne"></h1>
        <script>
              // your firebase JavaScript code here
        </script>
  
    </body>
  

• Maintenant, allez à votre projet sur Firebase Console et vous pouvez le voir

• Cliquez maintenant sur Ajouter Firebase à votre application Web . Vous verrez apparaître la fenêtre suivante, cliquez sur le bouton de copie

• Maintenant, allez dans votre fichier index.html et ajoutez l'extrait de code à la section script comme suit

    <body>
  
      <p>Getting started with Firebase</p>
      <h1 id="bigOne"></h1>
  
      <script src="https://www.gstatic.com/firebasejs/3.7.4/firebase.js"></script>
      <script>
        // Initialize Firebase
        var config = {
          apiKey: "apiKey",
          authDomain: "authDomain",
          databaseURL: "databaseURL",
          storageBucket: "storageBucket",
          messagingSenderId: "messagingSenderId"
        };
        firebase.initializeApp(config);
      </script>
    </body>
  

• Vous avez maintenant terminé d'ajouter le code d'initialisation Firebase. Maintenant, nous devons obtenir notre valeur de texte de la base de données.

• Pour ce faire, ajoutez le code suivant (Initialize Firebase déjà ajouté à la dernière étape. Ne pas rajouter) dans le script dans index.html

    <script>
  
        // Initialize Firebase
        var config = {
          apiKey: "apiKey",
          authDomain: "authDomain",
          databaseURL: "databaseURL",
          storageBucket: "storageBucket",
          messagingSenderId: "messagingSenderId"
        };
        firebase.initializeApp(config);
    
        // getting the text value from the database
        var bigOne = document.getElementById('bigOne');
        var dbRef = firebase.database().ref().child('text');
        dbRef.on('value', snap => bigOne.innerText = snap.val());
  
    </script>
  

• Maintenant, nous avons tous terminé avec le fichier index.html et allons maintenant dans la base de données dans Firebase Console.

• Vous verrez que c'est vide et vide maintenant. Permet d'ajouter un enfant texte dans la base de données et d'y ajouter une valeur.

• Cliquez maintenant sur le bouton AJOUTER .

• Maintenant, allez à la section RÈGLES de la base de données.

• À des fins de développement, nous allons maintenant activer toutes les requêtes de lecture et d'écriture .

    {
      "rules": {
          ".read": "true",
          ".write": "true"
        }
    }
  

  

• Maintenant, ouvrez index.html dans le navigateur

• Vous verrez la valeur de texte sur votre page comme suit -
  

• Maintenant, si vous revenez à votre base de données et que vous modifiez la valeur du texte pour enfant , vous verrez que le texte dans le navigateur change également sans aucune actualisation ou rechargement. Voici comment la base de données en temps réel fonctionne sur Firebase.