Hello friends , hope you all are doing good . I am back with a new article on firebase crud with javascript . So In this article I assume that you have already setup a Firebase project . If you haven’t setup a firebase project yet then you can read this article and setup a Firebase project . Now before moving towards the crud operations we have to integrate firebase in our project first so let’s get started .

Steps to integrate Firebase project in web project

Step 1 : Login to your Firebase console

First of all login to your Firebase console and select the project you’ve created earlier and then click on the web icon and register of a new web app by clicking on register app button . you will get a continue to console button click on that and you will redirect to your Firebase project console.

firebase crud with javascript
firebase web project

Step 2 : Make Firebase database for your Firebase project

When you will redirected to your Firebase project console then on the right hand side you will see realtime database button , click on that button then create database , select your region and start in test mode .

Now go to Rules tab and modify rules to the following rules and click on publish button

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

}

the meaning of thes rules is that anyone can read and write in the database .

Step 2 : Link Firebase credentials with your web project

Go to your project setting tab located in project overview section now scroll down to sdk setup and configuration section , click on config tab and copy all the Firebase credentials .

firebase crud with javascript

After that make a separate Javascript file for Firebase let say ‘firebase.js’ and paste all the credentials in that file and then paste the below code at bottom in firebase.js file


// Initialize Firebase
firebase.initializeApp(firebaseConfig);

and link firebase.js file along with Firebase app, auth and database link in your html file .

<script src="https://www.gstatic.com/firebasejs/7.15.5/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.15.5/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.15.5/firebase-database.js"></script> 
<script src = "firebase.js"></script>

Note : keep in mind to have the Firebase version same i.e., 7.15.5 while linking firebase app , auth , database to your web project .

You can visit my profile and follow me on :

Linkedin : https://www.linkedin.com/in/anand-raj-7ba6431a8

Twitter : https://twitter.com/anand__346

Youtube : https://www.youtube.com/channel/UC1DcIKA0zixS5LOJ1wV1lAg

Note : if you are interested in making your own chat application with the help of firebase , javascript and jquery then enroll the below course .You will get in-depth knowledge of firebase realtime database working with firebase auth.

Udemy Course link : https://www.udemy.com/course/chat-application-with-javascript-jquery-and-firebase/?referralCode=1747A5E2136F2B76D21C

Thank you for reading this article hope you gained some knowledge

see you again , peace out ✌