About Me

W3Schools

Firebase RealTime Database to Your Website

Solutionlink 12:58 AM

 How To Access/Read&Write the Data to your Website from Firebase Realtime Database

             BY Balla Dani Hemanth

 

Hello Guys,
  Let's get Started 
      Hello EveryOne after following this post you may capable of reading/writing data from your website 
You may also use Arduino, Raspberry pie and other boards can simply communicate with firebase Real-time Database I provided complete Script codes in my GitHub check out
https://github.com/danihemanth/Firebase-realtime-database-to-Website-codes


After Setting Up of firebase Account activating real-time Database 
To setup, Firebase account follow my other Setup Firebase Post

Step 1:

     
 Initially, my Realtime database has Parent and child names I have created as given below
A format such as "user" as the parent root node and has the child nodes as "Name" of the person
And again Name contains sub child nodes as "Country", "Gender", "Name"
   by the way, I followed this format throughout this script You guys may Changes as per your
  requirements, In that case, don't forget to change the id tags in PHP






   Step 2:

  After completion of Creation of nodes in firebase 
        Download the References Codes from my Github Link given Below

  Step 3: 

  After completion of Download open the PHP file you want to change you will find

<script>
    // Your web app's Firebase configuration
    var firebaseConfig = {
        apiKey: "AIzaSyBiCasLzsPZTObojflj5FmbdR56FwEsT-8",
    authDomain: "iotfirebaseproject-760c1.firebaseapp.com",
    databaseURL: "https://iotfirebaseproject-760c1.firebaseio.com",
    projectId: "iotfirebaseproject-760c1",
    storageBucket: "iotfirebaseproject-760c1.appspot.com",
    messagingSenderId: "461152123840",
    appId: "1:461152123840:web:87a2fe8378c166c6322625"
  };
    // Initialize Firebase
    firebase.initializeApp(firebaseConfig);
</script>
  
Above code where you want to change all parameters values

Step 4:

The firebaseConfig will get from 

   *Get config object for your website/Html/PHP
  1. Sign in to Firebase, then open your project.
  2. Click, then select Project settings.
  3. In the Your apps card, select the nickname of the app for which you need a config object.
  4. Select Config from the Firebase SDK snippet pane.
  5. Copy the config object snippet, then add it to your app's HTML



Their you see ADD APP button(Blue button) under Your app Section
 Click on that and select web icon displayed then your  firebaseConfig  parameters is generated 

Step 5:

Almost Done! 
Copy the Complete config and replace in the Downloaded Script from my Github

Step 6:

As we are using PHP format if you have XAMPP you  may simply open the file and check to work and accessing from RealTime Database 

Don't Worry If you not aware of it 

Step 7:

After completion of changing the Code as per required save it and Upload the complete Folder to your Hosting Root Directory 

Don't Worry If you don't have Paid Hosting Service
  I will tell You a superb way that you can host your website at FREE of cost
     That is Hosting In Google Drive 

    First, Upload the Complete Website Folder to your drive 
Note: Make the complete as Public 
          *  How can I make my Google Drive document public?
  1. Login into your Google Drive.
  2. Select the document that you want to make Public.
  3. Right-click on the document and select the Share option.
  4. Click the Advanced button.
  5. On the Sharing Setting window, click Change link.
  6. On the Link Sharing window, select the Public on the web option.
  7. Click on the Save button.
  8. Click on the Done button.

After Completion of making Folder Public

open this website this site helps to grab your links Contained in your drive

Select your google drive and Log in 
You will find your HTML/XML/PHP present in the public folder
click on the link it open as a website it loads complete data Online 


if You have any Domain Name Registered you may Redirect Obtained link
that will direct the traffic to the website which is Your free of Cost Hosting

If You Cannot Afford to buy a Domain name you can use 

FREENOM website Which provides free domains Guys Don't use .tk Extension 
some of hosting sites removed this Extension officially as website Extension
Except .tk may Use any Extension which is available freely


Thank You Guys if You have any doubts about app scripts, Web development
and 
Arduino Board Tutorials

If you want any types of paid templates for FREE Word press,DIVI Templates
Direct message Us Instagram: dani_joy_earth

Youtube: Dani joy Earth
https://www.youtube.com/channel/UCUss7NtRxcY0KXNOEWjKDLA

Feel free to Message Us We respond for mails
balladanihemanth@gmail.com







Post a Comment

0 Comments