GitHub+Hexo builds personal blog

1.Introduction to hexo

I saw that my classmates used github+hexo to build their own blog. I was greedy. I have been doing it for a long time. review, you can also share and exchange technical issues with you.

Hexo is a fast, brief and efficient blog framework based on node.js, which can quickly generate static web pages from Markdown files and host them on github pages. – "From Judas' hexo blog"

2. Preparation before building

Required software

• git: http://git-scm.com/
• node.js：http://nodejs.org/

• Run Git-2.7.0.2-64-bit.exe, after the installation is complete, verify that the git installation is successful:

git --version

If the version number level of git appears, the installation is successful, that is

git version 2.7.0.windows.2

• Run node-v5.7.0-x64.msi, after the installation is complete, verify that node.js is installed successfully, execute in git bash:

npm -v

If the version number appears, it means success, such as:

1.4.3

3. Install hexo

• You can first create a folder and name it as you like. Here it is assumed to be named hexo.
  In the hexo directory, open git bash and execute:

npm install -g hexo  //安装hexo

• The installation is successful, continue to execute the command to initialize hexo:

hexo init            //hexo初始化

The network speed determines your waiting time, which may take a few minutes. After success, a related directory will be generated in the hexo directory.
- Now, we can start the hexo local service, command: Note (stepped pit):

hexo s


ERROR Local hexo not found in E:\GitHub\hexo

The reason for this error may be: carefully observe that the node_modules folder is missing in the hexo generation directory, so this folder has not been updated, you can continue to execute it in git bash: after reinstallation, continue to execute: hexo s.

npm install


It can now be accessed using a browser: http://localhost:4000/ .
- Press Ctrl+C in git bash to stop the hexo service.
Now, we have completed the construction of static blog.

### 4. Writing blog articles
You can use commands in git bash to create new files

hexo new "newBlog"    //新建文章

Then write the content of the article, but this is too troublesome, because the hexo blog supports the markdown syntax format, we can use the relevant editor to write the md document, and put it in the \source_posts folder in the hexo directory. This file There is already a hello-world.md file in the folder. Then we execute:

hexo g          //生成静态页面

Regenerate the static page, and then execute hexo s to start the service. At http://localhost:4000/
, you can access our blog where we wrote new articles.

5. Configure to GitHub

At this point, we can only access the blog by starting the local service by ourselves. Others cannot access our blog website. The following describes how to deploy hexo to github pages, so that anyone can access their blog articles.

• First, create a special repository on github with the repository name:

username.github.io _

Then find the _config.yml file in the hexo directory, open it and modify the following code at the end:

deploy:
  type: git
  repo: https://github.com/用户名/用户名.github.io.git
  branch: master

Finally, execute the command in git bash to submit to github:

hexo d

If nothing else, you can access your blog through http://username.github.io/ in the browser.

6. Theme modification

• Pick our favorite themes here https://github.com/hexojs/hexo/wiki/Themes .
• In the hexo directory, use git bash to execute the command:

git clone 主题地址

• After downloading the theme, also open the configuration file: _config.yml in the hexo directory, and change the corresponding theme directory name to:

theme: theme name

• After changing the theme directory name

We execute hexo g to regenerate the static page, and then hexo s starts the local service and revisits: http://localhost:4000/ to see the effect of the new theme.

• After confirmation, we execute

hexo d

Upload it to github, and finally access it through the username.github.io to view the final effect.

7. Hexo related commands

hexo new page"pageName"     新建页面
cls                         清屏
hexo clean                  清理项目
hexo g(generate)            生成静态页面至public目录
hexo s(server)              开启预览访问端口
hexo d(deploy)              将.deploy目录部署到GitHub
hexo help                   查看帮助
hexo version                查看Hexo的版本

8. Bind a domain name

Note: If there is no suitable domain name, I haven't done it for the time being, and I will do it again in the future.

9. More

Please look forward to the theme optimization of the blog website, plug-in application, blog article writing skills and related content. . .