DEV Community

Alex Weininger
Alex Weininger

Posted on

Setting up CI/CD with GitHub Actions and CapRover

My Workflow

https://github.com/streamlux/pulsebanner

Screenshot of workflow run summary on GitHub.com

I learned a lot about GitHub Actions creating this workflow, and specifically about how to use the matrix strategy. I've included the section of the workflow that uses the matrix strategy below. This job deploys all 3 apps to the staging environment on CapRover.

    deploy_staging:
        name: Deploy to Staging
        runs-on: ubuntu-latest
        needs: [build_next, build_nest, build_remotion]
        environment: Staging
        concurrency: Staging

        env:
            CAPROVER_URL: ${{ secrets.CAPROVER_URL }}
            NEST_CAPROVER_APP_TOKEN: ${{ secrets.NEST_CAPROVER_APP_TOKEN }}
            NEXT_CAPROVER_APP_TOKEN: ${{ secrets.NEXT_CAPROVER_APP_TOKEN }}
            REMOTION_CAPROVER_APP_TOKEN: ${{ secrets.REMOTION_CAPROVER_APP_TOKEN }}

        strategy:
            matrix:
                include:
                    - app: nest # name of the app in Caprover
                      token-key: NEST_CAPROVER_APP_TOKEN # key used to get CAPROVER_APP_TOKEN from env
                      image: ${{ needs.build_nest.outputs.image-tag }} # image to deploy
                    - app: next
                      token-key: NEXT_CAPROVER_APP_TOKEN
                      image: ${{ needs.build_next.outputs.image-tag }}
                    - app: remotion
                      token-key: REMOTION_CAPROVER_APP_TOKEN
                      image: ${{ needs.build_remotion.outputs.image-tag }}

        steps:
            # Install Caprover CLI, which we use to deploy images to Caprover
            - name: 'Install caprover-cli'
              run: npm install -g caprover

            # Deploy each app by iterating over matrix values
            - name: 'Deploy ${{ matrix.app }}'
              env:
                  APP_NAME: ${{ matrix.app }}
                  APP_URL: ${{ env.CAPROVER_URL }}
                  CAPROVER_APP_TOKEN: ${{ env[matrix.token-key] }}
                  IMAGE_NAME: ${{ matrix.image }}
              run: 'caprover deploy --caproverUrl=$APP_URL --imageName=$IMAGE_NAME --appName=$APP_NAME'
Enter fullscreen mode Exit fullscreen mode

Submission Category:

DIY Deployments

Yaml File or Link to Code

PulseBanner

Getting started

  1. Install Docker engine https://www.docker.com/get-started
  2. Clone repo
  3. Create .env file in project root and copy paste the contents of .env.template in and fill in the values.
  4. Run docker-compose up -d
  5. Open adminer to verify the database and adminer started properly. Enter password from .env file. Adminer link
  6. Run npm install
  7. Run prisma db push *
  8. Verify by viewing the newly created database 'mydb'. Adminer link
  9. Run prisma db seed *
  10. If you have changes in your prisma design, be sure to run prisma migrate dev --name <short descriptive name> before merging *
  11. Verify by viewing the newly created rows in the products table. Adminer link
  12. Run nx run next:serve *
  13. Run nx run remotion:serve to start the remotion server *

Note: Running locally on windows inside of wsl may cause issues with spawning a local server. Running Get-Service LxssManager | Restart-Service

* May need to prefix command with

Additional Resources / Info

https://github.com/streamlux/pulsebanner

Discussion (0)