[筆記] 使用 Google 服務和 WordPress，用一個下午架設個人網站

Note
Written By

在這個自媒體的時代下，個人網站是個必備，周遭朋友也有不少人有架設，就趁周六下午閒暇時間，從零到有來嘗試看看。

本篇介紹的方法是採用 Google Cloud Platform + Google Domains + WordPress.org ，大概一年會花 600~1200 台幣 (還不確定)，我大概花了 4~5 hr ，完成一切步驟，我會在本篇整理網路上可以找到的資源，再加以補充。

另外，這不一定是最省錢或最有效率的方法，但這是我做過功課最方便的方法，如果有其他更好的方式，或任何錯誤，都歡迎補充給我。

先備知識

架設網站，有以下五個重點，網域、虛擬機、DNS、SSL 認證、管理系統，只要完成每一項，網頁就大功告成了，日後就要好好經營管理就可以了。

  1. 網域： 網域就是你的門牌號碼，需要藉由輸入類似像 geneyao.com 的字串，讓網路上的其他人順利進入你的網頁，你的門牌越簡潔好記，就像住在市中心一樣，會讓人更容易瀏覽到你的網頁，也因為這點網域會因為名字價格有所不同，也會被人買走。
  2. 虛擬機： 簡單來說就是網站的運算資源，網頁總是需要東西在背後運算，當然你也可以用自己的主機來架設你的網頁，但 Google Cloud Platform 有別人寫好的套件，只要花點錢，就可以省下很多時間，並獲得穩定的運算資源。
  3. DNS： 可以將你用虛擬機架好的網站連結起來，有點像掛門牌一樣，透過輸入你購買的網域，順利連結到你的網站。
  4. SSL 認證： 完成上述基本上就可以讓人連到你的網站，但你的網頁沒有經過認證，會讓瀏覽器覺得你是危險的網頁，因此而阻饒大家的瀏覽，這是就需要 SSL 安全認證。
  5. 管理系統：最後網頁弄好就是需要一個好好的管理系統，設計你的外觀，管理你的文章，監控你的流量，這是用 Google Cloud Platform 內建的 WordPress 套件，他是一個開源免費好用的開源網站管理系統，全世界有近 40% 的網站都是用這套系統做的。

下面我會依序匯集在網路上找到的資源，由於其他人寫的已經非常完整，我會在卡住或覺得比較重要的地方加以補充。

一、網域

  • 使用平台： Google Domains
  • 花費： 一年 12 美金，約等於一年 360 台幣左右

首先要將你的網域買下來，讓大家可以透過你的網域 (ex. geneyao.com)，而非 IP (ex. 34.80..*)，連到你的網站。

Google Domain 雖然不是最便宜，但它整合了很多服務，不用額外花錢，版面簡潔好用，再加上我虛擬機也是在 Google Cloud Platform，因此就單純點，全部都在 Google 買服務。

  1. 註冊 Google Domain 帳號
  2. 購買網域

二、虛擬機

  • 使用平台： Google Cloud Platform

  • 花費： 一年 1800 ~ 3000 台幣 or 一個月 150~250 台幣 (前四個月免費，可能更高或更低，日後有實際數據再補上)
    2021/09/20 補充: 目前 2021/08 為 239 元 (台幣)

1. 啟動虛擬機

Follow 這篇的 Step 1 ~ Step 8，主要這邊是用 WordPress with NGINX and SSL Certified by Bitnami and Automattic ，這個基本上已經幫我們裝好全部我們架網業需要的東西，只要五分鐘就有一個基本的網頁，從 Deployment Manager 就可以進去 WordPress 的後台管理了 。
完成後，我會把以下釘選起來之後比較方便：

2. 進入虛擬機的 Terminal
從 Deployment Manager> 部屬作業，點選SSH，就可以連上虛擬機的 Terminal：

這樣就可以進去虛擬機的 Terminal ，就可以在裡面下指令操作了

3. 移除 Banner

