1. 程式人生 > >Hexo+Github搭建博客

Hexo+Github搭建博客

rdquo 這樣的 gin .html his node js can stop markdown

作者:桂。

時間:2017-06-10 08:08:04

鏈接:http://www.cnblogs.com/xingshansi/p/6974267.html


前言

開會開了整整一周,剛下火車回來。打算記錄自己看的電影、書籍,記錄一些感性的文字,這類信息對公式、排版要求比較簡單,想著自己搭建一個基本型博客。

一、環境及軟件

  A-環境

  • windows8.1系統
  • 64位

  B-軟件

1-Node.js

類似javascript,網頁制作三件套:html(內容)+CSS(結構布局)+JS(javascript,網頁的行為)。

Node.js下載安裝;

2-Git

Git是目前最先進的版本控制系統,擁有最多的用戶數量並管理著數量龐大的實際軟件項目;風靡全球的Github更是讓Git版本控制系統名聲大震。

3-hexo

Hexo 是由臺灣個人團隊基於 Node JS 開發的一個快速、簡潔且高效的博客框架。完全開源,源代碼托管在 Github 上。安裝後,通過其簡單的命令就可以在本地快速的搭建起一個個人博客。官網上提供的文檔全面且易閱讀,非常容易上手。

Hexo:右鍵選擇Git bash here.

技術分享

安裝Hexo:

npm install hexo-cli -g

  直接的復制粘貼是不行的,可以按如下操作:

技術分享

右擊左上角的圖標→屬性→快速編輯模式打鉤

技術分享

鼠標點擊右鍵即可粘貼。

安裝完畢

技術分享

二、博客搭建

幾個hexo常用的命令,#後面為註釋。

$ hexo g #完整命令為hexo generate,用於生成靜態文件
$ hexo s #完整命令為hexo server,用於啟動服務器,主要用來本地預覽
$ hexo d #完整命令為hexo deploy,用於將本地文件發布到github上
$ hexo n #完整命令為hexo new,用於新建一篇文章

  pacKage.json的更多信息參考這裏。

  A-搭建本地博客

初始化博客

cd d:/hexo
//npm install hexo-cli -g   此步驟為安裝操作,假設已完成
hexo init blog
cd blog
npm install
hexo g # 或者hexo generate
hexo s # 或者hexo server,可以在http://localhost:4000/ 查看

  這個時候輸入http://127.0.0.1:4000/理論上可以訪問了,但我這裏報錯。參考這篇文章做了修改:  

If you can run hexo s perfectly, but can’t vist the local page at http://localhost:4000/blog/. May you can try another port like 5000:

$ hexo server -p 5000
INFO  Start processing
INFO  Hexo is running at http://0.0.0.0:5000/blog/. Press Ctrl+C to stop.

  但這樣的修改只是一次性有效,要想永久有效:You can add this configuration to the file _config.yml at root:

server:
  port: 5000 # or anohter number
  log: false
  ip: 0.0.0.0
  compress: false
  header: true

  如圖:

技術分享

Run, then ok:

$ hexo s
INFO  Start processing
INFO  Hexo is running at http://0.0.0.0:5000/blog/. Press Ctrl+C to stop.

  這樣本地的博客就搭建完成了。

技術分享

  B-博客編輯

可以借助markdown進行編輯,考慮到自己此次搭建的博客不復雜,直接用之前的馬克飛象,一來可以上傳,二來可以同步到自己的印象筆記。

新建筆記:

hexo new "測試"

  對“測試.md”利用markdown編輯器編輯,

hexo generate //生成html靜態文件

  登陸即可訪問:

技術分享

到目前為止,博客的操作都限定在本地,下面梳理一下網頁訪問的操作。

感興趣也可以給博客換風格。

  C-網頁訪問

新建github的repo,具體可以參考這裏。

修改_config.yml中的develop,

# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
      type: git
      repo: https://github.com/用戶名/用戶名.github.io.git
      branch: master

然後,通過 npm install hexo-deployer-git --save 安裝部署插件,並進行部署 hexo deploy

至此一個基本的博客搭建完畢,別人也可以通過網絡訪問。

技術分享

三、文檔管理

按照自己的設想,博客至少需要以下幾個功能:

  1. 基本操作:修改個人信息、文件分類
  2. 圖片插入
  3. 音頻輸入:記錄自己的一些朗讀
  4. 支持超鏈接:引用關於某本書、某個電影的相關文檔
  5. 快速檢索:文檔會比較瑣碎,需要支持如:標簽、關鍵詞、作者等檢索,用Markdown同步到印象筆記,可以解決這個問題,希望最好直接可以在博客進行該操作

目前想到就這些,需要再作補充。

個人信息:具體操作,直接套用模板。並作簡單修改。其實就是添加about頁面

hexo new page "about"

  之後在\source\about\index.md目錄下會生成一個index.md文件,打開輸入個人信息即可

技術分享

文件分類

圖片插入

音頻插入

超鏈接

檢索:模板中已兼備,修改可參考。

Hexo+Github搭建博客