# Docker 建隔離環境，讓 Claude Code 火力全開，用 Hostinger 部署上線！

- 作者：林鼎淵（Dean Lin）
- 網址：https://deanlin.net/blog/202609/claude-code-docker-hostinger/
- 發布：2026-09-12
- 主題：AI 實戰
- 系列：Claude Code 實戰
- 標籤：Claude Code、AI Agent、Docker、Security、Hostinger
- 摘要：相信很多人在面對繁瑣重複的工作時，腦袋可能會冒出一句話：「如果有工具可以幫我搞定就好了！」

[https://youtu.be/BPdyiaC-3Lw](https://youtu.be/BPdyiaC-3Lw)

相信很多人在面對繁瑣重複的工作時，腦袋可能會冒出一句話：「如果有工具可以幫我搞定就好了！」

這幾個月我收到許多 AI 輔助開發的企業內訓邀請；為了呈現最高品質的內容，我想把過去 YouTube 影片底下的留言彙整起來。

> 但問題來了，YouTube 並沒有匯出留言的功能

而我有些影片留言就有幾百則，如果手動整理，那是一個非常浩大且無趣的過程。

這就是我在日常工作遇到的痛點，我相信大家在自己的工作中，一定也有對應的痛點。

這邊再分享一個實際案例，前陣子我受邀到三軍總醫院分享 AI 輔助開發的經驗。

當時就以醫院的兩大痛點「月報製作」和「排班系統」當案例，現場向醫護人員展示 AI 的可能性，以及要注意的資安議題。

分享這些案例，是想讓大家了解，過去我們可能有想法，但因為沒有技術，因此只能等別人開發

但現在，只要想法與需求足夠明確，其實是有辦法在 AI 的輔助下，自己完成工具的。

> 但實際動手時，會遇到幾個問題。

首先，不管你選擇的 AI Agent 是 Claude Code、Codex 還是 Cursor；它們在執行任務時，時常會跳出一些操作權限的提醒，問你要同意還是拒絕。

假如你沒有相關技術背景，其實很難判斷該接受還是拒絕，而且閱讀這些資訊真的很花時間；要是不小心接受了 AI 的危險指令，電腦甚至有被清空磁碟或格式化的風險。

### ① 在隔離環境執行 Claude Code

所以我會先跟大家分享，如何用 Claude Code 搭配 Docker 建立一個可以放心讓 AI 執行的隔離環境；在這個環境中，AI 可以自動執行所有指令，不用擔心影響到自己的電腦。

### ② 設計好系統目標後，放手讓 AI Agent 執行

但在讓 AI 執行前，我們需要先告訴他明確的目標，以及驗收的標準。如果可以，最好再指定使用的技術，這樣得到的成品會更符合自己的預期。

### ③ 加入 Git 版本控制

而在 AI 製作完初版後，我們要先加入 Git 版本控制。因為 AI 修改程式碼的幅度很大，如果沒有版本控制，改壞就回不去了。

### ④ 透過 Hostinger 部署上線

另外如果你想把成果分享給朋友，或作為個人的作品集；我會分享透過 Hostinger 部署上線的步驟。

### ⑤ 上線後要考量的事

但上線只是考驗的開始，我也會分享系統上線後可能會遭遇的挑戰。

> 完整的 Demo，可以觀看 YT 喔 👉
> 對 AI 應用感興趣的朋友，歡迎按下訂閱按鈕，未來我計畫分享一系列 AI 工具的應用教學。

[YouTube 影片：【Claude Code 危險模式】怕 AI 搞壞電腦？用 Docker 隔離沙盒讓它火力全開，再用 Hostinger 部署上線 | AI Agent | Vibe Coding](https://www.youtube.com/watch?v=BPdyiaC-3Lw)

## ① 在隔離環境執行 Claude Code

在正片開始前，我先說明會使用到的工具

### Claude Code

首先你需要選一個 AI Agent，這隻影片的範例是 Claude Code；目前需要付費升級到 Pro 以上的版本才能使用。

如果你使用 macOS 或 Linux，可以在終端機透過下面指令安裝

```
curl -fsSL https://claude.ai/install.sh | bash

```

另外 Windows 可以參考下面的指令

```
irm https://claude.ai/install.ps1 | iex

```

### Docker

接下來要安裝是 Docker，他可以幫我們建立隔離環境的「容器」

[https://www.docker.com/products/docker-desktop/](https://www.docker.com/products/docker-desktop/)

如果你直接在電腦的終端機執行 Claude，AI 就有機會動到電腦裡的資料與設定；**而 Docker 的作用，就是把 Claude 的執行環境限制在容器之內。**

在這樣的狀態下，AI 執行起來會安全許多，因為他看不到容器外的資訊。

在官網上，你可以根據自己的作業系統選擇要安裝的版本。安裝完成後打開 Docker Desktop，不需要註冊，也不用登入帳號。

看到左下角有一個綠色的「Egine Running」，就代表 Docker 引擎已經在你的電腦背景跑起來了。

如果想更確定的話，可以在終端機輸入 `docker -v` 來確認

### Node.js

再來因為今天示範的是網頁工具，所以我們需要安裝 Node.js，由於 Node.js 有許多版本，所以我們要透過 nvm 來安裝與管理。

如果你使用 macOS 或 Linux，可以在終端機透過下面指令安裝。

```
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.7/install.sh | bash

```

而 Windows 可以到官網下載最新的「setup.exe」安裝程式。

[https://github.com/coreybutler/nvm-windows/releases](https://github.com/coreybutler/nvm-windows/releases)

安裝完成後，重新開啟終端機，並輸入 `nvm -v` 確認版本，接著再輸入 `nvm install –lts` 安裝最新版本的 Node.js，並輸入 `node -v` 確認有切換到最新版本。

### 安裝程式碼編輯器 IDE

接著我們要安裝一個程式碼編輯器（IDE），我這邊使用的是 [Cursor](https://cursor.com/zh-Hant/download)，但如果你想用 VS Code 或 Antigravity 也都可以

### 安裝 Dev Containers 外掛

裝好 IDE 後，點擊左側的 Extensions，搜尋「Docker Dev Containers」，選第一個進行安裝即可。

安裝完成後，我們的程式碼編輯器就能直接在 Docker 容器裡面工作了。

### 下載練習用的專案

確認前面的工具都準備完成後，我們要透過 Git 來下載練習用的專案

[https://git-scm.com/install/windows](https://git-scm.com/install/windows)

如果你是第一次使用 Git，可以到官網根據自己的系統下載，安裝完成後輸入 `git –version` 確認版本。

另外輸入下面兩行，可以確認有沒有完成帳號的設定。

```
git config --global user.name
git config --global user.email

```

**這些設定都完成後，就可以下載專案了，歡迎路過按個 Star，讓我知道自己的分享對大家有幫助：**

[https://github.com/deancourse/claude-code-docker-container](https://github.com/deancourse/claude-code-docker-container)

**大家可以直接 Fork 我的 Repository 來體驗，Fork 完成後，點擊 Code，從裡面複製專案網址。**

然後回到程式碼編輯器，點擊「Clone Repo」，貼上剛剛複製的網址來下載專案。

指定下載路徑，完成後點擊「開啟」，就可以跟著一起操作了。

### 專案簡介

這個專案我是參考 [Claude Code 官方的範本](https://github.com/anthropics/claude-code/tree/main/.devcontainer)修改的

我在它的基礎上，加上了前端網頁設計與 Git Commit 的 Skill，以及給 AI 參考的 CLAUDE.md，[這份 CLAUDE.md 是參考 andrej-karpathy 的版本](https://github.com/multica-ai/andrej-karpathy-skills/blob/main/CLAUDE.md)

### 在 IDE 啟動沙盒

在了解專案基礎架構後，輸入「F1」貼上 `Dev Containers: Reopen in Container`

這個指令會幫你下載容器所需的資源，第一次執行會比較久，啟動完成後，左下角就會顯示 Container Claude Code Sandbox。

> 這邊提醒一下大家，我在企業內訓時，有部分學員遇到啟動失敗的問題；通常把整個 IDE 關掉重啟就會成功，如果還是不行，可以把錯誤訊息貼到 Claude Code 進行分析。

### 確認 Claude Code 可以使用

接著我們打開終端機輸入 `claude`，第一次在這個容器操作時會需要登入；登入後，你會發現這是一個非常乾淨的 Claude。

在 /skills 的部分，你只會看到我預先放進去的技能

而 /permissions 這塊，完全是空白的

接著，我們來做一個測試，跟 AI 說：

```
幫我列出桌面有哪些檔案

```

如果是在自己電腦的終端機執行這個指令，AI 會列出桌面的檔案；但因為我們這裡是容器，所以你會看到 AI 跟你說他找不到。

因為他在容器裡面，而桌面這個資料夾，是在容器外面；做到這邊先給自己拍拍手，我們已經完成了隔離環境，接下來就能開啟無限制模式，讓 AI 大展身手

## ② 設定系統目標，讓 AI 火力全開

### 大膽執行危險模式

確認 AI 在容器內，碰不到容器外的資料後，我們先用 Control + C 關閉這個對話。

然後就可以用 `claude –dangerously-skip-permissions` 的方式啟動 Claude 了。

啟動時，Claude 會跳出警告，要選擇「Yes,I accept」才能繼續。

在這個模式下，AI 不會再詢問權限相關問題，可以火力全開。

### 定好目標讓 AI 執行

但正因為 AI 會火力全開，所以我們在設定執行目標時，越精確越好，否則 Token 額度會消耗得非常快。

比如今天要跟大家示範的是製作「YouTube 留言彙整工具」，假使我只給他這麼一句話當目標，最後的成果通常會不如預期。

根據我的經驗，需求至少要涵蓋 3 個要素：「使用情境、技術限制、驗證方式」

```
我想要建立一個 YouTube 留言彙整工具，需求如下：

【專案結構】
1. 放在目前 repo 的根目錄，不需建立子資料夾
2. 為了方便部署，package.json 必須在根目錄
3. 在 README.md 增加一節說明使用方式

【使用情境】
1. 輸入「播放清單」網址，彙整清單內所有影片的留言
2. 輸入「單支影片」網址，彙整該影片的留言
3. 輸入「頻道」網址，彙整頻道內影片的留言
4. 網址輸入欄可以共用，有輸入提示
5. 載入留言時，會有進度條，知道現在正在抓取哪支影片

【篩選條件】
- 可以設定搜尋的時間範圍（起訖日期）
- 可以設定關鍵字，只保留包含關鍵字的留言

【技術限制】
- 使用 Node.js 開發
- 不需透過 YouTube API 取得資料，參考 npm 既有套件（取得評論的）
- 匯出結果先呈現在網頁上，要有階層關係、影片縮圖，可下載成 Markdown（不同影片不同檔案）

【驗證方式】
請用下面三個真實網址，為所有情境撰寫測試：
- 播放清單：https://www.youtube.com/watch?v=2hbYCe_E5aU&list=PLWWZkn1dW3eAvSZfJv0-02q27JIsfbN2f
- 單支影片：https://www.youtube.com/watch?v=2hbYCe_E5aU
- 頻道：https://www.youtube.com/@dlcorner
測試必須包含以下驗收條件，低於門檻視為失敗：
① 播放清單：抓到的影片數量 ≥ 10 支
② 單支影片：留言總數 ≥ 400 則
③ 頻道：列出的影片數量 ≥ 40 支
④ 設定時間範圍後，結果中不得出現範圍外的留言
⑤ 設定關鍵字後，每一則留言都必須包含該關鍵字

完成後執行所有測試，如果有失敗的案例，
請修復後重新執行，最多嘗試 10 次；
最後回報每個情境實際抓到的影片數與留言總數。

```

### 【專案結構】為未來的部署做準備

首先在專案結構這塊，我要求他直接在 Repo 根目錄下開發，並要求 package.json 這個存放專案資訊的檔案要放在根目錄，方便未來部署。

如果沒有事先交代，AI 很可能會另外建一個子資料夾，把整個專案放在裡面，這會導致部署時需要再額外調整資料夾結構。

### 【使用情境】把模糊的想法變成明確的功能

在使用情境這塊，如果僅提供「幫我做一個 YouTube 留言彙整工具」這種模糊指令，那 AI 針對細節只能靠猜，所以我把實際的情境拆成「播放清單、單支影片、頻道」這三種。

因為這就是我實際會用到的場景，而篩選條件則是使用情境的延伸，目的是讓我更精準地獲得資訊。

### 【技術限制】決定成品長什麼樣子

至於技術限制，是在幫 AI 縮小工具的選擇範圍；這邊我指定使用 Node.js 開發，如果不指定，AI 可能會使用其他程式語言。

再來是「不透過 YouTube API」，因為官方 API 需要跑另一套流程，而我希望用現成的套件來處理就好。

最後匯出格式我也明確指定要使用網頁，並呈現階層關係與影片縮圖，而且要讓我能下載成 Markdown 格式方便後續使用。

### 【驗證方式】讓 AI 沒辦法自我感覺良好

最後則是驗證，AI 時常沒有完成任務，卻騙我們說他搞定了。

所以我給了三個真實網址，並設下具體的判斷規則，這些數據都是我頻道的真實資料。

當執行結果不符合這些規則時，AI 就會自動除錯。加入測試後，我們就能大幅減少手動驗證的成本。

### 最後三行：讓 AI 自己跑完「測試 → 修復」的迴圈

最後三行，我設計了一個**測試迴圈。**

因為我們是讓 AI 用放飛自我的模式執行，所以 Token 額度燒得很快。

尤其在他遇到無法解決的錯誤時，燒得最兇，所以我設定了一個嘗試次數上限，作為失敗時的停損點。

### 人工驗證

稍等一段時間，AI 回報他已經完成了任務，並且測試全數通過。

**但做完跟做好是兩件事**，這邊我跟大家簡單說明專案的架構。

先打開 package.json 這個檔案，裡面會有專案的名稱、描述、指令，以及使用到的套件。

然後開啟一個新的終端機，輸入 `npm run start` 來啟動專案：

> 你也可以直接請 AI 幫你啟動，但如果對專案架構有基礎認知會更好。

接著我們把網址複製下來貼到瀏覽器上，先驗證單支影片是否可以運作，點擊「開始驗證」後，工具就會開始幫我們彙整 YouTube 留言。

稍等一段時間就執行完畢了，你可以看到影片的縮圖，以及下方的留言階層；確認符合預期後，便可點擊「下載 Mardown」來看看呈現的結果是不是自己要的。

在驗證單隻影片符合需求後，就可以擴增測試範圍到「播放清單」與「頻道影片」。

儘管功能都符合預期，但有些細節是在擴增測試範圍後才會發現的，像是有多隻影片的狀態下，需要往下滑才能看到後面的影片留言，操作上並不直覺。

這個部分，我也會在後面的章節來做優化。

## ③ 加入 Git 版本控制，改壞還有回頭路

在確認基礎功能符合預期後，我們要給這個專案加上版本控制，這邊會使用到 Git 這個工具。

這樣就算 AI 未來把專案改壞了，我們都還有回頭路可以走。

### 建立第一個存檔點

這邊先請 AI 幫我們產生 commit，直接使用 Git Smart Commit 這個 Skill 即可。

```
/git-smart-commit

```

你可以把 commit 想像成遊戲的「存檔點」，每完成一個階段就存一次檔，就算後面打輸了，也能回到上一個存檔點重來。

畢竟 AI 修改程式碼的幅度很大，有時你只是請他調整一個小功能，他卻順手動了其他地方，如果沒有存檔點，改壞就真的回不去了。

### 推上 GitHub，為部署做準備

最後，我建議把專案推上 GitHub，除了多一份雲端備份，後面部署上線時也會用到。

點擊左側的「Source Control」，接著選擇「同步變更」，然後你就會看到錯誤訊息：

這是因為我們還在 Docker Container 環境裡面，你需要點擊左下角的「Container Claude Code Sandbox」，然後選擇「Reopen Folder Locally」用本機的資料夾開啟：

此時再點擊一次「同步變更」，就可以把資訊傳到 GitHub，接著來到 GitHub 頁面，看到專案的資料有上傳上去，就代表你成功嚕！

### 優化專案並同步更新

有了存檔點後，我們就可以來繼續優化專案了，像我覺得現在的網頁太素，影片一多操作起來要往下一直拉，不方便，就可以直接請 AI 使用前端技能幫我們優化一下：

```
/frontend-design
幫我美化頁面質感，希望撈取過程可以切換到不同影片的縮圖，讓我知道現在執行到哪一個，並且在上面有列表，我點擊哪個影片，就顯示對應的留言串

```

稍等一段時間，AI 就完成了優化，除了外型比先前的版本更好看外。

你會發現他撈取過程會切換到不同影片的縮圖，並且在上面有列表，我點擊哪個影片，就顯示對應的留言串，這樣子我們網頁的易用性就更好了。

如果想把這個版本更新上去，流程是一樣的，使用 Git Smart Commit 這個 Skill：

```
/git-smart-commit

```

然後選擇「Reopen Folder Locally」用本機的資料夾開啟，再把變更推送到 GitHub 就好。

## ④ 透過 Hostinger 將網站部署上線

這邊跟大家說明一下，如果專案是純前端的靜態網頁，我們可以透過 GitHub Pages 來做部署

但因為今天的範例專案有需要一台伺服器來運行，所以我用 Hostinger 來做示範：[https://hostinger.com/deanlin10](https://hostinger.com/deanlin10)

進入官網後，可以透過 Google 帳號直接註冊登入，因為我們是網頁專案，所以點擊左側的「Websites」分頁。

這邊你會看到不同方案的價格，週期越長，價格會越便宜；如果你有輸入我的優惠碼「DEANLIN」，會再獲得 10% 的優惠。

> 如果體驗跟想像不符，官方也有 30 天退款保證，讓大家可以更放心地使用。

接著再回到部署的流程，我們在「Websites」下面選擇「Web Apps」，接著點擊「Add website」，選擇「Deploy Web App」。

如果你有購買 Domain，可以直接從這邊選擇，又或者使用「Use temporary domain」這種暫時性的網址。

然後你會看到一張世界地圖，這是在選擇伺服器的位置，建議選擇離延遲比較低的機房，這邊我就選擇 Malaysia。

接下來，你可以選擇上傳檔案，但因為我們的專案已經同步到 GitHub，所以選擇匯入指定的 GitHub Repository 即可。

在與自己的 GitHub 建立連線後，你可以直接貼上 GitHub 專案的網址，然後選擇 Deploy 即可。

中間會詢問你一些部署的參數，你可以根據實際需求調整。

這邊我採用默認值來部署，接著稍等一段時間，它就會顯示部署完畢！

我們可以點擊這個臨時網址來驗證功能，首先你可以看到至少網頁是有成功渲染出來的，並且可以抓到留言，切換影片留言也會跟著切換，Markdown 檔案也可以順利下載。

走到這一步真的太感動了，還沒幫影片按讚的朋友，可以順手按個讚！

## ⑤ 系統上線後，才是考驗的開始

在這個專案中，我們使用套件而非官方提供的 API 來抓資料，雖然也能達到相同目的，但是有代價的。

### 大量使用可能被封鎖

首先，如果這個工具是你個人使用，那通常不會有問題；但如果變成網頁開放讓大家使用，一旦使用人數多了，**就容易被官方判定為「異常」，進而被封鎖。**

### 網頁可能會改版

另外我們使用的套件是參考網頁結構來取得資訊的，這代表當 YouTube 改版後，如果套件沒有跟著更新，**你的程式就抓不到東西了**。

### 不是對錯，而是取捨

講到這邊，可能會有人說：「那直接走官方 API 不是更穩定？」

沒錯，官方 API 更穩定，如果要打造正式產品，我也推薦走官方的路。

但如果你期待的是把專案 Clone 下來就能直接跑，不需要那麼多複雜的步驟，那今天這個範例就夠用了。

> 在真實世界中，沒有最好的方案，只有當下最合適的選擇。

## 結語：即使使用者只有你，在 AI 時代也值得開發

最後想跟大家分享我自己在 AI Coding 上的心得。我的本職是軟體工程師，寫了十幾年的程式。

過去評估一個工具值不值得做，看的是需要花多少時間，以及有多少受眾。

> 但在 AI 時代，這個邏輯改變了

**如果工具能用 AI 製作出來，即使受眾只有自己一個人，那也值得做。**

就拿彙整 YouTube 留言這個案例來說；我不確定多少人有相同需求，但我知道純手動會把自己搞死。

在手寫程式碼的年代，這個專案至少要花一個週末才能完成；而我一年可能只跑個兩三次，不太可能為了它投入這麼多時間。

但有了 AI 輔助 Coding 後，大家也看到了，只要指令足夠明確，把任務交給 AI，你就可以轉頭做其他事了

> 時間成本也從「一個週末」，變成「泡一杯咖啡的時間」

很多過去被判斷不值得做的工具，或許現在都值得做了；但這件事有一個前提，你要能把需求講清楚、把驗證邏輯交代好。

> 因為 AI 做完，不代表他做好了

好的，今天的分享就到這邊，如果這個系列有給你啟發與幫助；別忘了按讚、訂閱，並把文章分享給需要的朋友。

  [https://www.tenlong.com.tw/products/9786264142083](https://www.tenlong.com.tw/products/9786264142083)

---

關於作者：林鼎淵（Dean Lin），台灣的生成式 AI 企業內訓講師、外商資安公司軟體專家，也是生成式 AI 創新學院發起人。出版 7 本書（包含全台第一本 ChatGPT 應用專書），兩度獲得 iThome 鐵人賽佳作，累積上百場授課與顧問經驗。（https://deanlin.net/about/）
引用時請附上原文網址：https://deanlin.net/blog/202609/claude-code-docker-hostinger/