How to Setup a Firebase for your React Project ?
Last Updated :
09 Dec, 2020
In order to set up a firebase for your project, just follow these simple steps:
1. Go to console.firebase.google.com
2. Click the Add Project button, if you are a new user, it might say Create a New Project or something like that. It will look like this for existing users as shown below:
3. Once you click it, type discord-clone for the name of your project.
4. For the next step, you can enable Google Analytics if you would like, however, it’s not required.
5. After that you’ve selected your choices Firebase will start to create the project for you. Once it’s done it should look like as shown below:
6. Once you get this, you can click Continue. Firebase will take you back to the project’s screen then click the button which is pointed in the following image(</>):
7. You will be asked for a name for the web application, you can put whatever you like. However, We have used discord-clone for this example. Once you type in the name, click the Register App button.
8. It will ask you to add your Firebase SDK, but for now you can just click the blue button and go forward.
9. Go to the authentication tab on the sidebar and click on it.
10. Then click on the Sign-in Method tab and select Google and then toggle Enable. After you’ve completed that click the Save button.
11. Now that you’ve set up authentication, click the Firestore logo below the authentication logo. Click on the Create database button once you’ve done so. Then choose the Start in test mode option and then click Next and after that click the Enable button.
After you have followed these above steps, the firebase is set up for your project.
Similar Reads
How to Deploy React project on Firebase? When developing any project we must host it somewhere so that the whole world can see our hard-work. Hosting websites can be hectic sometimes, but you don't need to worry as we can now host our React project on Firebase within a minute or two with a very simple setup. The Steps to deploy react proje
2 min read
Folder Structure for a React JS Project Organizing a React project with a well-planned folder structure is very important for readability, scalability, and maintainability. A clear structure helps in managing code, configurations, modules, and other assets effectively. In this article, we are going to learn the folder structure of the Rea
5 min read
Setting up Firebase Hosting in your project Firebase Hosting is a service by Google that allows you to host your web app quickly and securely. This article will guide you through the process of setting up Firebase Hosting for your project, from installing the necessary tools to deploying your app. By the end of this article, you'll have a liv
5 min read
Adding Firebase to Your JavaScript Project Firebase is a powerful platform that offers a range of services to enhance our web application. From authentication to real-time database storage, Firebase provides everything you need to create a dynamic and engaging user experience. In this guide, we will go through the process of setting up Fireb
8 min read
How to list all the files from firebase storage using ReactJS ? To list all the files from Firebase storage using React JS we will access the Firebase storage using the SDK and display the data on the webpage from the storage.Prerequisites:NPM & Node.jsReact JSFirebaseApproach: To list all the files from Firebase storage using ReactJS we will first configure
3 min read