Create your first firebase project - Introduction to firebase

Google firebase service provides us to create awesome web applications without having a server. Google Firebase is a Backend-as-a-Service (Baas) that provides several services, some of them are listed below-

• Authentication
• Firestore – No SQL Database
• Real-time database
• Firebase storage
• Hosting
• Cloud function
• Analytics
• Machine Learning
• Cloud messaging

In this article, we will know how to create a firebase project and how can we add firebase to our project. So, without wasting any time, let get started-

Create a Firebase project

Now, we are going to a firebase project on firebase. To create a project, follow these steps-

1. Open https://firebase.google.com and click login with your Google account. After that click on get started.
2. Click on Add Project. Enter your project name. Then click on continue.

3. Optional: If you want to connect your google analytic account, then click on Enable Google Analytics for this project. After that, click on continue and select your google analytic account.

4. If you do not want to connect to google analytic, then click on create project.
5. It will take a minute to create your project. When it is ready, click on continue. It will redirect to the firebase dashboard.

Add Firebase configuration to project

Now, we need to add firebase configuration to our app. First, we need to get config details from the firebase dashboard. For that, follow these steps-

1. Click on we web icon which is located under the heading Get started by adding Firebase to your app.

2. It will ask you to register your app. Enter your app name. Also enable firebase hosting, so that we can host our project after completing it. After that, click on Register App.

3. Now, We need to install firebase SDK to our project. We can install firebase SDK by using npm or yarn.

npm install firebase
# or
yarn add firebase

4. Copy the firebase configuration.

var firebaseConfig = {
  apiKey: 'API_KEY',
  authDomain: 'PROJECT_ID.firebaseapp.com',
  databaseURL: 'https://PROJECT_ID.firebaseio.com',
  projectId: 'PROJECT_ID',
  storageBucket: 'PROJECT_ID.appspot.com',
  messagingSenderId: 'SENDER_ID',
  appId: 'APP_ID',
  measurementId: 'G-MEASUREMENT_ID',
}

5. Create a firebase.config.js file inside your src folder of the project and add the code written below.

import { initializeApp } from 'firebase/app';
const firebaseConfig = {...};
const app = initializeApp(firebaseConfig);

6. That’s all. Firebase configuration is done. If you still facing any issues, then you can refer to the official documentation of firebase by clicking here.

Now, you can start using firebase services in your project. If you have any queries, feel free to contact me https://gyanendra.tech/#contact. Thanks.