有關 docker 設定，將分為如何使用 Dockerfile、docker-compose.yml 以及啟動專案，三個部分：

首先，Dockerfile 可以定義每個服務的建置方式，例如：
backend/Dockerfile（Spring Boot）

# 使用官方 OpenJDK 17 作為基底
FROM openjdk:17-jdk-slim

# 設定工作目錄
WORKDIR /app

# 先確認是否已經有編譯好的 jar 檔案
COPY target/demo-0.0.1-SNAPSHOT.jar* ./target/

# 複製 Maven Wrapper 和 pom.xml
COPY pom.xml ./pom.xml
COPY mvnw ./mvnw
COPY .mvn ./.mvn

# 確保 mvnw 可執行
RUN chmod +x mvnw

# 複製原始碼
COPY src ./src

# 條件式建置：只有當 jar 檔案不存在時才編譯
RUN if [ ! -f "target/demo-0.0.1-SNAPSHOT.jar" ]; then \
    echo "JAR file not found, building from source..." && \
    ./mvnw clean package -DskipTests; \
    else \
    echo "JAR file found, skipping build..."; \
    fi

# 啟動
ENTRYPOINT ["java","-jar","target/demo-0.0.1-SNAPSHOT.jar"]

frontend/Dockerfile（Vue + Vite）

# 使用官方 Node.js 20 作為基底
FROM node:20-alpine

# 設定工作目錄
WORKDIR /app

# 複製 package.json 和 package-lock.json（如果存在）
COPY package*.json ./

# 安裝依賴套件
RUN npm install

# 複製所有源代碼
COPY . .

# 暴露 Vite dev server 的端口
EXPOSE 5173

# 啟動開發服務器
CMD ["npm", "run", "dev", "--", "--host", "0.0.0.0"]

再來，透過 docker-compose.yml 定義多個服務的協作方式與網路設定

services:
  # 前端服務，使用 Vue 3 和 Vite
  frontend:
    build: ./frontend
    container_name: vue-frontend
    ports:
      - "5173:5173"
    # 啟動前端服務前，確保後端服務已啟動
    depends_on:
      - backend
    environment:
      - VITE_API_BASE=http://localhost:8080/api
    # 掛載本地目錄以便開發
    volumes:
      - ./frontend:/app
      - /app/node_modules

  # 資料庫服務，使用 MySQL 8.0
  db:
    image: mysql:8.0
    container_name: mysql
    # 異常時會自動重啟
    restart: always
    environment:
      MYSQL_ROOT_PASSWORD:
      MYSQL_DATABASE:
      MYSQL_USER:
      MYSQL_PASSWORD:
    ports:
      - "3307:3306"
    volumes:
      - db_data:/var/lib/mysql

  # 後端服務，使用 Spring Boot
  backend:
    build:
      context: ./backend
      dockerfile: Dockerfile
    container_name: backend
    restart: always
    # 啟動後端服務前，確保資料庫服務已啟動
    depends_on:
      - db
    ports:
      - "8080:8080"
    environment:
      SPRING_DATASOURCE_URL:
      SPRING_DATASOURCE_USERNAME:
      SPRING_DATASOURCE_PASSWORD:
      SPRING_DATASOURCE_DRIVER:
      SPRING_JPA_DATABASE_PLATFORM:

volumes:
  db_data:

都設定好之後，就可以在專案根目錄執行指令，一次啟動所有容器，方便開發與部署：

docker-compose up -d --build

其中，--build會根據 Dockerfile 強制重新建置映像檔，-d 則代表以背景模式啟動服務。

完成後，這些服務會自動在 Docker 容器中運行，讓介面可以在瀏覽器被開啟，API 也可以正常被呼叫。
直到需要關閉所有服務時，執行：

docker-compose down

就可以安全的停止並移除所有既有的容器了，以上就完成 docker 設定，下次就是進行開發程式碼的部分啦！