[這個網站的誕生: 01] 建立一個免費的 vm

如何建立一個免費的 vm 根據 google cloud 的說明 https://cloud.google.com/free?hl=en 滿足以下條件的 vm 是可以不用收錢的 1 non-preemptible e2-micro VM instance per month in one of the following US regions: Oregon: us-west1 Iowa: us-central1 South Carolina: us-east1 30 GB-months standard persistent disk 1 GB of outbound data transfer from North America to all region destinations (excluding China and Australia) per month 因此等等在建立 vm 時,按照上面的條件建立,並且要注意的是建立兩個以上的 vm 還是要收錢的,免費的只有第一個 建立 vm 步驟 首先你會先需要建立一個 google cloud 帳號 在 compute engin 中,點選上方的 “Create Instance” ...

September 21, 2025

[這個網站的誕生: 02] 在 vm 上建立 nginx server

取得 domain 架設網站需要先註冊一個 domain, 這裡我使用的是 Cloudflare, 註冊好一個 domain 之後,在 DNS > Records 的地方新增一個 Record Type: A name: yamatrail.com IPv4 Address: 填入 vm 的 IP (在 google cloud 上取得) 這會告訴他當其他人在瀏覽器中輸入 yamatrail.com 時,會導到我們先前在 google cloud 上所建立的 vm 在 Cloudflare 產生憑證 登入您的 Cloudflare 儀表板,選擇 yamatrail.com。 點擊左側選單的 SSL/TLS,然後選擇 Origin Server (源伺服器) 子分頁。 點擊「Create Certificate」按鈕。 保持預設選項(私鑰類型 RSA,憑證有效期 15 年),直接點擊最下方的「Create」。 這是最關鍵的一步:Cloudflare 會顯示兩個大框框的文字,分別是 Origin Certificate 和 Private Key。 請立刻將這兩段文字完整複製出來,並分別儲存到您本地筆電的兩個純文字檔案中: 將 Origin Certificate 的內容存為 yamatrail.com.pem。 將 Private Key 的內容存為 yamatrail.com.key。 注意:Private Key 只會顯示這一次,關閉頁面後就再也看不到了! 之後就可以在 vm 上安裝並設定 nginx 了,在這之前可以先檢查 vm 的設定是否有允許 HTTP 及 HTTPS 連線 ...

September 21, 2025

[這個網站的誕生: 03] 使用 Hugo 產生網站

當我們設定好 vm 之後,先回到我們工作用的電腦,以我自己來說,這會是我的筆電。 我們的網站編輯與開發都會在這台筆電上,下一篇文章才會說明如何把網站內容部署到 vm 中, 總之,這篇文章的內容都在個人的筆電(或 PC)上操作。 安裝套件 sudo apt update && sudo apt upgrade -y sudo apt install nginx git -y wget https://github.com/gohugoio/hugo/releases/download/v0.146.0/hugo_extended_0.146.0_linux-amd64.deb sudo dpkg -i hugo_extended_0.146.0_linux-amd64.deb hugo version 在筆電上先使用 hugo 建立一個 repo 出來,並且使用 git 做版控,然後推到自己的 github 上 hugo new site yamatrail-site cd yamatrail-site git init git add . git commit -m "Init commit" 使用這個指令可以新增一篇文章: hugo new content posts/hello-world.md vim content/posts/hello-world.md 設定 theme 這裡可先在 Hugo Themes 看看,再決定自己要用的主題,我自己用的是 PaperMod ...

September 23, 2025

[這個網站的誕生: 04] Github Actions 建立自動部署

建立網站部署流程 總流程概覽 我這裡的部署流程為:大多數的檔案編輯都在我的筆電上,檔案修改完之後推到 github 上,利用 github action 自動部署到 vm 當中。 ssh key 的準備:在筆電和 VM 之間建立一對專門用於自動化部署的 SSH Key,讓 GitHub Actions 才有權限可以登入 vm 中。 設定 GitHub Repo:將 SSH 私鑰和伺服器資訊,以加密的方式儲存在 github repo 中的 Secrets 中。 建立 GitHub Actions Workflow:撰寫 .github/workflows/deploy.yaml 設定檔,這會告訴 github 該做些什麼把網站內容放到 vm 中。 觸發與驗證:將程式碼 git push 到 GitHub,觸發自動化流程,檢查流程是否正確。 階段一:準備工作 - 建立 SSH 信任關係 步驟 1:「筆電」上產生一對 SSH Key 在筆電上: # -t ed25519: 使用更現代、更安全的加密演算法 # -C "..." : 註解,方便你辨識這對 Key 的用途 # -f ~/.ssh/hugo_deploy_key: 指定金鑰檔案的路徑與名稱,避免覆蓋你現有的 id_rsa 或其他金鑰 ssh-keygen -t ed25519 -C "GitHub Actions for yamatrail.com" -f ~/.ssh/hugo_deploy_key 執行之後,會在 ~/.ssh/ 中產生公鑰與私鑰 ...

September 25, 2025