Free Hosting for your Web - Hugo with Google Firebase

So you got your HUGO website ready, it looks beautiful in your computer.

Now you want to share it with the rest of us and you need to host HUGO somewhere and point it to your Domain.

Here it comes Google Firebase, a platform that provides tools and services for building and managing (mobile) and web applications.

You can consider it as a Serverless Backend. Also Firebae makes really simple to deploy your HUGO Site for free with your own domain. Just remember, this is Propietary stuff and it will work as long as Google wants to keep it for Free. You can use it and later be prepared with some alternative.

Why HUGO + Firebase?

Firebase can be a convenient choice for hosting a website due to its simplicity and ease of use. It provides reliable and scalable hosting infrastructure, along with features like content delivery network (CDN) integration, automatic SSL certificate provisioning, and easy deployment through a simple command-line interface or integration with popular development frameworks.

This allow us to focus on building their website without worrying about server infrastructure: setup, maintenance, and scaling, making the hosting process streamlined and hassle-free.

Because there are too many things to pay attention too, right? The content of the web, making the web, oh also where to deploy it…thats where Firebase can help you.

Hosting HUGO with Firebase

We just need these steps:

• Get the dependencies for firebase installed
• Install firebase
• Initialize Firebase in your Static web folder and execute the deploy command

Well, and before that you should get a HUGO static site on your PC ready to be deployed. This will work with other SSGs sameless.

How to install Firebase dependencies in Windows

You will need to have available nodejs in your machine.

Then, go to the terminal and use:

#sudo apt install npm
#npm --version

npm install firebase
npm install -g firebase-tools
firebase login

To complete firebase setup, go to the desired folder and initialize it:

firebase init
#select with space, next with enter

It will asks you wheter you want to initialize a firebase project in the current folder You need to choose: “Hosting” - Configure files for firebase hosting, public, is not a single page app, we dont need automatic build and deploys and overwrite public/html.index -> no

Deploying Webs with Firebase

Last step, make sure that you have generated all your changes in Hugo to the public folder, for that you have to use:

.\hugo 

Then just let firebase do the magic with:

firebase deploy

And that’s all!

FAQ

What if I am getting authentication error?

Try to log in and reuthenticate with:

firebase logout
firebase login --auth

How to notify Google about your site

• To ping Google’s engine to review your site’s sitemap:

curl "https://www.google.com/ping?sitemap=https://www.example.com/sitemap.xml"

• Don’t forget about Bing Search as well:

curl "https://www.bing.com/ping?sitemap=https://www.example.com/sitemap.xml"

How to use Cloudflare CDN in front of Firebase

• Add your domain as a site in Cloudflare (There is a free tier)
  • You need to verify the ownership
  • Add Cloudflare DNS to your domain registry and remove the existing ones
  • You will receive one email from cloudflare confirming that the process is completed
• Add the Firebase Registries from https://console.firebase.google.com/ to https://dash.cloudflare.com/
  • Remember to set the Proxy Status for these records as DNS only on Cloudflare - This will avoid the Err_too_many_redirects!

What are the benefits of using Cloudflare as a CDN in front of Google Firebase

• Improved Performance: Cloudflare’s global network of data centers can help improve the performance of your Firebase-hosted content by caching it closer to your users, reducing latency and improving load times.

• Increased Security: Cloudflare provides a layer of security between your Firebase content and the public internet, helping to protect against DDoS attacks, malicious traffic, and other threats.

• Cost Savings: Cloudflare’s CDN services are often less expensive than other CDN providers, and by caching content closer to users, you can also reduce your Firebase hosting costs.

• Advanced Features: Cloudflare offers advanced features such as web application firewall (WAF), DDoS protection, and content optimization, which can help improve the security and performance of your Firebase content.

What are F/OSS alternatives to Firebase?

• Self-hosting your Static WebSite
• Supabase
• PocketBase

Firebase Cons

One potential downside of Firebase is that it is a closed-source platform. This means that the inner workings of the platform are not publicly available for inspection or modification. As a result, developers have limited control over the underlying infrastructure and may face limitations or restrictions in certain customization or integration scenarios. Additionally, reliance on a closed-source platform can raise concerns about vendor lock-in and the ability to migrate to alternative solutions in the future

BaaS

Firebase can be categorized as a Backend as a Service (BaaS) platform. BaaS refers to a cloud-based service that provides backend functionalities for building and running applications.

Firebase offers various backend services, including a real-time database, authentication, storage, hosting, and cloud functions, making it easier for developers to focus on frontend development while leveraging ready-to-use backend capabilities provided by Firebase.