How to remove data from firebase

In earlier post we learned how to write/set , update, push data into firebase. We are gonna see how to delete data from database

To remove data we are just gonna use remove function.

firebase.database().ref().child(‘path’).remove();

To remove a data we need to mention the accurate path of the node for example if we are gonna remove just user name. we need to set the path as “users/user_name”, for email the path will be “users/user_email”. if we gonna remove the users totally we will be using “users/” as the path. Lets see how to remove

Let’s create a page to remove all users data under a new node.

<!DOCTYPE html>
<html>
<head>
<meta name=”format-detection” content=”telephone=no”>
<meta name=”msapplication-tap-highlight” content=”no”>
<meta name=”viewport” content=”user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width”>
<title>Sample</title>
</head>
<body></body>
</html>

Add this to your script src tag “https://www.gstatic.com/firebasejs/4.3.1/firebase.js”

Create a script and add the below credentials

// Use your config instead of this one
var config = {
apiKey: “AIzaSyCuXlfTMDrC3rXdPb442CkMEwNhYqYHu-U”,
authDomain: “sample-c7c91.firebaseapp.com”,
databaseURL: “https://sample-c7c91.firebaseio.com”,
projectId: “sample-c7c91”,
storageBucket: “sample-c7c91.appspot.com”,
messagingSenderId: “219135436098”
};
firebase.initializeApp(config);

Now let’s remove data from firebase

Lets create a button to remove users.. lets push this data in to your firebase app.

<button onclick=”removeData()”>Push to Firebase</button>

Now let’s write a script to remove users from your firebase.

const fb_db = firebase.database().ref()

function removeData(){
fb_db.child(‘users/’).remove()
}

By following the above steps, you will be able to remove the data successfully from firebase.

After integrating the script and html, the code should look like this.

Note: Make sure you have replaced the firebase config with your Firebase project config.

Okay, In next post lets see how to Read data in firebase

September 19, 2017 2

How to push data into Firebase

In earlier post we learned how to update data in firebase. In this post we are gonna see how to push data into firebase.

To write data, we are just gonna use push function.

firebase.database().ref().child(‘path’).push(‘data_to_push’)

Before entering to code let’s see what is PUSH, “PUSH” is nothing but writing data into firebase. “SET” also does the same thing.

Let’s see the difference between SET and PUSH.

“SET” writes data only to the same node but whereas PUSH create new node for each push.

Let’s see it in action.

Let;s create a page to push data under a new node.

Add this to your script src tag “https://www.gstatic.com/firebasejs/4.3.1/firebase.js”

Create a script and add the below credentials

Now let’s push data to firebase

Lets create a two input fields to enter name and email.. lets push this data in to your firebase app.

<input type=”text” name=”name” id=”user_name”>
<input type=”email” name=”email_id” id=”user_email”>
<button onclick=”pushData()”>Push to Firebase</button>

Now let’s write a script to create new node for each push and save name and email to your firebase.

const fb_db = firebase.database().ref()

function pushData(){
user_name = document.getElementById(“user_name”).value;
user_email = document.getElementById(“user_email”).value;
data = {user_name,user_email}
fb_db.child(‘users/’).push(data)
}

Now you have successfully pushed the data to the firebase.

The code looks like this.

Note: Make sure you have replaced the firebase config with your Firebase project config.

Okay, In next post lets see how to REMOVE data from firebase.

September 19, 2017 0

How to update data in Firebase

As we discussed regarding how to write data in previous post, Let’s see how to update data in firebase.

To update data we are just gonna use update function instead of set.

firebase.database().ref().child(‘path’).update(‘data_to_update’)

Let’s create a page to update the node

Add this to your script src tag “https://www.gstatic.com/firebasejs/4.3.1/firebase.js”

Create a script and add the below credentials

Now let’s update the data in firebase

Lets create a two input fields to enter name and email.. lets save this data in to your firebase app.

<input type=”text” name=”name” id=”user_name”>
<input type=”email” name=”email_id” id=”user_email”>
<button onclick=”updateData()”>Update Firebase</button>

Now let’s write a script to update name and email to your firebase.

const fb_db = firebase.database().ref()

function updateData(){
user_name = document.getElementById(“user_name”).value;
user_email = document.getElementById(“user_email”).value;
data = {user_name,user_email}
fb_db.child(‘users/’).update(data)
}

