本博客架构

发表于   |   分类于   |  

boke

初衷

　　20多岁的时候，应该着手思考如何建立自己的个人品牌了。这个个人品牌不依附于任何公司或机构存在，他是你个人独有的价值，任何人都抢不走。因此，我一直想构建一个自己的博客平台，用于积累自己的思考，展示自己的进步与个人价值。比起同龄人来说，开始记录博客，特别是技术博客，还是晚了一点。不过现在开始也还算是刚刚好。
　　

　　大约有一年多的筹划，最先接触这个是我的好朋友Tian Jun的博客，后来又接触了很多人的个人博客，于是开始有这个想法——搭建自己的博客平台并写技术博客。后来尝试利用科大给的空间和域名模仿别人做了一个静态网页的站点，根本写不了博客，当时也还什么都不懂，于是就搭建在哪里了。后来看见网上有简易搭建个人博客系统的，又去申请折腾了一番，在这里。这些都终于没有成功，每每浏览网站看见别人踏实的技术博客，心中总有一丝丝的羡慕嫉妒恨，哈哈。当然，这期间自己也陆陆续续的收集了一些优秀的个人博客站点。

激励

　　真正刺激我下决定一定要做自己的技术博客是在去年的暑假时候，当时是阿里巴巴的2015校园招聘，我当时只是研一，于是抱着试一试的态度投了安全工程师岗位的简历（Web方向）。后来居然一路顺利的通过了前面三轮，最终到了终面，地点是上海。当时有两个人，一个是HR，一个是技术。在一个多小时的面试时间里，我居然还自我感觉良好，现在看来，当时是有很多不足的。一种无知者无畏的勇气，哈哈。结果肯定是没过，不过面试结束时，技术的人给了我一个意见是：还需要更专注，有自己的技术博客，关注技术发展。这点我倒是印象深刻的记下来了。后来实验室师兄们陆续找到工作了，他们的意见也与此差不多：刷题与技术博客。

开始

　　等到我这学期终于开始找工作了，首先是着手准备自己的简历，无意间看到了一本书《程序员必读的职业生涯规划书》，里面提到在线简历，并且是用Markdown语言写的，我瞬间觉得牛逼到爆，于是花了一天时间做了自己在线版的简历，然后又很想把这个简历放在自己的博客上，于是开始搭建自己的博客系统。

过程

　　本博客最终是基于GitHub+Hexo+Next搭建的，博客搭建过程走了很多弯路，下面我直接给出整理后的博客系统内核。

准备阶段

  • 安装Node.js

　　hexo是一个很方便生成博文的工作，但它是基于Node.js的，因此要用hexo，必须先安装Node.js。

  • 安装Git for Windows

　　Git for Windows是一个客户端，是用来在本地电脑直接连接云端的GitHub账户用的，并且它的命令行操作非常的方便。

  • 安装hexo

　　采用命令行就可以安装了

1    npm install -g hexo

　　然后需要利用hexo初始化一下，会自动创建网站所需的所有文件

1    hexo init

　　以上所有准备工作都已经做好了

主题选择阶段

　　我采用的是GitHub上面Star最高的一套主题，确实相当的优秀。NexT使用文档有详细的介绍和安装方法。最花时间的是配置部分。配置部分有两个文件，并且名称一样，都是_config.yml。所不同的，一个是站点配置文件，一个是主题配置文件，它们所在文件夹不一样，在themes下的是主题配置文件，在外面的是全站的配置文件，不要搞混。

  • 站点文件配置

　　该文件配置的是全站的设置，当主题改变时，这些设置是不会变的。我的具体配置如下：

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
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
# 站点设置
title: 戚名钰的博客
subtitle: 专注信安，十年磨一剑
description: 做一名合格的安全工程师
author: 戚名钰
language: zh-Hans
email: mingyuqi.java@qq.com

# 头像设置
avatar: /images/avatar.png

# 多说评论设置
duoshuo_shortname: qimingyu

# 百度统计设置
baidu_analytics: 0c5bfe2b28edd6628f3b2177186e0772

# 站点主题设置
theme: next

# 上传github设置
deploy:
 	type: git
 	repository: https://github.com/qimingyu/qimingyu.github.io.git
 	branch: master
  
# 目录设置
source_dir: source
public_dir: public
tag_dir: tags
archive_dir: archives
category_dir: categories
code_dir: downloads/code
i18n_dir: :lang
skip_render:

# 写作设置
new_post_name: :title.md 
default_layout: post
titlecase: false 
external_link: true 
filename_case: 0
render_drafts: false
post_asset_folder: false
relative_link: false
future: true
highlight:
 	enable: true
 	line_number: true
 	auto_detect: false
 	tab_replace:

