hexo First Use Guide

This is my first successful attempt at using Hexo to create a personal blog.
I’ve been wanting to do this for about a year now. Last year, during my internship
at Eleme, I had the idea of creating my own website, but I didn’t know how to
use templates or GitHub at the time, so I abandoned the idea.
Later, during my internship at Amazon, I tried again but still didn’t succeed.
After two days of effort this time, I finally completed the first version of the website.

In this blog, let me update the process of building my own blog.

---

Step1: Environment set up (Should I say it like this?)

I have installed npm, git, hexo and node.js .

Step2: Install Hexo

Create a new folder locally (this folder will contain the files related to this blog.)

Then use git bash to open the cmd window. Then use these commands to install and set up Hexo.

$ npm install hexo-cli -g
$ hexo -v   # check the version of hexo

$ hexo init  # After initializing this blog with the command, many files will appear inside this folder
$ npm install

$ hexo g  # generate the website locally
$ hexo server  # open the local server (in my understanding);  

then we can check the website via localhost:4000

step3: change the theme (optional)

the default theme looks not very fashion, so we can choose another one on the theme page of hexo website.
Theme/Hexo

I chose the theme “fluid”, after careful comparison and thorough planning (just kidding orz). I think this theme looks cute and simple.

You can choose whatever you like.

Remember, after choosing a theme, we need to clone this theme from github to a local folder – ./theme

All themes are stored there.

Use this command to clone the theme.

# example
$ git clone https://github.com/DrakeLeung/hexo-theme-again.git themes/again
# blablabla.git is the address of the theme, themes/*** means we want to clone to this local folder

Then we need to edit the config file: _config.yml, and update the theme

# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: fluid

Then, we clear the local cache and regenerate the website

$ hexo clean
$ hexo g
$ hexo server

up to now, we have generated a blog website.

Step4: Github repository creation

We need to create a GitHub account and create a new repository to host our Hexo website later.

tips: the name of this new repository should be the same with "your user name+.github.io". 

For example, my name is freya-popo, the name of repository should be freya-popo.github.io

In the process of creating a new repository, we can choose to add a readme file automatically. Also, we can choose the master branch.

set up deployment

$ git config --global user.name "*******"
$ git config --global user.email "*******"   # used in your github account

Also, we need to edit the hexo config file again. I think it is to confirm where to deploy this blog website.

In the _config.yml file, in the last part, we update this part like this.

deploy:
type: git
repo: git@github.com:yourname/yourname.github.io.git     # it can be copied from your github repository page
branch: master

Then, after deployment, this folder will be deployed to the master branch of your repository.

$ npm install hexo-deployer-git --save
# I am not entirely sure what this command does, but just input it and save something.

Step5: generate a SSH key

Before deploy the website, we still need to set up the SSH.

Go to the Github home page – setting – “SSH and GPG keys” – new SSH key

$ ssh-keygen -t rsa -C "******@***.com"
# the eamil user for your github account 

After pressing Enter three times consecutively, a path will be displayed.

The default path is C:\Users\username.ssh

find the file : id_rsa.pub and copy the content to the github “new SSH key” page.

Then the key will be created.

step6: deploy your blog website

AHA, the last step

$ hexo d

Congrats! Now you can see your own website via https://username.github.io