Docker 實用指南：前端開發者的容器化入門

什麼是 Docker？

Docker 是一個開源的容器化平台，可以將應用程式和其依賴項打包成一個獨立的容器。想像一下，Docker 就像是一個標準化的貨櫃，可以將你的應用程式、資料庫、環境設定等所有需要的東西都裝在裡面，確保在任何地方都能以相同的方式運行。

Docker 的主要優點

一致性：確保開發、測試和生產環境的一致性
隔離性：每個容器都是獨立的，不會互相影響
可移植性：可以在任何支援 Docker 的系統上運行
輕量級：比虛擬機更輕量，啟動更快
版本控制：可以輕鬆管理不同版本的應用程式

安裝 Docker

首先，需要安裝 Docker Desktop（適用於 Windows 和 macOS）或 Docker Engine（適用於 Linux）：

Windows

下載 Docker Desktop for Windows
安裝並啟動 Docker Desktop
確保 WSL2 已啟用（Windows 10/11）

macOS

下載 Docker Desktop for Mac
安裝並啟動 Docker Desktop

Linux (Ubuntu)

bash

# 更新套件列表
sudo apt update
 
# 安裝必要的套件
sudo apt install -y apt-transport-https ca-certificates curl software-properties-common
 
# 添加 Docker 的官方 GPG 金鑰
curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo apt-key add -
 
# 添加 Docker 倉庫
sudo add-apt-repository "deb [arch=amd64] https://download.docker.com/linux/ubuntu $(lsb_release -cs) stable"
 
# 安裝 Docker
sudo apt update
sudo apt install -y docker-ce docker-ce-cli containerd.io

Docker 基本概念

1. 映像檔（Image）

映像檔是容器的模板，包含了運行應用程式所需的所有檔案和設定。可以將它想像成一個應用程式的「藍圖」。

2. 容器（Container）

容器是映像檔的運行實例，就像是一個正在運行的應用程式。每個容器都是獨立的，有自己的檔案系統、網路和進程空間。

3. Dockerfile

Dockerfile 是一個文字檔案，包含了建立映像檔的指令。它定義了如何建立你的應用程式環境。

為 Next.js 專案建立 Dockerfile

讓我們為一個 Next.js 專案建立 Dockerfile：

dockerfile

# 使用 Node.js 官方映像檔作為基礎
FROM node:18-alpine
 
# 設定工作目錄
WORKDIR /app
 
# 複製 package.json 和 package-lock.json
COPY package*.json ./
 
# 安裝依賴項
RUN npm install
 
# 複製所有源代碼
COPY . .
 
# 建立生產環境的構建
RUN npm run build
 
# 暴露端口
EXPOSE 3000
 
# 啟動應用程式
CMD ["npm", "start"]

建立映像檔

bash

# 在專案根目錄執行
docker build -t my-nextjs-app .

運行容器

bash

docker run -p 3000:3000 my-nextjs-app

Docker Compose：管理多個容器

Docker Compose 可以幫助你管理多個相關的容器。以下是一個包含 Next.js 應用程式和 MongoDB 的範例：

yaml

# docker-compose.yml
version: '3.8'
 
services:
    app:
        build: .
        ports:
            - '3000:3000'
        environment:
            - MONGODB_URI=mongodb://db:27017/myapp
        depends_on:
            - db
 
    db:
        image: mongo:latest
        ports:
            - '27017:27017'
        volumes:
            - mongodb_data:/data/db
 
volumes:
    mongodb_data:

使用 Docker Compose

bash

# 啟動所有服務
docker-compose up
 
# 在背景運行
docker-compose up -d
 
# 停止所有服務
docker-compose down

實用技巧和最佳實踐

1. 使用 .dockerignore

建立 .dockerignore 檔案來排除不需要的檔案：

text

node_modules
.next
.git
.env

2. 多階段構建

使用多階段構建來減少最終映像檔的大小：

dockerfile

# 構建階段
FROM node:18-alpine AS builder
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build
 
# 生產階段
FROM node:18-alpine AS runner
WORKDIR /app
COPY --from=builder /app/next.config.js ./
COPY --from=builder /app/public ./public
COPY --from=builder /app/.next ./.next
COPY --from=builder /app/node_modules ./node_modules
COPY --from=builder /app/package.json ./package.json
EXPOSE 3000
CMD ["npm", "start"]

3. 環境變數管理

使用環境變數檔案來管理配置：

bash

# .env
NODE_ENV=production
MONGODB_URI=mongodb://db:27017/myapp

4. 資料持久化

使用 Docker volumes 來保存資料：

yaml

# docker-compose.yml
services:
    app:
        volumes:
            - .:/app
            - /app/node_modules

常見問題和解決方案

1. 容器無法啟動

檢查日誌：

bash

docker logs container_name

2. 映像檔太大

使用多階段構建
使用 .dockerignore 排除不必要的檔案
使用輕量級基礎映像檔（如 alpine）

3. 網路問題

檢查容器網路：

bash

docker network ls
docker network inspect network_name

部署到生產環境

1. 使用 Docker Registry

將映像檔推送到 Docker Hub 或私有 Registry：

bash

# 登入 Docker Hub
docker login
 
# 標記映像檔
docker tag my-nextjs-app username/my-nextjs-app:latest
 
# 推送映像檔
docker push username/my-nextjs-app:latest

2. 使用 Docker Swarm 或 Kubernetes

對於大規模部署，考慮使用容器編排工具：

bash

# 初始化 Docker Swarm
docker swarm init
 
# 部署服務
docker stack deploy -c docker-compose.yml myapp

總結

Docker 是一個強大的工具，可以幫助前端開發者：

確保開發環境的一致性
簡化部署流程
提高應用程式的可移植性
更好地管理依賴項

通過掌握 Docker 的基本概念和實用技巧，你可以：

建立可靠的開發環境
簡化團隊協作
提高部署效率
更好地管理應用程式的生命週期

GaryLin.dev