What is Hexo? 什么是 Hexo？

Hexo is a blog framework that can generate static websites. Compared to dynamic websites, a database is needed. The files of static websites are stored on the computer, which will be more convenient for transfer in the future.
Hexo 是一個能夠產生靜態網站的網誌框架，相對於動態網站需要有一個資料庫，靜態網站的檔案存在電腦上，將來在轉移的時候也比較方便。你也能够将你的部落格发布在 Github-Pages 上，无需任何费用。

不会编程的也没有关系哦，只要是 Windows 使用者照着以下方法一切都能在 CMD 搞定

Setting Up Envinroment

Getting Ready

Make sure that you have installed Nodejs and Git before proceed to the next step.
If you are using Windows

  • CMD
  • Nodejs
  • Git

Install Hexo

Install Hexo in the terminal with npm.

1
$ npm install -g hexo-cli

Make sure that Hexo is installed in your system

Hexo would not work if it is not installed.
如果 Hexo 没有安装成功, 它将不会运行。

1
2
3
4
5
6
7
8
9
10
$ hexo -v
hexo-cli: 0.1.9
os: Darwin 14.3.0 darwin x64
http_parser: 2.3
node: 0.12.7
v8: 3.28.71.19
uv: 1.6.1
zlib: 1.2.8
modules: 14
openssl: 1.0.1p

Create a project

1
2
3
$ hexo init blog #Initiates a blog 建立部落格
$ cd blog #載入資料夾
$ npm install #安裝npm套件

Run a test

Test the server to see whether it could work successfully.
试跑下服务器

1
$ hexo server

How to create new post?

Create a post

这里我们简单的开一个新的文章，文章名称可以随意设定。在这里我们就命名为 first-post。

1
$ hexo new first-post

Edit post

Windows 使用者请到 C:\Users\ 这里是你电脑的名字 \blog\source_posts 打开你刚刚开的 post 的名字 first-post.md。
打开了之后你会看到一下的信息，在这些信息的下面可以写下你的信息。

1
2
3
4
---
title: 'first-post'
date: 2020-02-14 14:51:37
---

因为是 markdown language 这里推荐几款软件

Online Editor 无需下载

Download Editor 需要下载

不熟悉 markdown 的
Markdown Guide

Load server

使用 hexo server 啟動本地伺服器，來預覽 Hexo 部落格，預設開的 port 為 4000，不過像是下圖，如果 Port 被占用，就無法正常運行。

1
$ hexo server

在瀏覽器輸入: localhost:4000 就可以看到我們建立好的 Hexo 部落格囉。

Create a github account

Github
alt text

Create a repository

登陸 Github 帳號並新增一個 repository ，”Repository name” 命名規則為 “用戶名”+”.github.io”。

進到視窗畫面後依序輸入以下 3 行指令來獲取密鑰文件。

1
2
3
$ git config --global user.name "github 用戶名"
$ git config --global user.email "github 註冊信箱"
$ ssh-keygen -t rsa -C "github 註冊信箱"

Take key

進到剛剛產生的密鑰位置，預設位置為”C:\Users\用戶名.ssh”，找到 “id_rsa.pub” 並使用文字文件打開，將所有內容複製起來，待會使用。

Setup key

回到 Github “Setting” 中的 “SSH and GPG keys”，新增一個 SSH keys，”Title” 名稱可以任取，”key” 就填入剛剛複製的密鑰。
alt text

Set information to use Git

Install Hexo deployer git in the terminal

1
2
$ npm install hexo-deployer-git --save
$ vi _config.yml

Open _config.yml file in C:\Users\ username \blog
更改 C:\Users\ username \blog_config.yml 里面的信息

1
2
3
4
deploy:
type: git
repo: https://github.com/username/username.github.io
branch: master # remember that GitHub Pages uses this branc

生成靜態檔案

1
$ hexo generate --watch

Deploy your blog 发布

將網站部署到 Github Pages 上

1
2
$ hexo clean
$ hexo deploy

Summary 总结

Hexo is a great environment to post your blog.

Reference 参考资料

Documentation | Hexo

Remarks 备注

Create new a new page or post 新增页面或文章

1
$ hexo new [layout] !title!

layout 布局

有三种布局个别是 post, page 和 draft

Layout Draft
post source/_posts
page source
draft source/_drafts

Configurations 设定

Basic Settings 基本设置

1
2
3
4
5
6
7
title: 網站標題
subtitle: 網站副標題
description: 網站描述
keywords: 網站關鍵字
author: 作者名稱
language: zh-TW
timezone: Asia/Taipei

Frequent used commands 常用指令

1
2
3
4
5
$ hexo generate      #產生靜態檔案
$ hexo deploy        #部署至github
$ hexo server        #啟動本地端server
$ hexo new <post>          #新增文章
$ hexo clean         #清除現有的靜態檔案