/ Geek

听说正经程序猿都搞了自己的博客

git

随便聊聊

闲来无事，又逢天气正好，就在阳台上一边晒暖一边想着做点什么。

要不搭个博客吧，CSDN的markdown风格早就看不惯了，还丑的不行……说干就干。

为什么用hexo

实话实说，小白上手简单，简直是傻瓜式的，再加上主题多且美观，十分适合当下三分钟热度的自己（还真怕太麻烦了，捣鼓着就放弃了，o(╯□╰)o）。

原理很简单：你负责写文章，hexo负责批量处理文章内容、文章列表以及相关配置，然后把本地改动一股脑都推到自己仓库里，然后你访问时就可以看到全新的博客面容啦。

准备工作

  • 在github上新建个仓库：yourname.github.io，格式必须是：用户名.github.io，否则无法正常访问。

  • 安装git和node，不再敖述。

  • 配置ssh，本地写完博客以后，要推到github上。

  • 安装hexo：

    1
    npm install -g hexo

本地部署博客

找个舒服的地方，新建个文件夹放blog工程。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
hexo init

INFO  Cloning hexo-starter to ~/Work/test
Cloning into '/Users/gaok/Work/test'...
remote: Enumerating objects: 68, done.
remote: Total 68 (delta 0), reused 0 (delta 0), pack-reused 68
Unpacking objects: 100% (68/68), done.
Submodule 'themes/landscape' (https://github.com/hexojs/hexo-theme-landscape.git) registered for path 'themes/landscape'
Cloning into '/Users/gaok/Work/test/themes/landscape'...
remote: Enumerating objects: 1, done.
remote: Counting objects: 100% (1/1), done.
remote: Total 867 (delta 0), reused 0 (delta 0), pack-reused 866
Receiving objects: 100% (867/867), 2.55 MiB | 482.00 KiB/s, done.
Resolving deltas: 100% (459/459), done.
Submodule path 'themes/landscape': checked out '73a23c51f8487cfcd7c6deec96ccc7543960d350'

一个崭新的博客工程诞生啦~

新工程里默认有篇Hello World，我们本地部署看一哈。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
hexo g
# = hexo generate 下载必要的资源
INFO  Start processing
INFO  Files loaded in 190 ms
INFO  Generated: index.html
INFO  Generated: archives/index.html
INFO  Generated: fancybox/jquery.fancybox.css
INFO  Generated: fancybox/blank.gif
INFO  Generated: fancybox/jquery.fancybox.js
INFO  Generated: fancybox/jquery.fancybox.pack.js
INFO  Generated: fancybox/fancybox_loading.gif
INFO  Generated: fancybox/fancybox_loading@2x.gif
INFO  Generated: fancybox/fancybox_sprite.png
INFO  Generated: fancybox/fancybox_overlay.png
INFO  Generated: fancybox/fancybox_sprite@2x.png
INFO  Generated: archives/2019/01/index.html
INFO  Generated: archives/2019/index.html
INFO  Generated: css/fonts/FontAwesome.otf
INFO  Generated: js/script.js
INFO  Generated: fancybox/helpers/jquery.fancybox-buttons.js
INFO  Generated: fancybox/helpers/jquery.fancybox-thumbs.css
INFO  Generated: fancybox/helpers/jquery.fancybox-thumbs.js
INFO  Generated: fancybox/helpers/jquery.fancybox-buttons.css
INFO  Generated: css/style.css
INFO  Generated: fancybox/helpers/jquery.fancybox-media.js
INFO  Generated: css/fonts/fontawesome-webfont.eot
INFO  Generated: fancybox/helpers/fancybox_buttons.png
INFO  Generated: css/fonts/fontawesome-webfont.woff
INFO  Generated: css/fonts/fontawesome-webfont.ttf
INFO  Generated: css/images/banner.jpg
INFO  Generated: css/fonts/fontawesome-webfont.svg
INFO  Generated: 2019/01/27/hello-world/index.html
INFO  28 files generated in 481 ms

hexo s
# = hexo server
INFO  Start processing
INFO  Hexo is running at http://localhost:4000 . Press Ctrl+C to stop.

如果报错，且看是否是4000端口被占用了，换个端口即可。

现在我们访问http://localhost:4000/，就可以一睹博客真容了，当然现阶段还比较丑，毕竟还么设置主题嘛。

img

远端部署博客

接着我们就要开始把博客部署到远端了。

在blog目录下，打开_config.yml，按如下配置：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
#site
title: gaok的博客
subtitle: 测试副标题
description: 测试描述
keywords:
author: gaok
language: zh-CN
timezone: Asia/Shanghai

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

接着一键部署吧：

1
hexo g -d