Refactor build-and-push Docker image workflow

This commit refactors the build-and-push Docker image workflow in order to improve code readability and maintainability. Specifically, it modifies the YAML file to set up environment variables, define job steps, configure caching for Docker layers, and enable BuildKit with QEMU.

The changes include:
- Renaming the workflow file to "docker-build.yml"
- Setting the workflow name as "Build and Push Docker Image"
- Modifying the "runs-on" and "strategy" sections to use dynamic values
- Adding caching for Docker layers to improve build performance
- Enabling BuildKit with QEMU for compatibility across platforms
- Adjusting the "with" section of various steps to reference environment variables
- Updating the Docker build and push action with platform specifications

Additionally, the Dockerfile is modified to install npm with a `maxsockets` parameter of 1, which limits the number of concurrent network requests during package installation.

.github/workflows/docker-build.yml

@@ -1,4 +1,4 @@
-name: Build and push Docker image
+name: Build and Push Docker Image
 
 on:
  push:
@@ -11,15 +11,27 @@ env:
 
 jobs:
  build-and-push-image:
- runs-on: ubuntu-latest
- permissions:
- contents: read
- packages: write
+ runs-on: ${{ matrix.os }}
+ strategy:
+ matrix:
+ os: [ubuntu-latest]
+ platform: [linux/amd64, linux/arm64]
 
  steps:
  - name: Checkout repository
  uses: actions/checkout@v2
 
+ - name: Cache Docker layers
+ uses: actions/cache@v2
+ with:
+ path: /var/lib/docker
+ key: docker-${{ runner.os }}-${{ github.sha }}
+
+ - name: Set up QEMU and enable BuildKit
+ uses: docker/setup-qemu-action@v1
+ with:
+ platforms: all
+
  - name: Log into registry
  uses: docker/login-action@v1
  with:
@@ -32,20 +44,17 @@ jobs:
  uses: docker/metadata-action@v3
  with:
  images: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}
- tags: ${{ github.ref_name }} # use branch name as tag
-
- - name: Set up QEMU
- uses: docker/setup-qemu-action@v1
+ tags: ${{ github.ref_name }}
 
  - name: Set up Docker Buildx
  uses: docker/setup-buildx-action@v1
 
  - name: Build and push Docker image
  uses: docker/build-push-action@v2
  with:
- platforms: linux/amd64,linux/arm64 # specify architectures here
  context: .
  file: ./Dockerfile
- push: true # set this to false if you don't want to push
- tags: ${{ steps.meta.outputs.tags }} # use metadata action output
- labels: ${{ steps.meta.outputs.labels }} # use metadata action output
+ push: true
+ platforms: ${{ matrix.platform }}
+ tags: ${{ steps.meta.outputs.tags }}
+ labels: ${{ steps.meta.outputs.labels }}

Dockerfile

@@ -22,7 +22,7 @@ RUN npm install -g npm@latest
 
 # Build Frontend Environment
 WORKDIR /data/frontend
-RUN npm install
+RUN npm install --maxsockets 1
 RUN npm run build
 
 # Setup Timezone