从0-1教你利用服务器做属于自己的个人博客
目錄
- 引子
- 正文
- 前提條件
- **一、首先下載并安裝軟件Node.js**
- 歷史版本網址如下:https://nodejs.org/zh-cn/download/releases/
- 這里小編推薦大家安裝12.12左右的版本,
- 二、接下來我們安裝另一個必備軟件:git
- **三、安裝hexo**
- **四、部署個人博客(建站)**
- **五、對服務器的防火墻進行相關配置**
- **六、對云服務器控制臺進行相應設置**
- 我這兒是偷懶做法,所有一次性全部打開了
- 我們也可以只打開一個端口用于外部訪問,步驟如下:
- 七、Typora
引子
大家好,我是堅果。如果你媽迷惘。微信搜“堅果前端”公眾號,看看碼農的軌跡
因為學習IT技術還是想應用到學習、工作、生活中,讓它們更美好,就應該授人以漁,畢竟自己動手了才有收獲
先給大家分享一下我與我的粉絲的部分聊天記錄
通過這些記錄就是告訴大家,不論學歷咋樣,不論專業是不是計算機,只要有一個愛鉆研的心,不懼困難,你都可以搭建屬于自己的一個簡單博客,
正文
今天的這篇教程是基于windows服務器進行的
由于幫助的是一位非計算機專業的學生,所以覺得windows會更適用
先來看一下成功后的截圖
前提條件
-
購買服務器
-
Node.js
-
Git
當然如何安裝git和Npm我也會在本教程指出。
在搭建個人博客之前默認大家已經購買并成功登錄了服務器(搭建個人博客的所有操作中,除對云服務器控制臺的相關設置是在我們本地電腦上操作外,其余均在服務器上進行),
關于如何遠程連接自己購買的服務器,大家可觀看小編往期發布的教程進行對應操作
小編所使用的是windows操作系統的阿里云服務器,詳細參數如下圖所示,供大家參考
搭建博客的前提:安裝Node.js和git兩個軟件
一、首先下載并安裝軟件Node.js
歷史版本網址如下:https://nodejs.org/zh-cn/download/releases/
復制到瀏覽器打開即可
這里小編推薦大家安裝12.12左右的版本,
主要是太新的版本,目前hugo,gitbook。hexo的支持都不太好
截至寫這篇文檔前,最新的版本為16.13.0
下圖所示,由于頁面太多,我們先點擊第4頁,以瀏覽后面的頁面,找到12.12左右的版本
如下圖所示,點擊至第7頁,理由同上
[外鏈圖片轉存失敗,源站可能有防盜鏈機制,建議將圖片保存下來直接上傳(img-BnHUujN5-1636330100441)(C:/Users/Luckly/AppData/Local/Temp/msohtmlclip1/01/clip_image006.jpg)]
如下圖所示,在點擊到第10頁時,我們可以看到有12.12左右的版本
此時我們選擇12.12.7版本下載,如圖所示點擊下載
跳轉至如下頁面后點擊圖上所指的鏈接進行下載
下載中,等待安裝包下載完成后打開安裝
點擊“打開文件”進行安裝
若彈出如下頁面,點擊“是”,允許應用對設備進行更改即可!
安裝界面如下圖所示,點擊Next
點擊勾選下圖所示方框,后繼續點擊“Next”
選擇默認,點擊“Next”兩次后顯示界面如下:
按下圖中所示,勾選方框后點擊“Next”。
點擊下圖中箭頭所指的“Install”按鈕進行安裝
等待安裝完成
點擊Finish完成安裝
安裝完成后出現如下彈窗,點擊右上角叉號關閉即可!
按住鍵盤上的Win+R鍵,輸入命令“cmd”后回車確定,
緊接著在打開的命令行中輸入命令“node -v”后回車確定,以檢查Node.js是否正確安裝
已安裝的軟件版本會如下圖顯示出來,同之前下載的軟件版本一致,則證明安裝正確
二、接下來我們安裝另一個必備軟件:git
網址如下:https://git-scm.com/ 復制到瀏覽器打開即可
點擊圖示按鈕下載git安裝包
等待下載完成……
點擊“打開文件”運行安裝
若彈出如下頁面,點擊“是”,允許應用對設備進行更改即可!
安裝界面如下,一直點擊Next,直至安裝完成,所有勾選保持默認即可!
點擊Install進行安裝
等待安裝完成
下圖中的方框保持默認或不勾選均可,點擊“Finish”按鈕,完成安裝
至此,git這一軟件我們也安裝完成了!
此外我們還需要安裝用來部署博客的軟件,有以下幾種可供大家選擇,gitbook 、hugo、 hexo 、docifsy。這里小編推薦大家安裝hexo這一軟件、
當然需要其他教程的,大家也可以
三、安裝hexo
官方地址:
https://hexo.bootcss.com/
按住鍵盤上的Win+R鍵,輸入命令“cmd”后回車確定,
緊接著在打開的命令行中輸入命令“npm install hexo-cli -g”后回車確定
這是全局安裝的命令
npm install hexo-cli -g
運行中,等待安裝完成
待運行完成后輸入“hexo version”命令,回車運行
顯示如下圖所示即為安裝正確
至此,搭建博客所需要的軟件我們已安裝完畢,接下來我們就可以用前面安裝好的軟件來部署我們的個人博客了!
四、部署個人博客(建站)
安裝 Hexo 完成后,請執行下列命令,Hexo 將會在指定文件夾中新建所需要的文件。
hexo init jianguocd jianguonpm install新建完成后,指定文件夾的目錄如下:
. ├── _config.yml ├── package.json ├── scaffolds ├── source | ├── _drafts | └── _posts └── themes在這兒,不講解過多的hexo命令以及它的配置
直接啟動服務器。默認情況下,訪問網址為: http://localhost:4000/。
hexo server五、對服務器的防火墻進行相關配置
如下圖所示,在服務器桌面左下角搜索“防火墻和網絡保護”,查找到后點擊進入設置
將頁面拉至最低端,點擊進入“高級設置”選項
先點擊“入站規則”,然后點擊進入“新建規則”選項
跳轉至如下頁面,在規則類型一欄下,選中端口后點擊“下一步”
我們在下圖所指示的框內輸入我們想要使用的端口,小編這里輸入4000作為示范,然后點擊“下一步”
跳轉至如下頁面,我們選中“允許連接”后繼續“下一步”
繼續“下一步”
在下圖所指出的框內輸入名稱和對網站的描述(網站的描述也可不填)后點擊“完成”
如下圖所示,新的規則已經創建成功
如下圖所示,我們點擊“刷新”
至此我們就完成了對防火墻的相關設置,接下來我們對阿里云服務器控制臺進行相應的設置
如果想偷懶,可以一次性打開所有端口
六、對云服務器控制臺進行相應設置
接下來對云服務器控制臺的相關操作我們需要切回本地電腦并登錄阿里云服務器控制臺來進行
登錄阿里云進入到云服務器控制臺后,如下圖所示,點擊進入“實例”一欄后點擊我們云服務器的實例ID進入實例
切換至如下頁面,點擊“配置安全組規則”
切換至如下頁面,點擊“配置規則”
切換至如下頁面,如圖所示依次點擊進行
我這兒是偷懶做法,所有一次性全部打開了
跳轉至如下界面,將圖中所標示的地方同下圖配置一致,點擊“確定”,端口配置完成
上述方式是打開了服務器的所有端口,比較便利,如果大家有安全方面的考慮,
我們也可以只打開一個端口用于外部訪問,步驟如下:
按照下圖所示依次點擊進行操作
按照下圖所示依次進行配置,因為之前在第五步(對服務器的防火墻進行相關配置)中,我們設置的端口是4000,所以在“端口范圍”à“目的”一欄這里我們也需要對應設置為4000,其余參數同下圖保持一致,點擊 “保存”即可
如下圖所示,可以看到我們規則已經創建完成
七、運行之前部署的網站
切換到服務器上,回到之前部署網站的文件夾,右鍵選擇“Git Bash Here”選項,打開git進行運行,輸入“hexo s”命令回車運行
如下圖顯示,所建的網站已經在服務器上運行了起來,此刻我們便可以通過我們所建網站的IP地址在瀏覽器上進行訪問了,網址形如:http://8.142.39.12:4000 (http://服務器的ip地址:端口)
訪問效果如下:
至此,我們的個人博客就搭建成功了
要編寫博客,我們還需要一款編輯軟件,
七、Typora
小編推薦使用Typora這一軟件,
網址為https://typora.io/#windows (Typora — a markdown editor, markdown reader.)復制至瀏覽器打開下載即可,
此處不再贅述。
這個問題就記錄到這兒,
這是一個幫助粉絲解決問題的過程,也是程序員在編程之路上的點滴記錄,如果那個粉絲想定制更高端的博客,我也會提供相應的教程。
總結
以上是生活随笔為你收集整理的从0-1教你利用服务器做属于自己的个人博客的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 如何重置云服务器系统
- 下一篇: Windoes下安装配置flutter环