Dev build test

.github/workflows/Prebuild.yaml

@@ -1,4 +1,4 @@
-name: Build
+name: Pre-Build
 
 on:
   push:
@@ -7,7 +7,8 @@ env:
   REGISTRY: ghcr.io
 
 jobs:
-  docker:
+  production:
+    name: 'Production'
     runs-on: ubuntu-latest
     permissions:
       packages: write
@@ -47,3 +48,47 @@ jobs:
           platforms: linux/arm64
           tags: ${{ env.tags }}
           labels: ${{ steps.meta.outputs.labels }}
+
+  development:
+    name: 'Development'
+    runs-on: ubuntu-latest
+    permissions:
+      packages: write
+    steps:
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v3
+
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v3
+
+      - name: Docker meta
+        id: meta
+        uses: docker/metadata-action@v4
+        with:
+          images: ${{ env.REGISTRY }}/${{ github.repository }}
+          flavor: |
+            suffix=-dev.
+
+      - name: 'Login to GitHub Container Registry'
+        uses: docker/login-action@v3
+        with:
+          registry: ${{ env.REGISTRY }}
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Set tags
+        id: set-tags
+        run: |
+          TAGS="${{ steps.meta.outputs.tags }}"
+          if [[ "${GITHUB_REF}" == "refs/heads/main" ]]; then
+            TAGS="${TAGS},${{ env.REGISTRY }}/${{ github.repository }}:latest"
+          fi
+          echo "tags=$TAGS" >> $GITHUB_ENV
+
+      - name: Build and push
+        uses: docker/build-push-action@v6
+        with:
+          push: ${{ github.event_name != 'pull_request' }}
+          platforms: linux/arm64
+          tags: ${{ env.tags }}
+          labels: ${{ steps.meta.outputs.labels }}

Dockerfile

@@ -29,6 +29,6 @@ RUN \
   else echo "Lockfile not found." && exit 1; \
   fi
 
-# Production image, copy all the files and run next
+# Production image, copy all the built files
 FROM nginx:1.27.2-alpine AS runner
 COPY --from=builder /app/dist /usr/share/nginx/html

Dockerfile.dev

@@ -0,0 +1,30 @@
+FROM node:22-alpine AS base
+
+# Install dependencies only when needed
+FROM base AS deps
+# Check https://github.com/nodejs/docker-node/tree/b4117f9333da4138b03a546ec926ef50a31506c3#nodealpine to understand why libc6-compat might be needed.
+RUN apk add --no-cache libc6-compat
+
+WORKDIR /app
+
+# Install dependencies based on the preferred package manager
+COPY package.json yarn.lock* package-lock.json* pnpm-lock.yaml* ./
+RUN \
+  if [ -f yarn.lock ]; then yarn --frozen-lockfile; \
+  elif [ -f package-lock.json ]; then npm ci; \
+  elif [ -f pnpm-lock.yaml ]; then corepack enable pnpm && pnpm i --frozen-lockfile; \
+  else echo "Lockfile not found." && exit 1; \
+  fi
+
+# Rebuild the source code only when needed
+FROM base AS builder
+WORKDIR /app
+COPY --from=deps /app/node_modules ./node_modules
+COPY . .
+
+USER node
+EXPOSE 5173
+ENV PORT=5173
+
+ENV HOSTNAME="0.0.0.0"
+CMD ["npm", "run", "dev"]