March 1, 2023 3 min to read

Automate Firebase hosting with Github Actions and Ruby.

set up CI/CD pipeline

Before start, let’s understand why do I need this ? Since I have been working on my blog and deploying it over firebase and again pushing them back to github for version control and keeping source code hosted to reduce the chance of deletion from my location system , which is very common to me! Being a lazy and troubleshooter guy I planned to reduce my workload , and minimalise them. That’s how journey of CI/CD starts.

# USE CASE:-

Setup firebase hosting 
Integrate hosting with Github Repository 
Setup Workflow inside project for github actions with firebase token permission 
Setup auto mere PR for main branch with all dependecies check. 

Expected Result

For every successful PR Merge , github action jobs should trigger and it automatically deploy over firebase hosting project id.

Here I have been using Ruby VS 2.7.4, since my blog is based on Jekyll open source template.

Why Firebase?

Since it’s spark plan viz free meets my all requirements for blog .
Easy sign up just gmail
Provides fully managed hosting services for static, dynamic with microservices.
Backed by SSD storage and Global CDN with free built in SSL.

STEPS

I already have github repo with branch:main configured so skipping step 0 , in case if you don’t have then make a github repo with any branch (name it as per ur requirement)and connect it with local codebase.

Firebase Hosting Setup

firebase init hosting

Hosting with Github

In case firebase hosting is already initiated, then run below command

firebase init hosting:github

Create a service account in firebase project with hosting permission.

Encrypts that service account’s JSON key and uploads it to the specified GitHub repository as a GitHub secret.

Now inside local codebase .github/workflows folder will be automatically created.

Setup two files

Code for hosting-merge.yml

name: Deploy to Firebase Hosting on merge
'on':
  push:
    branches:
      - main
jobs:
  build_and_deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
      - run: 'sudo gem install bundler && sudo bundle install && bundle exec jekyll build '
      - uses: FirebaseExtended/action-hosting-deploy@v0
        with:
          repoToken: '$'
          firebaseServiceAccount: '$'
          channelId: live
          projectId: shubhendu-shubham //replace it with your project ID

Code for hosting-pull-request.yml

name: Deploy to Firebase Hosting on PR
'on': pull_request
jobs:
  build_and_preview:
    if: '$'
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
      - run: 'bundle install && bundle exec jekyll build '
      - uses: FirebaseExtended/action-hosting-deploy@v0
        with:
          repoToken: '$'
          firebaseServiceAccount: '$'
          projectId: shubhendu-shubham

Here we’ll be deploying over ubuntu OS , verison -latest
Since my blog template is Ruby based so,need to provide commands for run viz

sudo gem install bundler && sudo bundle install && bundle exec jekyll build

Explanation :

Since we have fresh installation of jobs , so neet to install first bundler by running gem isntaller bundler with sudo permission.
second command sudo bundle install will install all the project dependencies inside the ubuntu .
bundle exec jekyll build command will build our webapp under public folder called _site.
Since inside firebase hosting we already have set _site as public folder.

Jobs in Action :-

As soon as you push your code to the main branch automatically github actions will trigger and it will deploy your production ready webapp.