Now add the above function script to your app. Now you can update your data in your firebase.

Code should like this.

Note: Make sure you have replaced the firebase config with your Firebase project config.

Okay, In next post lets see how to PUSH data in firebase.

September 19, 2017 0

How to write data in Firebase

Hi, I know that you have already started to code, so let’s get into it. In previous blog, I have discussed about How to integrate firebase SDK into your web app. Let’s see How to write a data in Firebase. Let’s do it

Here’s the code to integrate firebase SDK to web app

Firebase SDK provides functions to set / push / update and remove data from firebase.

To Set data:

firebase.database().ref().child(‘path’).set(‘data_to save’)

Set is used to write a data in a node.

Add this to your script src tag “https://www.gstatic.com/firebasejs/4.3.1/firebase.js”

Create a script and add the below credentials

Now let’s see how to add data to firebase.

Lets create a two input fields to enter name and email.. lets save this data in to your firebase app.

<input type=”text” name=”name” id=”user_name” placeholder=”user name”>
<input type=”email” name=”email_id” id=”user_email” placeholder=”user email”>
<button onclick=”sendData()”>Send to firebase</button>

Now let’s write a script to add this name and email to your firebase.

I am just using native Javascript to do this, you can use jQuery to do this, I am coding in basic so that it will be easy for beginners to understand it.

const fb_db = firebase.database().ref()

function sendData(){
user_name = document.getElementById(“user_name”).value;
user_email = document.getElementById(“user_email”).value;
data = {user_name,user_email}
fb_db.child(‘users/’).set(data)
}

Now integrate the above script into your app,Now you can run this code …Wow….. you have added data successfully to firebase.

Code should look like this

Note: Make sure you have replaced the firebase config with your Firebase project config.

Okay, In next post lets see how to update the data in firebase.

September 14, 2017 0

Add Firebase to your Web

Hi, I am pragadeesh, Today let’s just get started to code in FIREBASE, which is an awesome database. Let’s get into it.

Before creating a web app, let’s create a project in firebase console.

Go to Firebase console and create a project, Here i have created a project with a name “sample”
you will be then redirected to the project Dashboard.
You can use firebase for building Android, iOS and web applications, for now let’s begin with web app, In future i will show you how to convert this web app to android and iOS using cordova.
Now let’s get the firebase web SDK . Just click the option “Add firebase to web app”, a dialog box appears with SDK credentials which you will be using to configure with your web app.
copy the script and add it in your Web app Script , Now you have integrated the firebase SDK to your web app and you’re ready to go. It’s simple right.
Here’s the sample code

<!DOCTYPE html>
<html>
<head>
<meta name=”format-detection” content=”telephone=no”>
<meta name=”msapplication-tap-highlight” content=”no”>
<meta name=”viewport” content=”user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width”>
<title>Sample</title>
</head>
<body>

</body>
</html>

Add this to your script src tag “https://www.gstatic.com/firebasejs/4.3.1/firebase.js”

Create a script and add the below credentials

// Use your config instead of this one
var config = {
apiKey: “AIzaSyCuXlfTMDrC3rXdPb442CkMEwNhYqYHu-U”,
authDomain: “sample-c7c91.firebaseapp.com”,
databaseURL: “https://sample-c7c91.firebaseio.com”,
projectId: “sample-c7c91”,
storageBucket: “sample-c7c91.appspot.com”,
messagingSenderId: “219135436098”
};
firebase.initializeApp(config);

Note : In firebase SDK you will be adding a external file like https://www.gstatic.com/firebasejs/4.3.1/firebase.js , this is their SDK which will include all features like authentication, database and messaging etc.

To use a feature individually in your web app then you can use just their particular SDK for example

Firebase App – https://www.gstatic.com/firebasejs/4.3.0/firebase-app.js
Firebase Authentication – https://www.gstatic.com/firebasejs/4.3.0/firebase-auth.js
Firebase Database – https://www.gstatic.com/firebasejs/4.3.0/firebase-database.js
Firebase Messaging – https://www.gstatic.com/firebasejs/4.3.0/firebase-messaging.js

To use all this SDK to one, then you can use https://www.gstatic.com/firebasejs/4.3.1/firebase.js

Now your file should look like this.

In next post, let’s see how to write in database.

September 13, 2017 0