建立 Hugo + code-server + GitHub 自動 Deploy

 1services:
 2 # code-server IDE
 3 ide:
 4   build: .
 5   container_name: hugo-ide
 6   environment:
 7     - PUID=1000
 8     - PGID=1000
 9     - TZ=Asia/Hong_Kong
10     - PASSWORD=your_ide_login_password
11     - SUDO_PASSWORD=your_root_password
12   volumes:
13     - ./config:/config
14     - ./project:/config/workspace
15   ports:
16     - 10443:8443       # 映射 container port 8443 到 宿主機的 port 10443
17   restart: unless-stopped
18
19 # Preview 用 webserver (Nginx)
20 preview:
21   image: nginx:alpine
22   container_name: hugo-preview
23   volumes:
24     - ./project/my-site/public:/usr/share/nginx/html:ro # <<-- Preview 用的 Hugo output 存放處
25   ports:
26     - 10080:80       # 映射 container port 80 到 宿主機的 port 10080
27   restart: unless-stopped
28
29 # Couldflare Tunnel
30 tunnel:
31   image: cloudflare/cloudflared:latest
32   container_name: cloudflare-tunnel
33   command: tunnel --no-autoupdate run --token your_token_string
34   restart: unless-stopped

 1 # 階段 1: 借用官方 Hugo Extended 執行檔
 2 FROM klakegg/hugo:ext-alpine AS hugo-provider
 3 
 4 # 階段 2: 建立你的 Code-Server (雲端 IDE)
 5 FROM linuxserver/code-server:latest
 6 
 7 
 8 # 自動偵測架構並安裝最新版 Hugo Extended
 9 RUN apt-get update && apt-get install -y wget curl jq && \
10     # 1. 攞最新版號
11     LATEST_HUGO=$(curl -s https://api.github.com/repos/gohugoio/hugo/releases/latest | jq -r '.tag_name' | sed 's/v//') && \
12     # 2. 偵測系統架構 (Pi 4/5 通常係 arm64)
13     ARCH=$(dpkg --print-architecture) && \
14     if [ "$ARCH" = "arm64" ]; then HUGO_ARCH="arm64"; else HUGO_ARCH="arm"; fi && \
15     # 3. 下載對應的 .deb 檔
16     wget "https://github.com/gohugoio/hugo/releases/download/v${LATEST_HUGO}/hugo_extended_${LATEST_HUGO}_linux-${HUGO_ARCH}.deb>
17     # 4. 安裝
18     dpkg -i "hugo_extended_${LATEST_HUGO}_linux-${HUGO_ARCH}.deb" && \
19     rm "hugo_extended_${LATEST_HUGO}_linux-${HUGO_ARCH}.deb" && \
20     apt-get clean
21 
22 
23 # Install GIT
24 RUN apt-get install -y git && apt-get clean
25 WORKDIR /config/workspace

 1services:
 2  # 核心：流量分流與 SSL 管理
 3  npm:
 4    image: 'jc21/nginx-proxy-manager:latest'
 5    restart: always
 6    ports:
 7      - '80:80'
 8      - '81:81'
 9      - '443:443'
10    volumes:
11      - ./npm/data:/data
12      - ./npm/letsencrypt:/etc/letsencrypt
13
14  # 網站 1: Landing Page (www)
15  landing-site:
16    image: nginx:alpine
17    restart: always
18    volumes:
19      - ./html/landing:/usr/share/nginx/html
20
21  # 網站 2: Hugo Blog (blog)
22  blog-site:
23    image: nginx:alpine
24    restart: always
25    volumes:
26      - ./html/blog:/usr/share/nginx/html
27
28  # 網站 3: App Portfolio (myjob)
29  job-site:
30    image: nginx:alpine
31    restart: always
32    volumes:
33      - ./html/job:/usr/share/nginx/html

 1name: Deploy to Lightsail
 2
 3on:
 4  push:
 5    branches: [ main ] # 當你 push 去 main branch 嗰陣觸發
 6
 7jobs:
 8  build-and-deploy:
 9    runs-on: ubuntu-latest
10    steps:
11      - name: Checkout code
12        uses: actions/checkout@v4
13        with:
14          submodules: recursive
15
16      - name: Setup Hugo
17        uses: peaceiris/actions-hugo@v3
18        with:
19          hugo-version: 'latest'
20          extended: true
21
22      - name: Build Website
23        run: hugo --minify
24
25      - name: Deploy to Lightsail
26        uses: easingthemes/ssh-deploy@main
27        with:
28          SSH_PRIVATE_KEY: ${{ secrets.LIGHTSAIL_SSH_KEY }}
29          REMOTE_HOST: ${{ secrets.LIGHTSAIL_IP }}
30          REMOTE_USER: ubuntu
31          # 呢度填你 Lightsail 嗰面 Webstack 讀取網頁檔案嘅 Folder 路徑
32          TARGET: /home/ubuntu/webstack/sites/my-hugo-site/
33          SOURCE: "public/"