Creating web firebase app (browser based not server)

Firebase is a service that started as a real time database and expanded the services as it grew. The real time database provides a integration for sharing data in real time with no need to set up an infrastructure. This post aims to cover the web app creating in order to generate the javascript object needed to configure the javascript SDK.

Table of contents

  1. Requirements
  2. Creating the web app

Be aware that the javascript SDK used in this post is not the Nodejs, rather, the focus is in the client side only.

Requirements

  1. A google account
  2. Javascript basic experience

Creating the web app

The first step to create the web app is to go to the firebase console, and hit the plus button.

The project requires two steps to be filled in order to be created: project name and analytics. Therefore, if analytics is selected, there will be a third step to configure the analytics settings.

add new project - firebase console

Next up, choose a project name. It will be used to generate the project unique name and related information.

set a project name - firebase console

The next step is optional, but it comes enable by default. The analytics part of the project is used to track usage and different stats.

set the project analytics - firebase console

Select an analytics account if one you might want already exists or create a new one directly in the dropdown clickin on “Create a new account”. The last step is to hit “Create project”, and it will take a few seconds to finish.

project completed - firebase console

Once it is done, “Continue” button redirects to the created project dashboard page.

project dashboard - firebase console

Finally the next step is to choose the web platform to create the credentials for the project.

project web setup - firebase console

The web app also needs a name. This step is required as a single firebase project can have multiple applications. This post is focused on web app, but it is possible to create an android project or unity as well, each with its own name.

project web set name - firebase console

The checkbox hosting is optional and by default it comes unchecked. For this post I left as it is and hit the “Register” button.

project web completed - firebase console

Finally we have our credentials. The javascript object can be used in any client application. Hitting “Continue to console” redirects to the console dashboard, but this time it lists the created project as well.