目標

將 GitHub 上的 Hugo repo（包含所有檔案跟 Git 記錄）移動到 Linode 裡面，並在瀏覽器輸入 Linode IP 時能夠正常顯示。

以下為範例參數，請換成自己的：

• Linode IP：192.xx.xx.xx
• 個人網域：abc.com

本篇文章簡易流程

1. 在本地登入 Linode 主機
2. 在 Linode 主機安裝 Hugo 所需環境
3. 把 GitHub 整個專案複製到 Linode
4. 在 Linode 建構出 Hugo 網站
5. 安裝並設定 Nginx
6. 在瀏覽器輸入 Linode 主機 IP，看到網站正常運行

實際操作

1. 在本地登入 Linode 主機

在本地輸入：

ssh root@192.xx.xx.xx

此時會進入 Linode 主機。

2. 在 Linode 主機安裝 Hugo 所需環境

Hugo 需要安裝的套件：Hugo、golang。

apt update
apt install hugo golang

3. 把 GitHub 整個專案複製到 Linode

Linux 系統習慣把網站內容放到 var/www 資料夾中。

1. 進入 var/www。
2. 創建一個資料夾用來存放資料（資料夾名稱自己訂，我是直接把名稱叫做自己的網域）。
3. 把 GitHub 的資料複製到這個資料夾。

cd /var/www
git clone https://github.com/xxx/your-repo.git abc.com

4. 建構 Hugo 網站

在 Hugo 中，要把程式碼生成靜態資料，只要在所屬資料夾執行 hugo 就好。

cd /var/www/abc.com
hugo

這一步，會把網站的靜態資料輸出到 /var/www/abc.com/public。

5. 安裝並設定 Nginx

安裝 Nginx：

apt install nginx

這邊先簡單說明一下 Nginx 慣例用來放設定檔的位置：

• /etc/nginx/nginx.conf：主設定檔（通常不會動）
• /etc/nginx/sites-available/：此資料夾用來存放所有網站設定檔（不一定會啟用）
• /etc/nginx/sites-enabled/：Nginx 真正會載入的是這個資料夾。把真正要啟用的設定檔，從 available 建立一個連結到此資料夾。這個資料夾裡面只是一個入口，打開之後是導向 available 裡面的檔案。

打開網站配置檔 /etc/nginx/sites-available/abc.com：

vim /etc/nginx/sites-available/abc.com

內容：

server {
    listen 80;
    server_name 192.xx.xx.xx; # 之後改成自己的網域（abc.com）

    root /var/www/abc.com/public; # 剛剛靜態資料的資料夾
    index index.html; ## 首頁檔案在 /var/www/abc.com/public/index.html

    location / {
        try_files $uri $uri/ =404;
    }
}

建立 sites-enabled 資料夾，並在裡面放一個 abc.com 用來連結到 sites-available/abc.com。

mkdir -p /etc/nginx/sites-enabled
ln -s /etc/nginx/sites-available/abc.com /etc/nginx/sites-enabled/

重新載入 nginx：

nginx -t
systemctl reload nginx

6. 在瀏覽器輸入 Linode 主機 IP，看到網站正常運行

打開瀏覽器，輸入：

http://192.xx.xx.xx

成功看到你的 Hugo 網站！