Host websites for free in Firebase
How to host a website for free in Google’s Firebase cloud?
Firebase is a Backend-as-a-Service — BaaS — that started as a YC11 startup and grew up into a next-generation app-development platform on Google Cloud Platform.
Firebase includes an easy-to-use hosting service for all of your static files. It serves them from a global CDN with HTTP/2.
If you are using Node.js as backend, Firebase supports it. But it doesn’t support common web languages like PHP.
It is great platform to host static websites as it is free and also Firebase Hosting provisions a free SSL certificate, signed by Let’s Encrypt.
Requirements :
0. Node.Js
You can download Node.js from here https://nodejs.org/en/ . It’s really easy to install it.
1. Firebase
You have to install firebase-tools to use Firebase.
It’s super easy to do that. Just execute this command in cmd/powershell/terminal
> npm install -g firebase-tools This will install Firebase on your computer.
2. A Google account
Obviously, you need a google account to use Firebase.
FYI — We programmers count from zero. 🙅
Well then, Let’s get started.
Step 0:
Go to https://console.firebase.google.com/ and add project. You will understand when you see it. It will only take a minute or two.
Click on Hosting on the left .
Click get started button and finish it.
Then you will be redirected to hosting dashboard. Something like this. 👇
Step 1:
Open your terminal or cmd or powershell or whatever.
Login to firebase from it. You only have to do it once. Just enter the following command.
> firebase loginThis will open a webpage for you to login. Just login to it.
Step 2:
Goto the project directory (I have a folder named myWebsite on desktop with 1 HTML file and 1 folder with 2 images).
Step 3:
Enter the following command
> firebase init
Choose hosting by using down arrow and bash the space-bar to select hosting.
Click enter to continue.
Now you be asked to select an option.
Choose Use an existing project and hit enter
Now use arrow keys to choose your project and hit enter.
Next you will encounter this:
? What do you want to use as your public directory? (public) _
Type any name you like or just hit enter to go with default(public).
? Configure as a single-page app (rewrite all urls to /index.html)?
Just hit no.
Step 4:
Now if you go and check your project directory you will see a folder named public.
Just delete everything inside it (index.htm & 404.html)and copy all your website files into it.
Goto cmd again and type this to start a local server — localhost
> firebase serve=== Serving from 'C:\Users\Ijas\Desktop\myWebsite'...i hosting: Serving hosting files from: public
+ hosting: Local server: http://localhost:5000
The port may change sometimes. If you go to that url, you can view your website.
Step 5:
If everything is ok 👌, enter this to deploy website to firebase.
> firebase deploy=== Deploying to 'mywebsite-9d87a'...i deploying hosting
i hosting[mywebsite-9d87a]: beginning deploy...
i hosting[mywebsite-9d87a]: found 3 files in public
+ hosting[mywebsite-9d87a]: file upload complete
i hosting[mywebsite-9d87a]: finalizing version...
+ hosting[mywebsite-9d87a]: version finalized
i hosting[mywebsite-9d87a]: releasing new version...
+ hosting[mywebsite-9d87a]: release complete+ Deploy complete!Project Console: https://console.firebase.google.com/project/mywebsite-9d87a/overview
Hosting URL: https://mywebsite-9d87a.web.app
It will take some time based on your connection speed. Now the files are uploaded to Firebase.
You can goto that url you find in terminal to visit your website.
You can also find the url at firebase console hosting dashboard.
Well, that’s it. Done. 👍
