Skip to content

Instantly share code, notes, and snippets.

@dattasaurabh82
Last active March 21, 2024 01:00
Show Gist options
  • Save dattasaurabh82/45fa659248a7cfe1a0f20571539afb83 to your computer and use it in GitHub Desktop.
Save dattasaurabh82/45fa659248a7cfe1a0f20571539afb83 to your computer and use it in GitHub Desktop.
Steps to sync between to separate private repos and deploy a web-app in gh-pages

Context:

Imagine you are making small webapp to control a hardware protoytpe.
It is part of a set of internal tools and utilities that you are building for a bigger project, to aid you in testing or something else.

This repo, since it is a client project, is private.
Now, let's say the private git repo, you are maintaining those utilities is hosted in github as: github.com/user/utility_repo

At some point you want to make the web-app go live, you don't want to bother working on a bare-metal VPS, you want to just simply use gh-pages because it provides ssl support out of the box, it's simple, lean and gets the job done, while your repo still remains private.

But your webapp is in a burried directory in that utility_repo, let say in github.com/user/utility_repo/webapp/public and in github.com/user/utility_repo/webapp you have you have test server to serve the public/ dir and to develop an test locally.

Well, since the contents of the public/ are not in the root dir of the repo github.com/user/utility_repo/, you simply just can't use gh-pages Actions CI/CD pipeline to deploy the webapp.


So what to do?

Well you can create another repo, lets say github.com/user/webapp_deployment_repo, just to hold the contents of the github.com/user/utility_repo/webapp/public in the root dir of the github.com/user/webapp_deployment_repo.

But, you do not want to manually copy paste the contents from github.com/user/utility_repo/webapp/public to github.com/user/webapp_deployment_repo, everytime you make an update and push it to github.com/user/utility_repo

What if you could create a github actions yml file in your github.com/user/webapp_deployment_repo which you can trigger manually to sync files from github.com/user/utility_repo/webapp/public/ and place them in your root directory of github.com/user/webapp_deployment_repo. That way you can them simple enable gh-pages in that repo and everytime the comntent changes the gh-pages CI/CD automation pipeline runs and deploays your webapp.

That's exactly what we are going to do.


Steps:

Because both the repos are private, the github user, depicted as user here, otherwise you needs to create a Personal Authetication Token, with all the necessary read-write accessibility enabled, form under their profile.

Go to:

Settings 
  |
   Developer Settings 
      |
       Personal access tokens 
          |
           Fine-grained tokens
           |
            Generate new token

(As of Mar 2024, that's what it's called)

In repository access and Permissions, select options as per needed and save the PAT.

For repository access, I typically select all Repositories and for Permissions, I enable all Permissions, so that I can use the PAT in many places.

Now you can go to your github.com/user/webapp_deployment_repo and create a new actions file and it will be something like this:

name: Sync content from utility_repo/webapp/public/

on:
  push:
    branches:
      - deploy
  workflow_dispatch:

jobs:
  sync-content:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout webapp_deployment_repo
        uses: actions/checkout@v2
        with:
          token: ${{ secrets.MY_PAT }}  # Use your named PAT here
          path: webapp_deployment_repo  # Replace it with your repo's name 

      - name: Checkout utility_repo
        uses: actions/checkout@v2
        with:
          repository: user/utility_repo # Replace it with your source repo details
          token: ${{ secrets.MY_PAT }}  # Use your named PAT here
          path: utility_repo            # Replace it with your repo's name
          ref: main                     # Specify the branch here, if needed

      - name: Copy Public Content to Root
        run: |
          cp -a utility_repo/webapp/public/.  webapp_deployment_repo/   # update a/c to your setup

      - name: Commit and Push Changes
        run: |
          cd webapp_deployment_repo   # update a/c to your deployment repo's name 
          git config --local user.email "action@github.com"
          git config --local user.name "GitHub Action"
          git add .
          git diff --staged --quiet || (git commit -m "Sync content"
          git -c http.extraHeader="AUTHORIZATION: basic $(echo -n x-access-token:${{ secrets.GOD_MODE_PAT }} | base64)" push)

Save it and run it, and if all goes well you should now have the contents copied over.
Now setup a gh-pages to deploy from /root and your webapp shoudl be live.

Now everytime you push some chanages ot the utils repo, you can come here to the deployment repo and manually trigger the sycna and auto build.

Thank me later 🙃 run: |

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment