> For the complete documentation index, see [llms.txt](https://enappd.gitbook.io/ionic-6-vue-capacitor-full-app/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://enappd.gitbook.io/ionic-6-vue-capacitor-full-app/firebase-setup/new-firebase-project-setup.md).

# New Firebase Project Setup

This page describes...... Follow the steps to....

It includes the 2 main steps :-&#x20;

1. **Creating a new firebase project**
2. **Add firebase to your web app**

### 1. Creating a new firebase project

Open your [firebase console](https://console.firebase.google.com). You will see the screen shown below. Click on "Add Project" to create your new project.&#x20;

<figure><img src="https://1619460714-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJlAveQ57VJ0mNRF3CePM%2Fuploads%2FJveDOucOlK3XDnGYgm7G%2Fabc1.png?alt=media&amp;token=09648816-a965-45ac-b183-828ff96baae1" alt=""><figcaption></figcaption></figure>

Write name of your project and click on "Continue". In this case, we have named our project as “VueFirebase”.

<figure><img src="https://1619460714-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJlAveQ57VJ0mNRF3CePM%2Fuploads%2FyZarHnmLGchbipZNjeyV%2Fabc2.png?alt=media&amp;token=c8e7f553-f8f5-4e2c-9b9c-87c964ccc3a9" alt=""><figcaption></figcaption></figure>

&#x20;Once you see "Configure Google Analytics" screen - Choose or Create your Google Analytics account, as shown below. Now click on "Create project"

<figure><img src="https://1619460714-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJlAveQ57VJ0mNRF3CePM%2Fuploads%2FNg7PJRuWpdv2hire9oUi%2Fabc3.png?alt=media&amp;token=e227ca31-d7e3-40d8-8ac8-47ddbe4c9c4c" alt=""><figcaption></figcaption></figure>

Please wait for a while your project is being created

<figure><img src="https://1619460714-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJlAveQ57VJ0mNRF3CePM%2Fuploads%2FPEmGhuw1HD6mZWjmXUKD%2Fabc4.png?alt=media&amp;token=d62d1b2c-7d0c-4806-a94a-8d3486fe2c20" alt=""><figcaption></figcaption></figure>

### 2. Add firebase to your web app

The image below the default screen after your project is successfully created. Click on “Project settings”

<figure><img src="https://1619460714-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJlAveQ57VJ0mNRF3CePM%2Fuploads%2F7PYmw3TxIzNK7iYecfCD%2Fabc5.png?alt=media&amp;token=4343472b-2d19-4ccd-951d-82bb805c1f4c" alt=""><figcaption></figcaption></figure>

Scroll down the page and go to the last section which says “There are no apps in your project”.  Select the 3rd option with this icon  “\</>” to add firebase to your web app.

<figure><img src="https://1619460714-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJlAveQ57VJ0mNRF3CePM%2Fuploads%2F0dGonXAPRugO2HGYewMQ%2Fabc6.png?alt=media&amp;token=0010cef5-c6c6-4787-9052-325b571b05f0" alt=""><figcaption></figcaption></figure>

Register your app by providing name in the "App nickname" section and click on "Register App" button. In this case, we have used “VueFirebase” in the App nickname section.

<figure><img src="https://1619460714-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJlAveQ57VJ0mNRF3CePM%2Fuploads%2FFaHHs0VNAAwfO0Xn2LnO%2Fabc7.png?alt=media&amp;token=1d590744-bf2b-4ef3-b554-42e2bf64a845" alt=""><figcaption></figcaption></figure>

You should see the following screen.

<figure><img src="https://1619460714-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FJlAveQ57VJ0mNRF3CePM%2Fuploads%2FCGv2CsObIxmqzHigCy8a%2Fimage.png?alt=media&amp;token=b92f0600-4c04-42bc-b5e9-b084e2f591e7" alt=""><figcaption></figcaption></figure>

Select the following section of code, as shown below and copy it to some text editor as it will be used at multiple places in next steps.

### Adding firebase to project

Now we will add firebase to our project.

Go to Add Firebase to Project section to see how to do it.
