發現Netlify,一個非常適合靜態網站的優秀托管服務,它還有一個很好的免費計劃、免費CDN並且運行非常快速。

我把我的博客托管在Netlify上。

我一段時間前轉移,我的前一個托管服務遇到了一些問題,導致我的網站在幾個小時內無法訪問,所以在等待它恢復上線期間,我尋找了一個快速的方式將其還原,並在Netlify上創建了一個複本。

由於這個博客使用的是Hugo,它是一個靜態網站生成器,所以我不需要太多工作將博客遷移到新的托管服務上。我只需要一個可以提供HTML文件的地方,而這幾乎是地球上的任何一個托管服務都能做到的。

我開始尋找最適合靜態網站的平台,有一些平台在我眼中脫穎而出,但最終我選擇了Netlify,並且很高興我這麼做了。

Netlify Logo

介紹Netlify

在我嘗試之前,有一些讓我留下了極好印象的事情。

首先,免費計劃非常豐富,無論是免費還是商業項目都可以享有100GB的每月免費帶寬,對於一個只有一些圖片的靜態網站來說,這是一個非常寬敞的空間。

它們提供全球CDN,以確保速度不成問題,即使在遠離中央位置服務器的大陸上也是如此。

你可以將你的DNS nameserver 指向Netlify,他們會為你處理一切,並且提供一個非常漂亮的界面來設置高級需求。

它們當然支援自訂域名和HTTPS。

從Firebase過來,我期望能夠以一種對程序員友好的方式來管理部署,但我發現Netlify在處理每個靜態網站生成器方面甚至更好。

Netlify和Hugo

我使用的是Hugo,在本地我使用它內建的工具hugo server運行服務器,該工具會在每次更改時重新構建所有HTML文件,並且默認運行一個HTTP服務器,端口為1313

為了生成靜態網站,我需要運行hugo,這會在public/文件夾中創建一系列的文件。

在Firebase的情況下,我採用了這個方法:我運行hugo來創建文件,然後運行firebase deploy,配置它將public/文件夾的內容推送到Google服務器。

然而,在Netlify的情況下,我將它連接到了我私有的GitHub存儲庫,並且每次我推送到我告訴Netlify同步的主分支時,Netlify都會啟動新的部署,變更將在幾秒鐘內生效。

控制面板

提示:如果你在Netlify上使用Hugo,請確保在netlify.toml中設置HUGO_VERSION為最新的Hugo穩定版本,因為默認版本可能比較舊(截至目前為止)並且不支援最新的功能,例如後綴束。這是我的netlify.toml配置文件

如果你覺得這不是什麼新鮮事,你是正確的,因為這在自己的服務器上並不難實現(我在其他沒有托管在Netlify上的網站上也這麼做),但這裡有一些新鮮事情:你可以預覽GitHub(或GitLab、或BitBucket)的任何分支/PR,同時你的主站點仍然運行並顯示“穩定”的內容。

另一個很酷的功能是可以在2個不同的Git分支上進行A/B測試。

Netlify為靜態網站提供的高級功能

靜態網站的顯而易見的限制是不能執行任何服務器端操作,這和你從傳統CMS(如WordPress)中期望的功能不一樣。

這既是一個優勢(因為安全問題較少),也是一個你可以實現的功能的限制。

一個博客並不復雜,你可以使用像Disqus或其他類似服務來添加評論功能。

或者,你可以通過嵌入第三方應用程序(如Wufoo或Google Forms)生成的表單來添加表單。

Netlify提供了一套工具來處理表單,驗證用戶,甚至部署和管理Lambda函數

需要在發布之前對網站進行密碼保護?✅

需要處理CORS?✅

需要進行301重定向?✅

需要為你的SPA進行預渲染?✅

我只是觸及了Netlify提供的功能的表面,而沒有借助第三方服務,希望我給你提供了一個嘗試Netlify的理由。

預覽分支

GitHub的集成和拉取請求一起工作得很好。

每次你推送一個拉取請求,Netlify就會在一個特定的URL上部署該分支,你可以與你的團隊共享這個URL,或者與任何你想共享的人共享。

這裡,我提出了一個拉取請求,以預覽博客文章,但只在我的公共博客上不可用:

GitHub 拉取請求

Netlify立即捕捉到它,並自動部署它🎉

預覽已部署

點擊鏈接會將您指向一個特殊的URL,讓您可以預覽該分支的網站版本。