前言

為什麼要寫作

1. 職場積累的輸入輸出，不記錄下來則會忘記。
2. 個人的成果需要有更多的展示平台，IT是手藝活，需要有自己的作品。
3. 寫作是很好的學習方式，通過寫作倒逼自己學習，而不是一味看各類文章，看只是一部分，如果要深入理解知識，必須自己寫出來。

為什麼要搭建個人博客

1. 我也有公眾平台，這類的公共平台有流量和關注，可以好好維護。
2. 隨着網絡的發展，監管隨之而來，個人網站更自由，是更好的文章歸類的地方，並且自己維護更加放心，不想自己的心血有朝一日404

搭建個人博客的流程

釐清步驟

1. 購買雲服務器（時間久一些，最低配置）
2. 購買域名（雲服務器廠商是同一個雲服務廠商）
3. 備案（2個）：ICP域名備案、公安的備案
4. 雲服務器做好登錄配置，安裝配置 nginx、https
5. 選擇博客的靜態網站生成器，選擇主題，製作第一個博客，更新到服務器。

接下來，就是每一個步驟的細緻拆解，對於一個開發工程師來説，其實是很簡單的，但簡單不意味着可以立馬手到擒來，我工作了5年+了，現在才明白：簡單的事情細緻的做，做好、做對，堅持做正確的事情，就很棒了。

購買雲服務器

雲服務網站操作使用

• 阿里雲、騰訊雲的web網站大而全，模塊、功能很多，不過提示、説明、購買操作等都很方便，在首頁中間的搜索直達很方便，我們使用的一般就幾個：雲服務器、域名、備案，輸入這些關鍵詞就可以命中對應的功能模塊，多花點時間瀏覽頁面，時間久了就熟悉了。
• 後續的説明不會一步一步截圖説明步驟流程，我自己在找教程做網站的時候，那種一步一步的教程看似有用，但網站會更新，很多操作就沒用了，實際上是要弄清楚做這些事情的來龍去脈。

雲服務器和輕量應用服務器的區別

• 雲服務器適合架構複雜的應用場景，如高併發網站、大型遊戲、複雜分佈式集羣應用、視頻編解碼、大數據分析、機器學習、深度學習等；
• 輕量應用服務器更適合簡單一些的單機應用，例如企業網站、博客、商品展示類網站、微信小程序、通用Web應用場景、移動端APP、小程序、雲盤、圖牀、雲端開發測試環境及學習環境等。

以上，我選擇的是雲服務器，可以DIY，至於配置，越便宜越好。

可選擇的雲服務器廠商很多，比如：阿里雲、騰訊雲、華為雲、移動雲、聯通雲、金山雲，我覺得選擇大牌、便宜的即可，我挑選了便宜的騰訊雲，我們做的是長遠的事情，要看10年的，所以大公司的更保險一些。

配置和價格如下

價格説明

• 所需要購買的是：CPU內存、帶寬、磁盤，這3樣都需要，價格單獨計算，不過合併打包一起後，購買更便宜，我們做長久打算的話，這種付費都是預付費，如果預知未來這些是漲價的情況下，則趁着活動價直接買斷5年、10年的價格，這樣性價比更高。
• 各類活動：雙十一、六一八的時候，阿里雲、騰訊雲有做活動，新老顧客都有，但最優惠的是新人活動，我的2018年已經用掉了好幾個雲廠商的新人優惠，所以這次購買的貴了一些。

配置合計

• 操作系統：阿里雲或者騰訊雲維護的Linux系統（TencentOS），可更新，有維護，免費
• CPU和內存：2核、2GB，也是最便宜的，收費
• 帶寬：1Mbps，有公網IP可訪問，收費
• 系統盤：高性能雲硬盤網絡，這裏有不同價位的，估計是材質不同吧，我選擇了最便宜的，收費
• 總計價格：購買的時候1314元5年，772.2元3年，1314平均後是21.9元/月，772.2平均後是21.45元/月，我覺得對於一個簡單的個人博客網站而言，22元/月是能接受的。

購買域名

