Skip to main content

Deploying web app with Firebase Hosting

Firebase Hosting provides production-grade, fast and secure (HTTPS - HTTP over TLS) static hosting for your web app.It can be used to deploy web applications (JavaScript based applications) or to deploy a static content to a global content delivery network (CDN) with a single command. In this tutorial, In this tutorial static website is hosted using Firebase Hosting feature.
Key capabilities
  • Files are served over a secure connection.
  • Content is uploaded to SSDs at CDN edges around the world and cached to provide fast delivery.
  • Firebase CLI provides facilities for rapid deployment.
  • Developers can easily rollback to a previous deployment.
Due to the rise of front-end JavaScript frameworks static web apps have become the de facto of modern web development. Whether you are deploying simple static web apps or large scale web app, firebase hosting provides the infrastructure, features, and tooling to successfully deploy the web app.

Hosting provides auto-generated subdomain on the firebaseapp.com domain and developer can verify custom domain to redirect the website. Firebase automatically provisions an SSL certification to the custom domain so all the content are served securely. Using the Firebase CLI, the developer can deploy files from current directory to the hosting server. Files are served over an SSL connection, due to this reason if website or web app use unsecured (HTTP) connection to retrieve files like fonts, it will be blocked. Developers have freedom to rewrite URLs for client-side routing or set up custom headers.

Currently, Firebase does not provide a way to execute code on Firebase servers. PHP or any other server-side language do NOT work in the Firebase infrastructure.

Implementation path
  1. Install the Firebase CLI.
  2. Set up a project directory.
  3. Deploy the web app.
Install the Firebase CLI

 To install the Firebase CLI, you needs to install Node.js. Once you install the Node.js you can install the Firebase CLI using npm (Node Package Manager) by running the following command. You don't have to go to the project directory to install Firebase CLI ( It is installed globally using -g).

npm install -g firebase-tools

It will take couple minutes to install Firebase CLI depending on your Internet bandwidth. Once the installation is done, use the following command to log into the firebase. It connects the local machine to the Firebase account and grants access to all your projects. To test whether you can access all of your projects type firebase list command.

firebase login

Set up a project directory

For many tasks such as deployment, Firebase CLI requires project directory. It contains firebase.json configuration file. It should generally be the same as project root. To initialize a new project directory, go to your project root and type the following command.

firebase init

Deploy the web app

 To deploy the web app, type the following command.

firebase deploy

Go to the Hosting page in the Firebase Console and it will display all the deployments.



Labels:

Comments

Post a Comment

Popular posts from this blog

Alternatives to the SQLite in Android

At the moment there are several embeddable databases and libraries out there that you can use in a mobile application. In this post, I examine most popular libraries and databases and highlight some of their characteristics. Realm Realm is a mobile platform and a replacement for SQLite & Core Data. According to the website, it has more than 100k active developers. Realm is fully open source and distributes under Apache License. Realm Mobile Database is much faster than an ORM, and often faster than raw SQLite due to zero-copy design. Some of the benefits of Realm are fast queries, safe threading, encryption of data and reactive architecture. You can learn more about Realm by visiting this page . Sugar ORM Sugar ORM is a library that can be used to interact with SQLite database using Object-Relational Mapping. Object-Relational Mapping (ORM) is a technique that used to query and manipulate data from a SQLite database using an object-oriented paradigm. And Suga...
2 comments
Read more

Laravel 5.4 Bootstrap row class for every 3 columns

Sometimes you need to show three or four columns in a row using Laravel 5.4 and blade template engine. Here I show how to do it using chunk function in Laravel blade. As the first step let's get products from the database and pass it to the blade view. And let's check our blade file. In the following example,  @ foreach  takes the  $ products array and chuck it. In this example, I split it by three. You can pass any number according to your specification. And you will see the inner @ foreach loop through  $ items. If you have any question please comment it and I will try to solve it.
Post a Comment
Read more