Hugo + bitbucket + firebase

support
1

Hi everyone,

I have developed a hugo site and pushed it on bitbucket, Now I want to host that website on firebase.

Could anyone help me in understanding that how can I host on firebase and also if any third platform required in between bitbucket and firebase??

2

I have never used Firebase personally, but their docs look nice.

Docs on how to deploy your site: https://firebase.google.com/docs/hosting/deploying

Tutorial on deploying a static site: https://medium.com/@aleemuddin13/how-to-host-static-website-on-firebase-hosting-for-free-9de8917bebf2

5 Likes
3

I don’t use firebase either but, there are a few posts in this forum that hit when you search on it. Maybe see if you can get hints that way?

4

@zwbetz and @Rickycogley
I deployed and hosted to firebase by going through tutorials, but instead of hugo site it is showing me a modal attach in image

1Wv9O

Also want to know if what is the concept of public folder in hugo?
While hosting it asks me to select public folder, i select default public folder, did I do anything wrong??

5

The public folder gets created in your project folder when you run hugo.

6

You mean to say hugo server?

7

No, hugo server does not generate a folder/files by default (but you can add a switch to make that happen). Instead, it serves from memory. To create public you run hugo with whatever switches you need.

8

@exrishu I would also run firebase serve locally and confirm that you can hit your site at http://localhost:5000/

9

Nothing is working for me, and also I am finding difficulty to figure out that what’s wrong, still showing same modal attach in the image

10

If I had to guess, I’d say it is ready to serve files but, just does not have your files where it needs them.

11

@zwbetz any findings that would help me?

12

I am not sure how to do this directly from bitbucket, so, why not just start local to test it and get used to it. It looks like you run an init on your project folder, then specify where the public folder is in your firebase.json. What have you got in your firebase.json?

I don’t personally like putting my generated files into git so, I’d run hugo so the files get placed somewhere that I can then specify as “public” in firebase.json. Like:

hugo -d /tmp/mysite.com

Then, the firebase.json would be something like:

{
  "hosting": {
    "public": "/tmp/mysite.com",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ]
  }
}

It appears that once that’s set up, you just do firebase deploy to push your files up.

This is not tested. I have never used firebase but, looking at their docs, it looks like you should be able to get something deployed this way. Then once you do that, maybe “bitbucket pipelines” can be used to deploy it to firebase, on commit to master.

1 Like
13

Also did you follow this:

14

First thing that I tried, but didn’t work, am gonna follow your other comment of local test and update if it works or not. Thanks a ton .

15

This is my 50¢.

The Hugo creates static sites. The Firebase hosts static sites. Its have no point of contact. Only your file system or stdin/stdout let interactions.

In my case I use the next deploy sequence:

  1. Build the site to file system (the ./public folder as default)
hugo serve --renderToDisk --disableFastRender
  1. Deploy the site to a hosting (Firebase as one of many. The ./public folder as default too)
firebase deploy

There are at least two reason to do that:

  1. The clean build
  2. This is intuitive
16

@exrishu I was curious about this, so I got it working for one of my sample projects. I followed the hugo docs for hosting on firebase, as is.

My sample project, now in firebase: https://hugo-os-stat-function.firebaseapp.com/

As @RickCogley mentioned, you should confirm the settings in your firebase.json file (see mine below). Also, make sure you are running hugo to generate your static site before you run firebase deploy.

{
  "hosting": {
    "public": "public",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ]
  }
}

Update: I got this working with Wercker CI. Now everytime I do a git push, it will deploy the site to firebase automatically. A few notes:

  • First, follow the hugo docs on deployment with wercker to link your Bitbucket account to your Wercker account, but stop once you get to the heading named Use the Hugo-build Step
  • Run firebase login:ci locally to generate your token
  • Create 2 environment variables in your wercker build pipeline: FIREBASE_TOKEN which will be the generated token from the previous step, and FIREBASE_PROJECT_NAME which is the name of your firebase project
  • Add this (or replace your existing) wercker.yml file to the root of your site, then update the hugo version as desired:
box: debian
build:
  steps:
    - arjen/hugo-build:
        version: "0.50"
    - script:
        name: update apt-get
        code: apt-get update
    - script:
        name: install curl
        code: apt-get install -y curl
    - script:
        name: install gnupg
        code: apt-get install -y gnupg
    - script:
        name: install node
        code: |
          curl -sL https://deb.nodesource.com/setup_11.x | bash -
          apt-get install -y nodejs
    - script:
        name: install firebase
        code: npm install -g firebase-tools
    - devillexio/firebase-deploy@1.2.0:
        project: $FIREBASE_PROJECT_NAME
        token: $FIREBASE_TOKEN

For reference, here’s the GitHub repo that Wercker deploys to Firebase from.

3 Likes
17

@zwbetz & @RickCogley Thanks a ton, Finally I am able to host with firebase locally. Thank you guys for clearing my doubts and sorry for all the troubles. @zwbetz I’ll try deploymnet with wercker and update you if it works or not also if any issue comes that is unknown I’am gonna trouble you again :slight_smile:

1 Like