Build a Blog with Hexo and Github Pages (1)

Posted on | In | 0 comments 
Part 1: Installation and Environment Setup

Blog

I have been looking for a way to build my own blog and I’ve tried both Chineses (Jianshu, CSDN) and English websites (Wordpress), but all of them didn’t satisfy me in some way.

Why Hexo is a good solution for me?

  1. No ads, especially comparing to Wordpress.
  2. Simple to setup the environment and deploy.
  3. Free to host togehter with Github pages.
  4. Supporting user-defined styles. You can choose to use a theme, or design your own customized site style.
  5. The most important features, supporting markdown syntax for coding,

Install Hexo

Install Node.js

You should have npm installed in your PC before the installation of Hexo.
Download the latest version and install

Install Hexo

These commands are for Mac users.

1
$ npm install hexo-cli -g

You can then check whether Hexo has been installed successfully.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
$ hexo -v
# My info
hexo: 3.4.4
hexo-cli: 1.0.4
os: Darwin 16.7.0 darwin x64
http_parser: 2.7.0
node: 8.9.0
v8: 6.1.534.46
uv: 1.15.0
zlib: 1.2.11
ares: 1.10.1-DEV
modules: 57
nghttp2: 1.25.0
openssl: 1.0.2l
icu: 59.1
unicode: 9.0
cldr: 31.0.1
tz: 2017b

Create your blog

1
2
3
4
5
6
$ cd ~/Documents/  # cd to your target folder
$ hexo init blog  # "blog" is the name of your blog folder
$ cd blog
$ npm install
$ hexo g # or "hexo generate"
$ hexo s # or "hexo server"

If everything goes well, you can now visit your blog on http://localhost:4000/.

More info: Hexo Docs

Setup your Git and Github

Normally we use Git and Github to implement version control. You should register your Github account firstly, and then Connect your local PC to GitHub with SSH.

Then you can check it by entering $ ssh -T git@github.com.
You’ll see the message “Hi ChongWng! You’ve successfully authenticated, but GitHub does not provide shell access.” if you have setup your SSH key correctly.

You also need to set your username and email.

1
2
$ git config --global user.name "chongwng" # your username 
$ git config --global user.email "wcssdy@gmail.com" # your email address

Deploy to your Github Pages

Site config

Create a new repository with the name of “your_username.github.io”.
Open “_config.yml” in the blog folder, which is the site root configuration file.
Edit deployment setting at the bottom of the file

1
2
3
4
5
6
# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
  type: git
  repo: git@github.com:ChongWng/chongwng.github.io.git # your username
  branch: master

Install Git plugin

1
$ npm install hexo-deployer-git --save

Run your blog

Enter these commands to clear files and start your blog

1
2
3
$ hexo clean # clean database and public files
$ hexo g
$ hexo d

Hooray! You can now enter your blog address in the browser and run it!

Common Hexo commands

1
2
$ hexo s --debug # enter debug mode to edit or config
$ hexo new post blog-title

More info: Hexo Commands

0%