skip to Main Content

My source code repo is hosted on GitHub and I’m wondering how to implement a CI/CD github actions pipeline for testing, build and deploy of my MERN application to DigitalOcean. I have admin_frontend, user_frontend, backend folders in the root.

What I want to achieve if I push to master branch, run CI/CD workflows so:

  • Build apps (production react build for 2 frontend)
  • run tests (I have only some Jest test cases in 1 frontend app)
  • deploy to my digital ocean droplet

I don’t know how to solve this since I have NOT just 1 frontend app in my github repository but 2 frontend and 1 backend app. If you have any workflow template for that structure, idea how to do this I appreciate it.

Do I need to create just one .github/workflows/main.yml in the root or 3 into all apps?

Currenctly I can deploy to my Digital Ocean droplet the 3 apps by running this script:

#build admin frontend
docker build -t admin-fe ./admin_frontend_app
docker save -o ./admin-fe.tar admin-fe

#build backend and frontend
docker build -t main-be ./backend & docker build -t main-fe ./frontend
docker save -o ./main-be.tar main-be & docker save -o ./main-fe.tar main-fe

#deploy services
ssh root@IPADDRESS "pwd && mkdir -p ~/apps/mern && cd ~/apps/mern && ls -al && echo 'im in' && rm admin-fe.tar && rm main-be.tar && rm main-fe.tar &> /dev/null" 

#upload admin-fe.tar to VM via ssh
scp ./admin-fe.tar root@IPADDRESS:~/apps/mern/
#upload main-be.tar and main-fe.tar to VM via ssh
scp ./main-be.tar ./main-fe.tar root@IPADDRESS:~/apps/mern/
ssh root@IPADDRESS "cd ~/apps/mern && ls -1 *.tar | xargs --no-run-if-empty -L 1 docker load -i"

#sudo docker compose up
ssh root@IPADDRESS "cd ~/apps/mern && sudo docker-compose up"

2

Answers


  1. Considering you have one single repository it can be convenient creating a single workflow which runs all steps:

    • build and test user frontend
    • build admin frontend
    • build backend
    • deploy apps (you could look at digitalocean/action-doctl@v2 to accomplish this)

    The workflow is convenient when you want to deploy them all at once (also I think you wouldn’t do this upon each git push otherwise every change would redeploy them all).

    The option you mention (3 workflows) is also a valid solution when you want to keep the components independent: for example build/push the admin frontend without affecting the others.

    Login or Signup to reply.
  2. I have just started creating a MERN Docker Deployment Boilerplate using Github Actions, it’s still Work in Progress at https://github.com/mdarif/project-management

    Haven’t been using Digital Ocean but more or less workflows should remain same in case of MERN app.

    Our workflow YAML file is split into 2 halves one for Server Deployment & Client Deployment.

    name: Docker CI
    
    # Controls when the workflow will run
    on:
      # Triggers the workflow on push or pull request events but only for the "master" branch
      push:
        branches: [ "master" ]
      pull_request:
        branches: [ "master" ]
    
      # Allows you to run this workflow manually from the Actions tab
      workflow_dispatch:
    
    # A workflow run is made up of one or more jobs that can run sequentially or in parallel
    jobs:
      # This workflow contains a single job called "Client-Deployment"
      Client-Deployment:
        # The type of runner that the job will run on
        runs-on: ubuntu-latest
    
    
    
      # This workflow contains a single job called "Server-Deployment"
      Server-Deployment:
        # The type of runner that the job will run on
        runs-on: ubuntu-latest
    

    You may check the complete code on github repo shared earlier.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search