開啟網頁，會發現左下有個 Banner ，在 Terminal 下這些指令可以移除 Banner：
$ sudo /opt/bitnami/apps/wordpress/bnconfig --disable_banner 1
$ sudo /opt/bitnami/ctlscript.sh restart apache
$ sudo /opt/bitnami/ctlscript.sh restart nginx

4. 自訂網域

讓你的網站跟你得網域對接，在 Terminal 下這指令：
sudo nano apps/wordpress/htdocs/wp-config.php
把 WP_SITEURL 與 WP_SITE 修改成這樣，htpps://geneyao.com 的部分則是在上一個不步驟你購買的網域名稱：

5. 改為靜態 IP

從 VPC 網路 > 外部 IP 位址，將類型改為靜態

6. 連上現在的網頁

以上虛擬機的部分就完成了，已經可以透過 IP ，連到自己的網頁，和進入 WordPress 後臺管理了。

可以從 Deployment Manager > 部屬作業 的 Site address 和 Admin URL 分別連到自己當前的網站和後台，進入後台只要使用 Admin user 和 Admin password 就可以進路後台管理自己的頁面。

三、DNS

  • 使用平台： Google Domains
  • 花費： 0 (已經包含在網域的服務)

處理完網域和虛擬機後，就下來就是要透過 DNS 將你的網域和你的網站對接起來，也就是說完成這步驟，就可以投過你的網域連結到你的網站。

到 Google Domains 點選 DNS ，在已註冊主機和自訂資源紀錄，依照圖上更改成你網域和虛擬機 IP 的位子。

四、 SSL 安全認證

  • 使用平台： Google Cloud Platform
  • 花費： 0 (已經包含在虛擬機的服務)

完成上述工作基本上你的網頁已經可以順利使用網域連到你的網站，但你的網頁會在瀏覽器顯示不安全，甚至阻擋他人連進來，這部分完成後就會如下圖，你的網址右邊就不會顯示不安全，而是一鎖頭的 icon ，也會讓他人順利連進你的網頁。

  • 參考網站：

  1. Generate And Install A Let's Encrypt SSL Certificate For A Bitnami Application (官方文件)
  2. 在GCP上安裝WordPress with NGINX and SSL Certified by Bitnami and Automattic，並設定Let’s Encrypt SSL憑證
  3. WordPress + GCP + SSL：給你最完整的免費網站架設教學

先藉由虛擬機連上 Terminal：

再根據參考網站第二篇文章的 「3. 申請SSL憑證」、「4. 設定定期更新SSL憑證」，在 Terminal 下指令，就可以完成 SSL 憑證，讓大家可以順利連進你的網站。

  • 9/20 補充：
    如果遇到沒有自動更新的狀況可以下以下指令自動更新 SSL:'
    $ sudo /opt/bitnami/ctlscript.sh stop nginx
    $ sudo /opt/bitnami/letsencrypt/lego --tls --email="EMAIL-ADDRESS" --domains="DOMAIN" --path="/opt/bitnami/letsencrypt" renew
    $ sudo /opt/bitnami/ctlscript.sh start nginx

五、WordPress 網站管理系統

  • 使用平台： Wordpress.org
  • 花費： 0 (開源的後台管理系統)

可以從 Deployment Manager > 部屬作業 的 Site address 和 Admin URL 分別連到自己當前的網站和後台，進入後台只要使用 Admin user 和 Admin password 就可以進路後台管理自己的頁面。

或是藉由有你的網域 (ex. geneyao.com) 瀏覽你的網頁，也可已透過 網域/wp-admim (ex. geneyao.com/wp-adim) ，使用 Admin user 和 Admin password 就可以進路後台管理自己的頁面。

WordPress 後台：

經過從後台調整後，網頁就完成了：

結語

這篇目的主要是紀錄自己從零到有的架站過程，如有錯誤或不清楚得地方請見諒，也可以告訴我，祝褔大家架站愉快！

Previous

[書摘] 巴菲特寫給股東的信
Next

[書摘] 投資最重要的事