Build 🏗️ and Deploy 🛳️ Web App to Production 🚝 #2
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| name: Build 🏗️ and Deploy 🛳️ Web App to Production 🚝 | |
| on: | |
| push: | |
| branches: ["master"] | |
| paths: [ | |
| "frontend/occupi-web/**", | |
| ] | |
| workflow_dispatch: | |
| defaults: | |
| run: | |
| working-directory: frontend/occupi-web | |
| jobs: | |
| # Build job | |
| build-test: | |
| name: 🏗️ Build | |
| runs-on: ubuntu-latest | |
| steps: | |
| - name: ⬇️ Checkout | |
| uses: actions/checkout@v4 | |
| - name: 🏗 Setup Bun | |
| uses: oven-sh/setup-bun@v1 | |
| with: | |
| bun-version: latest # or "latest", "canary", <sha> | |
| - name: 📦 Install dependencies with Bun | |
| run: bun install | |
| - name: 🚀 Build with Vite.js | |
| run: bun run build | |
| build-push-docker: | |
| name: 🐋 Build and Push Web Docker Image | |
| runs-on: ubuntu-latest | |
| needs: build-test | |
| steps: | |
| - name: ⬇️ Checkout code | |
| uses: actions/checkout@v4 | |
| # run npm install so we can get package-lock.json file since it's not in the repo due to bun | |
| - name: 📦 Install dependencies | |
| run: npm install | |
| - name: 🏗 Set up QEMU | |
| uses: docker/setup-qemu-action@v3 | |
| - name: 🏗 Set up Docker Buildx | |
| uses: docker/setup-buildx-action@v3 | |
| - name: 🧑💻 Login to DockerHub | |
| uses: docker/login-action@v3 | |
| with: | |
| username: ${{ secrets.DOCKER_USERNAME }} | |
| password: ${{ secrets.DOCKER_PASSWORD }} | |
| - name: 🐳 Build and push Docker image | |
| uses: docker/build-push-action@v5 | |
| with: | |
| context: frontend/occupi-web | |
| file: frontend/occupi-web/Dockerfile.prod | |
| platforms: linux/amd64,linux/arm64 | |
| push: true | |
| tags: ${{ secrets.DOCKER_USERNAME }}/occupi-web:latest | |
| deploy: | |
| name: 🛳️ Deploy Web | |
| runs-on: ubuntu-latest | |
| needs: build-push-docker | |
| steps: | |
| - name: ⬇️ Checkout code | |
| uses: actions/checkout@v4 | |
| - name: 🪷 Copy files to VM | |
| uses: appleboy/scp-action@v0.1.5 | |
| with: | |
| host: ${{ secrets.VM_IP }} | |
| username: ${{ secrets.VM_USERNAME }} | |
| key: ${{ secrets.VM_SSH_KEY }} | |
| source: "frontend/occupi-web/docker-compose.prod.yml,frontend/occupi-web/Dockerfile.prod" | |
| target: "/home/${{ secrets.VM_USERNAME }}/occupi-web-prod" | |
| # SSH to VM and run commands | |
| - name: 🚀 SSH to VM | |
| uses: appleboy/ssh-action@master | |
| with: | |
| host: ${{ secrets.VM_IP }} | |
| username: ${{ secrets.VM_USERNAME }} | |
| key: ${{ secrets.VM_SSH_KEY }} | |
| script: | | |
| cd /home/${{ secrets.VM_USERNAME }}/occupi-web-prod/frontend/occupi-web | |
| echo "${{ secrets.DOCKER_PASSWORD }}" | docker login -u ${{ secrets.DOCKER_USERNAME }} --password-stdin | |
| DOCKER_USERNAME=${{ secrets.DOCKER_USERNAME }} docker compose -f docker-compose.prod.yml down | |
| DOCKER_USERNAME=${{ secrets.DOCKER_USERNAME }} docker compose -f docker-compose.prod.yml pull | |
| DOCKER_USERNAME=${{ secrets.DOCKER_USERNAME }} docker compose -f docker-compose.prod.yml up -d |