將網站、落地頁、應用、3D、遊戲等發布到ICP去中心化雲。

為什麼選擇ICP

使用Vercel、AWS或Wix等SaaS，同樣可以實現網站、API、外部連結與AI整合。因此，ICP的價值並不只是增加了某些功能。

ICP的本質在於：網站和應用不再放在由特定管理主體運營的伺服器上，而是放在由密碼學機制維持的去中心化雲上，從而能夠成為由自己的身份（identity）管理的Canister（容器）上的實體。

這意味著什麼？

本地電腦上的檔案完全在自己的管理之下，但只封閉在本地。普通的雲雖然可以向全世界公開，卻依賴於大企業的賬號與服務。

而ICP可以在將Web資產置於自己所有（以私鑰簽名）的同時，在網路上發布、執行與連結。也就是說，它從根本上改變了持有Web資產的方式。

補充：成本極低

如果只看便宜，還有免費託管等其他選擇。但這裡最重要的是：這是一個完全由自己的金鑰擁有的發布平臺，同時還能以極低的維護成本運營。

※參考：根據ICP Japan「告別Web2託管對比」的年度對比資料製作

今天的目標

• 第1階段（發布流程）：掌握從本地開發 → build → 同步到Asset Canister → 確認ICP公開URL的全過程。
• 第2階段（擴展功能）：展望通往Backend Canister、HTTPS outcalls、Chain Fusion、vetKeys、SEV Subnet以及AI / CLI操作的路徑。

可以發布的對象

凡是在瀏覽器中執行的公開資產，都可以發布到ICP。

• 個人網站、作品集網站、企業官網
• 推廣落地頁、活動專題頁、招聘網站
• 類似GitHub Pages的文件網站、Wiki
• 使用React/Vue等構建的Web應用、PWA
• 運用three.js / WebGL的3D展示空間與元宇宙前端
• 基於WebGL的瀏覽器Web遊戲

先從靜態發布開始

無需一開始就編寫區塊鏈程式碼（智慧合約）。就像普通的Web開發一樣，把 `npm run build` 生成的靜態資源（`dist/` 等構建產物）部署到ICP即可。

在第1階段，ICP被用作「替代Vercel或Netlify的安全的去中心化託管」。

整體架構

• Local：使用VS Code等工具在本地編寫與編輯程式碼。
• Build：透過 `npm run build` 等命令生成 `dist/` 目錄。
• Asset Canister：將生成的 `dist/` 內容同步到ICP上的「Asset Canister」（執行同步命令）。
• Public URL：透過 `icp0.io`、`ic0.app` 等原始URL，或經由DNS的自定義域名，從世界各地訪問。

實際案例：Sho T官網

Sho T的官方網站是用Astro構建的現代靜態網站。程式碼倉庫名為 `Showying/sho-web`，其構建產物 `dist/` 被直接同步到ICP的Asset Canister。

包括你正在瀏覽的這個落地頁（`/lp/icp-sovereign/`）在內，一切都是執行在去中心化網路上的真實演示。

所需的構成要素

要在ICP上發布，只需在普通的Web開發環境中稍作補充。

• 前端環境：Node.js / npm，以及Astro、React、Vue、Vite等你喜歡的框架。
• ICP工具：`icp-cli`（或dfx）、`ic-wasm` 等CLI。
• 配置檔案：描述資源同步目標的 `icp.yaml`（或 `dfx.json`）。
• 加密資產與金鑰：用於部署簽名的主網Identity（私鑰檔案），以及作為部署費用的Cycles。

icp.yaml的思路

`icp.yaml` 是ICP部署中的核心配置檔案。它定義了這樣一個流程：執行 `npm run build` 生成 `dist/`，再把 `dist/` 中的靜態檔案同步到Asset Canister。不是直接同步原始的 `public/` 目錄，而是將Astro等工具構建完成後的產物（`dist/` 等）指定為上傳對象。

部署步驟

不要在ICP上才第一次確認顯示效果，而是在本地充分確認完成之後再進行部署。

不同對象有何不同

網站、落地頁、Web應用、3D網站、Web遊戲——上傳到ICP的基本步驟（使用Asset Canister）都是一樣的。但根據內容的性質，需要注意的要點各有不同。

• 網站·落地頁：關鍵在於自定義域名、canonical、OGP圖片等SEO設定。
• Web應用·PWA：與API的整合、客戶端的狀態管理與路由。
• 3D網站（three.js）：壓縮3D模型等的體積，加快並最佳化載入速度。
• Web遊戲：資源分發、多人遊戲時的無伺服器通訊、存檔資料的儲存。

安全與運營規則

在ICP上，你用自己的金鑰擁有並管理Web資產。因此，以下機密資訊絕對不能公開、洩露或記錄。

• 絕對不能洩露的資訊：seed phrase（助記詞）、recovery phrase（恢復短語）、PEM私鑰檔案、identity私鑰、`.env` 中的API金鑰等機密資料、錢包私鑰。
• 可以公開或記錄的資訊：identity的註冊名（本地名稱）、Principal ID、Account ID、Canister ID、公開URL、執行過的CLI命令等。

使用自定義域名

一開始就設定自定義域名容易混亂，因此先使用 `*.icp0.io` 等原始Canister URL進行部署與確認。

之後，再推進正式公開的流程：放置 `.well-known/ic-domains` 檔案、設定DNS記錄、配置Asset Canister（`.ic-assets.json5`），以及修改canonical、OGP、sitemap等。

故障排查

如果在部署或訪問時出現問題，請回到以下基本項目進行確認。

• Build錯誤：本地構建（`npm run build`）是否真的正常通過。
• 同步目錄：是否混淆了 `public` 與構建輸出 `dist`；`icp.yaml` 中的同步源設定是否正確。
• 許可權·費用不足：identity私鑰的指定是否正確，Canister中作為部署費用的Cycles是否充足。
• 資源路徑錯誤：圖片、3D模型等的路徑問題，部署前用 `npm run preview` 確認能否正常顯示。

下一步

在第1階段，ICP只是作為替代Vercel或Wix的靜態託管來使用。

從這裡進入第2階段，可以引入Backend Canister、呼叫外部API的HTTPS Outcalls、與其他鏈相互讀寫的Chain Fusion、實現鏈上加密的vetKeys、保護機密資訊的SEV Subnet，以及與AI代理、CLI / ICP Skills的整合，將其擴展為自主執行的強大去中心化應用平臺。

更遠的世界觀

再往前，將連結到本地AI、機密計算（Confidential Computing）、SEV Subnet、主權（Sovereign）的確立、AI代理之間的交易（代理商務）、價值網際網路、多鏈整合、機器經濟，以及宇宙與去中心化基礎設施。

本地AI與去中心化雲並不對立，而是將成為同時實現「個人主權」與「可信的相互連結」的未來基礎設施。

總結

首先，把網站 / 落地頁 / 應用 / 3D / 遊戲發布到ICP吧。第1階段把它當作便捷的Vercel替代方案，之後再逐步擴展到後端、加密與AI代理。隨著AI、CLI與ICP Skills的發展，不僅是開發者，每個人都將能夠擁有自主的Web。

「像本地檔案一樣由自己持有，像雲一樣向世界開放，並作為Canister自主執行。」