在VPS上架設個人網站、個人部落格 (使用GCP+Jekyll) (三)

當LNMP裝好之後,其實就可以發揮你無窮的想像力和創意(還有技術)去制作各種各樣的網站。這時候其實選擇是非常、非常的多。多到會讓人迷失方法,曾經我在這個路口位置迷茫了很久不知道該往那個方向走。

網站類型的選擇上

其實網站的類型真的五花八門、包羅萬有,但我就大概上把它分類為動態網站靜態網站兩種

如果網站是有現金流的操作,我還是建議交給專業人仕來設計你的網站,以避免網站潛在的安全性漏洞造成的重大損失。

由於我是拿來打造個人部落格,所以只整理出一些部落格相關資料。

一、動態網站

動態網頁主要是搭配伺服器與資料庫共同運作,主要是使用大量編譯的地方,如會員功能、購物車、討論區等等..,意思是指可以與網頁做互動編譯的網頁,動態網頁的內容隨著用戶的輸入和互動而有所不同有Perl、PHP、ASP、JSP、ColdFusion等編譯方式,從而對動態網頁的內容進行改變。

主要特點:

  • 盡可能更好的改善,逐步有數據庫的支持
  • 能實現更加豐富的功能

常見的動態部落格

  • Ghost
  • Wordpress
  • Medium

二、靜態網站

超文件標示語言HyperText Markup Language,簡稱:HTML,HTML是網站建置的基礎技術,常與CSS與Javascript配合成一個適合觀看的網頁,讓瀏覽器去讀取,一般判斷方式為網頁副檔名為html或htm皆為靜態網頁,靜態網頁的優勢為容易為搜尋引擎所接受,所以很多動態網頁會將動態網頁轉變成靜態方式,就是所謂的【偽靜態網頁】來提高搜尋引擎的友善度達到排名優化的成效。

主要特點:

  • 因為完全是靜態頁面,而且不需要和數據庫打交道,主要依靠JS和HTML,因此速度很快
  • 很多代碼託管平台和雲存儲可以免費放靜態頁面,成本低廉
  • 靜態頁面更加容易被搜索引擎抓取

常見的靜態部落格

  • Hexo
  • Jekyll
  • Octopress

為何選擇了靜態的Jekyll?

是的,會陷入選擇困難症,我當初在這裡花了相當長的時間作比較和搜集資料,其實並沒有哪一個比較好、哪一個比較差,因為不同的部落格和不同的類型都適合不同的人,像我就特別喜愛Jekyll,但Jekyll的高度客製化卻讓很多人避而遠之,所以說沒有好跟不好,只有合適跟不合適。

我理想的Blog應該具備這些:

  • markdown語法
  • 程式碼顯示美觀
  • 簡潔(無廣告)
  • 離線撰寫
  • 可用編譯器(如:vim)寫文章
  • 高度客製化
  • 可靠的備份與長久保存
  • 高移植性

而Jekyll又能滿足我以上所有條件,所以我就選擇了它。

Jekyll的安裝

安裝前置的相關依賴

因為我使用的是自己的主機,所以需要先安裝Ruby (Github上就不用)

sudo apt -y install ruby-full #Ruby居然是這名字啊坑啊
sudo apt -y install make build-essential

使用gem安裝bundle和jekyll

gem install bundler 
gem install jekyll

可以看看自己jekyll和ruby的版本

jekyll -v
ruby -v

生成Jekyll範例(官網的教學)

jekyll new my-awesome-site    #用新建一個jekyll格式的目錄
cd my-awesome-site    #進入剛新建的目錄
bundle exec jekyll serve 
# => Now browse to http://localhost:4000

執行完第三行後 可以主機的本地端網址打http://localhost:4000就可以看到範例結果

但問題我的主機(server)在遠方啊!!!

所以第三行要改一下

把範例結果臨時deploy到網站上:

bundle exec jekyll serve --host domain.name

domain.name改成自己的網址

把網站內容改成Jekyll範例

!!!注意 執行前請先備份原本的網站根目錄內容

jekyll build --source /home/user/my-awesome-site --destination /home/wwwroot/default/ --trace

/home/user/my-awesome-site 是你剛新成的Jekyll範例,也可以是你下載別人做好的Jekyll範例 /home/wwwroot/default/ 是你的網站根目錄

其實Jekyll就是一個靜態網站生成器,它就是把你寫好的內容轉換成html等網站可顯示的格式的新目錄(默認叫_site),上面的指令就是直接轉換到網站根目錄去

然後你再次打開瀏覽器,輸入你的網址就會看見Jekyll的默認範例

Jekyll的默認範例其實是minima

這樣就成功在VPS上搭建自己的部落格,關於如何使用別人的主題(Jekyll theme)和美化會在以後分享。

延伸閱讀

在VPS上架設個人網站、個人部落格 (使用GCP+Jekyll) (一)

在VPS上架設個人網站、個人部落格 (使用GCP+Jekyll) (二)

在VPS上架設個人網站、個人部落格 (使用GCP+Jekyll) (三)