• 域名最多買10年，前幾年不需要續費，最後一年估計會提醒續費。
• 頂級域名是後綴，比如com cn vip top 等等，價格不一樣。
• 我買的是10年的，xiaoqiuqiu.cn，價格也比較透明，330+，也是中等價格。
• 20年前很多公司開始炒作、囤積域名，所以很多短小、顧名思義的域名都在這些公司手上，不過現在域名不再重要，我們挑選合適的即可。
• 很多年前，阿里雲收購了萬網，騰訊收購DNSPOD，都開始做域名生意。

為什麼域名購買和服務器購買需要在同一個平台

域名備案的操作需要有一個依託的服務器，假如：域名在阿里雲，雲服務器在騰訊雲，則數據無法打通。域名和服務器都在阿里雲或者都在騰訊雲的話，兩者一綁定，數據一關聯，頁面操作會簡單很多。

ICP備案（管局審核）

• ICP是Internet Content Provider的簡稱，做網站相當於是網絡服務提供商，這個是工信部在管理，備案信息網站是：https://beian.miit.gov.cn
• 域名和雲服務器都在在騰訊雲，則備案很方便，備案主體可以是個人、公司，都要填寫真實信息，首先騰訊雲審核一遍，再提交到工信部審核，個體（個人、公司）無法直接去工信部審核，需要有對應有資質的公司作為中介才行，所以綁定某個雲服務廠商最方便。
• 備案的個人信息很全，所以網站不能有不良信息，否則很危險，所以國內的危險網站都是在東南亞，那裏的網絡監管猜測就是很寬鬆。
• 不需要購買備案服務，這都要錢，根據操作手冊一步一步填寫提交，難度很低。整套流程在5-8個工作日，最後審批的ICP備案號和省份綁定，比如騰訊公司官網下面的備案號是：ICP備案/許可證號：粵B2-20090059，我的備案號在 > https://xiaoqiuqiu.cn 可看到。

公安備案（完成ICP備案後操作）

• 全稱是：全國公安機關互聯網站安全管理服務平台，網址是：https://beian.mps.gov.cn，這個是公安部的備案
• ICP網站備案成功後，網站開通之日起30日內可以去公安部完成備案
• 和ICP備案一樣，也是填寫一大堆的真實信息，提交審核，等待1-3個工作日。

配置服務器

配置https

https是可配也可不配，但我認為現在正經網站都要用到https了，而且也很簡單，所以就配置了，否則瀏覽器都會説這網站不安全。

1. 在騰訊雲中可以申領免費的1年的https證書，如果是多年的而且證書更全的那種就要收費了，而且收費很貴，我們博客只需要1年1年自己手動維護即可。
2. 搜索框中搜索「SSL 證書」，有按鈕「申請免費證書」，根據操作實名填寫信息，等待審核，幾分鐘就審核通過，再把證書文件下載到本地。
3. 看描述是騰訊雲最多隻有50份免費證書，但七牛、阿里雲等其他各式各樣的廠商都可以申請證書，數量不用擔心。
4. SSL證書和域名綁定，這樣域名就可以通過瀏覽器的安全校驗了。

服務器配置注意事項

其實，雲服務下來後，就可以直接使用了，備案的2個步驟可以同步進行，因為使用公網IP登錄服務器是沒有什麼限制的，就我使用的幾天來看，有幾點需要配置和注意（具體的配置步驟，就不寫了，可以自行搜索查詢）。

1. 開通常用的端口，在「服務器列表-安全組」裏面，可以使用推薦的規則，入站、出站都開着，ICMP、SSH等，端口有：80、22、3389，就是説 ssh http https 都要開啓，否則網頁無法訪問。
2. 增加自定義ssh登錄用户，比如名字是 abc，關閉 root的ssh登錄，因為我們沒有購買安全監控，很多國外IP會掃描各類雲服務器IP，使用root碰撞嘗試登錄後台。
3. 使用 yum 安裝 nginx，因為大部分博客是靜態html頁面，需要nginx來做反向代理，指向基礎的index.html頁面。

nginx.conf 的配置

以下是需要注意的點，具體的操作也是單獨各自百度查詢處理，配置這些就是為了：用443端口訪問服務器，通過nginx得到實際的index.html文件，再在瀏覽器中渲染dom展示出來。

