Firebase Connectivity

To add the built-in database features to the firebase database, or to connect the project’s custom database then follow the below steps to fulfill your requirements.

You can see the firebase data format in src > assets > data > product.json the file.

Step1. To add Firebase to your app, you’ll need a Firebase project, Firebase SDK and a short snippet of initialization code that has a few details about your project.

Step2. Firebase uses Json Format data and you have to add/ create your database which you can access under Develop > Database . Also, you can do changes in src > assets > data > product.json file according to your products and import this file from firebase > develop > database > Realtime database dropdown > Import JSON under more icon.

Step3. After you are done copy the initialization code snippet, we will use this code in the next step. – To get the initialization code go to Project Overview > Project Settings and click on the </> icon to access your code.

Step4. Open the file in src > firebase > index.js  and search for the var config & paste the code inside it.

// Initialize Firebase 
var config = { 
   apiKey: ’<your-key>’, 
   authDomain: ’<your-project-authdomain>’, 
   databaseURL: ’<your-database-URL>’, 
   projectId: ’<your-project-id>’, 
   storageBucket: ’<your-storage-bucket>’, 
   messagingSenderId: ’<your-messaging-sender-id>’ 
};

Step5. And Import firebase in the file where you can get data.

// firebase 
import firebase from ’../../firebase’; 
import ’firebase/database’;

...

getBannerData() { 
   const bannerRef = firebase.database().ref(‘banner_two’); 
   bannerRef.on(‘value’, (snapshot) => { 
     let banner = snapshot.val(); 
     this.setState({ banner: banner }); 
   }); 
}

Last Updated 4 years ago
Generic selectors
Exact matches only
Search in title
Search in content
Search in posts
Search in pages