0
0
FirebaseHow-ToBeginner · 4 min read

How to Use Firebase Hosting: Simple Steps to Deploy Your Site

To use Firebase Hosting, first install the Firebase CLI, then initialize your project with firebase init hosting. Finally, deploy your site using firebase deploy to make your web app live on the internet.
📐

Syntax

Here are the main commands to use Firebase Hosting:

  • npm install -g firebase-tools: Installs the Firebase CLI globally.
  • firebase login: Logs you into your Firebase account.
  • firebase init hosting: Sets up hosting in your project folder.
  • firebase deploy: Uploads your site to Firebase Hosting.

Each command prepares or publishes your web app step-by-step.

bash
npm install -g firebase-tools
firebase login
firebase init hosting
firebase deploy
💻

Example

This example shows how to deploy a simple static website using Firebase Hosting.

After installing Firebase CLI and logging in, run firebase init hosting and choose your project. Put your website files in the public folder created by Firebase. Then run firebase deploy to publish.

bash
npm install -g firebase-tools
firebase login
firebase init hosting
# Choose your Firebase project and set 'public' as the folder
# Place your index.html inside the 'public' folder
firebase deploy
Output
=== Deploying to 'your-project-id'... ✔ Deploy complete! Project Console: https://console.firebase.google.com/project/your-project-id/overview Hosting URL: https://your-project-id.web.app
⚠️

Common Pitfalls

Common mistakes when using Firebase Hosting include:

  • Not placing your website files in the correct public folder before deploying.
  • Skipping firebase login, which causes authentication errors.
  • Choosing the wrong project during firebase init hosting.
  • Forgetting to run firebase deploy after changes.

Always verify your files are in the right folder and you are logged in to avoid deployment failures.

bash
# Wrong way:
# Deploying without login
firebase deploy

# Right way:
npm install -g firebase-tools
firebase login
firebase deploy
📊

Quick Reference

CommandPurpose
npm install -g firebase-toolsInstall Firebase CLI globally
firebase loginAuthenticate your Firebase account
firebase init hostingSet up hosting in your project folder
firebase deployPublish your site to Firebase Hosting

Key Takeaways

Install Firebase CLI and log in before starting hosting setup.
Use 'firebase init hosting' to prepare your project folder.
Place your website files inside the 'public' folder created by Firebase.
Run 'firebase deploy' to publish your site live.
Double-check project selection and file locations to avoid errors.