Host a Static Site on Firebase

I started The Firehose Project a few months ago. Part of the application process was to show the team that you could successfully host a static site. Originally I used Dropbox to host my site, but they just announced a plan to drop the service as mentioned in this article by Christopher Ross.

Christopher’s article talks about 3 alternatives to Dropbox HTML hosting. I liked his article a lot, so I thought I’d add yet another alternative and that is Firebase. It turns out to be super easy AND lightening fast.

Thanks Christopher Ross for the inspiration!

Here we go…

Step 1. Create a Firebase account

Step 2. Create a new Project

Create a new project dialog box on Firebase

Step 3. Install Node.js if you don’t already have it

Step 4. Install the Firebase CLI via the command line

$ npm install -g firebase-tools

Step 5. Login to Firebase via the command line

$ firebase login

Step 6. Create a directory on your local machine for your project

$ mkdir demo

Step 7. cd into the directory you just created and Intialize Firebase

$ cd demo
$ firebase init

Step 8. Use the arrow keys and choose ‘Hosting’. Hit the space bar.

Step 9. Assign a file for your database rules. It suggests (database.rules.json). Hit enter.

Step 10. Assign a public directory. I used the default ‘public’ folder, but you can assign it to any folder you like.

Step 11. Decide if you want to configure the project as a single-page app. Hint: Choose YES.

Step 12. Inside your public folder, create your site!

step 13. Deploy to Firebase

$ firebase deploy

Check out your site at https://yoursitenamehere.firebaseapp.com

you are done!