# 分类和标签设置
default_category: uncategorized
category_map:
tag_map:

#日期时间格式设置
date_format: YYYY-MM-DD
time_format: HH:mm:ss

#分页设置
per_page: 10
pagination_dir: page

#友情链接设置
links_title: 友情链接
links:
 	MacTalk: http://macshuo.com/
 	Tian Jun: http://www.tianjun.ml/

  • 主题文件配置

　　主题文件配置如下所示：

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
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
# 图标设置
favicon: /favicon.ico

# 主题设置
scheme: Pisces

# 设置主题关键词
keywords: "Hexo, NexT"

# 设置RRS链接，默认显示
rss:

# 设置建站日期
since: 2016

#菜单设置
menu:
 		home: /
 		categories: /categories
 		about: /about
 		archives: /archives
 		tags: /tags

#菜单图标设置
menu_icons:
 		enable: true
 		home: home
 		about: user
 		categories: th
 		tags: tags
 		archives: archive

# 社交链接设置
social:
 	  GitHub: https://github.com/qimingyu
 	  Facebook: https://www.facebook.com/profile.php?id=100005196408914
 	  Weibo: http://weibo.com/u/2608780242?refer_flag=1005050010_&is_all=1
 	  知乎: https://www.zhihu.com/people/qi-ming-yu-45
 	  豆瓣: https://www.douban.com/people/qimy/

# 社交图标设置
social_icons:
 		enable: true
 		GitHub: github
 		Twitter: twitter
 		Weibo: weibo

# TOC in the Sidebar
toc:
 		enable: true
 	# Automatically add list number to toc.
 		number: true

sidebar:
 		# Sidebar Position, available value: left | right
 		position: left
 		display: post

# Custom Logo.
# !!Only available for Default Scheme currently.
# Options:
#   enabled: [true/false] - Replace with specific image
#   image: url-of-image   - Images's url
custom_logo:
 		enabled: false
 		image:

#代码高亮设置
highlight_theme: normal

# Automatically scroll page to section which is under <!-- more --> mark.
scroll_to_more: true

# Automatically Excerpt
auto_excerpt:
 		enable: true
 		length: 150

# Use Lato font
use_font_lato: true

# 数学公式显示
mathjax: true

#分享设置
duoshuo_share: true
baidushare: true
jiathis: true

#多说热评文章设置
duoshuo_hotartical: true

# Motion
use_motion: true

# Fancybox
fancybox: true

# Static files
vendors: vendors
css: css
js: js
images: images

# Theme version
version: 0.5.0

完善修复阶段

在不蒜子那里增加了一个网站计数的代码，图片效果如下所示：
jishu

至此，整个博客系统呈现出现在的样子。其中所有站点文件为了实现同步，全部放在坚果云中。

总结

个人博客，形式神马都是浮云，关键还是要内容吸引人，要有料才行。今后继续加油吧！

更新

2017年4月24日更新

今天回过头来把博客的技术关系又理了一下。首先Github是一个开源项目托管的网站，它是一个分布式的代码管理系统，我们可以把自己本地的代码push到该平台上面去，这是它的主要功能。但是它为了方便用户，又提供了一项功能，就是可以展示自己的项目和个人博客，也就是说服务器由它来提供，然后我们的代码（仅限网站形式的静态页面代码）可以运行在它的服务器上，当然我们也可以自己买云服务器，但Github的静态页面托管是免费的，因此很多人就直接利用它来生成自己的个人博客页面了。

到目前为止，我们的个人博客还称不上一个独立的站点，只是Github二级下面的三级域名，例如：qimingyu.github.io,依然是依附于Github的，那么我们自己再到阿里云上面买一个域名，例如：qimingyu.com,将该域名的解析指向Github的IP，详细解析及配置参见这里,那么就可以通过自己的域名去访问博客了。

还有一点在本机上跟云端是用Git进行Push和Clone操作的，同时该文件夹是Git的仓库文件。

2017年4月28日更新

增加了hexo-admin,即网站的后台管理模块，可以直接操作发表文章，并且是MarkDown格式，很不错。打开后台管理页面的运行命令为

1
hexo server -p 5000

浏览器即可访问了：http://localhost:5000/admin

【版权声明】
本文首发于戚名钰的博客，欢迎转载，但是必须保留本文的署名戚名钰（包含链接）。如您有任何商业合作或者授权方面的协商，请给我留言：qimingyu.security@foxmail.com
欢迎关注我的微信公众号：科技锐新

kejiruixin

本文永久链接：http://qimingyu.github.io/2016/03/11/本博客架构/

坚持原创技术分享，您的支持将鼓励我继续创作！

热评文章