OCASA News | Empowering Students with Every Story

Learn how to host and deploy applications on Firebase

Written by Abhay Dave | Oct 4, 2019 5:50:01 AM

Introduction-

Let's discuss hosting services in firebase and what are the simple steps to publish an application to firebase hosting really quick. But before this let's understand what and how of the firebase. As we all know this platform was developed by Firebase Inc in 2011, and later acquired by Google in the year 2014.

Description -

Things to cover in the process of deploying on firebase

  • How to register on Google Firebase.
  • How to start the project inside Google Firebase.
  • How to publish the application on Google Firebase.
  • How to test and check the status of your deployed application on Firebase.

By following the below steps you can cover all the questions mentioned above and can reach the final session of deploying on firebase.

Step 1

Register with google firebase

Let's visit Google Firebase first. If you don’t have google firebase account please register with google firebase.

Below given URL is for registration

https://console.firebase.google.com

Step 2

Start the project inside Google Firebase.

  1. Create a project in firebase console

  1. Add google analytics to your project

  1. Create a google analytics account
  1. Create a firebase project
  1. After creating project continue to firebase console

Step 3

Upload the application on google firebase

  1. Get started with hosting part

  1. Install Firebase CLI

<code class="language-bash">npm install -g firebase-tools</code>

Setup firebase hosting

Initialize your project

  1. Sign in to google

Use this command to login into firebase

<code class="language-bash">firebase login</code>
  1. Initialize your project

Go to your project directory then initialize firebase in your project with firebase init command

<code class="language-bash">cd dist/angular-pwa-demo/firebase init</code>
  1. Choose this option for hosting

<code class="language-bash">Hosting: Configure and deploy Firebase Hosting sites</code>
  1. Put your directory name for a project

You will get a message from the command line

<code class="language-bash">What do you want to use as your public directory? : angular-pwa-demoConfigure as a single-page app (rewrite all urls to /index.html) ? : nFile angular-pwa-demo/index.html already exists. Overwrite? : n</code>
  1. Deploy to firebase hosting

Go to your project directory then deploy your project to firebase hosting

<code class="language-bash">firebase deploy</code>

Step 4

Check the status of your deployed application on Firebase

  1. Open firebase console
  2. Go to hosting option
  3. There are auto-generated links for your deployed application

Reference link

https://angular-pwa-demo-23e6c.firebaseapp.com/

Conclusion-

Above shown steps help you in an easy hosting application on firebase. Further, this will help you in getting free hosting with limited use. From registering to status checking and deployment step by step procedure will guide you in hosting. In case if you are stuck or have any queries feel free to contact me and you can leave your valuable comments in the comment section below.