1. 80端口重定向到443端口，這樣就強制使用https，而不是http了，瀏覽器網址欄就有個安全的小鎖。
2. 上傳https的安全證書（pem key後綴）到某個自定義路徑，nginx.conf配置中 ssl_certificate 的值就放pem文件的絕對路徑，ssl_certificate_key就放key證書的絕對路徑。
3. 自定義錯誤頁，出錯了可以有好看的錯誤頁
4. server_name綁定域名，root存放靜態博客的絕對路徑
5. 關閉瀏覽器緩存no-store, no-cache等等

使用博客網站生成器生成網站

博客形態的靜態站點生成器有：Jekyll、Hugo、Hexo，這些都是國外的網站，網站中有各個用户製作的主題，原理大多類似，原理：有一個模版目錄，其中包含原始文本格式的文檔，通過 Markdown 或者 Liquid 轉化成一個完整的可發佈的靜態網站，可以上傳到服務器中。

在這樣的博客站點中，需要有對應的代碼環境執行命令，在自己的電腦（Windows or macOS系統）生存html css js 文件，然後再上傳到服務器中，服務器就不需要對應的Node.js or python 環境了。

一開始我選用的是docsify來生成網址，這是Vue.js開發的的小清新綠色背景網站，缺點是擴展性不強，左側樹無法自定義多種左側樹，而且沒有標籤雲，所以放棄。

最後選用的是 hugo，主題是: Next，安裝環境，下載主題，然後修改為自己的配置、logo等等，本地的配置就改好了。PS: 如果github不好上，可以考慮gitee

hugo安裝步驟

1. 安裝好準備 Git Node.js 的本地環境
2. 在 hugo 官網安裝 hugo，這有2種，一種是 hugo，另一種是 hugo extended，extended是hugo的複雜版本，功能更多，直接裝extended，就要去github的releases找安裝包，我的是macOS，安裝文件是：hugo_extended_0.118.2_darwin-universal.tar.gz，附上網址：https://github.com/gohugoio/hugo/releases，選擇合適的版本和操作系統，下載即可。
3. 在hugo官網下載主題（theme），放到hugo的目錄中，相當於hugo extended + next theme 就起效果了，所謂的主題就是已經做好的css樣式的合集。

參考的文檔

https://lisenhui.cn/blog/upgrade-blog-use-new-theme.html
https://themes.gohugo.io/themes/hugo-theme-next/
https://gohugo.io/getting-started/quick-start/
https://gitee.com/hugo-next/hugo-next-docs
https://github.com/gohugoio/hugo/releases

一些具體的配置

• 我們需要把config.toml和content文件夾複製到我們的新建的站點目錄下
• config.toml 是配置文件，在裏面可以定義博客地址，構建配置，標題，導航欄等等。
• themes是主題目錄，可以下載喜歡的主題，然後配置在config.toml裏面。
• content是博客文章的目錄。
• static是博客的靜態資源，比如圖片
• public是編譯後的目標文件的目錄。
• 注：當前目錄是你的源文件，也就是包括一堆模版，博客源文件（markdown），配置文件，圖片的一個源文件的集合。 最終展示在網頁的是目標文件，也就根據你的資源和配置，最終生成的一個個包括css，js的html網頁。
• 在終端中執行：hugo server --buildDrafts，以上為默認啓動，--buildDrafts用於是否顯示草稿文章，其他的 hugo 命令，可以 hugo --help 看下，或者直接看文檔。

靜態博客和動態博客的區別

• 靜態網站：網站的html結構和鏈接的文章都已經固定了，自己電腦做好結構和目錄，然後使用xftp等軟件遠程上傳到服務器。
• 動態網站：有交互，有登錄、評論、收藏、用户系統、管理系統等，需要維護：管理端前端代碼、用户端前端代碼、服務器後端代碼、MySQL、Redis，如果有全文檢索則還有ES等等，如果僅有一台服務器，則安裝這些環境就不太夠用了。
• 靜態網站簡單，是輸出展示型的；動態網站複雜，可以蒐集：用户數據、流量數據等，當然是動態網站好，但是機器不夠用啊。如果未來感覺到網站越來越好，那從靜態網站遷移到動態網站就可以了。