对程序员而言,最好的简历就是个人博客和GitHub
零、个人博客
每个优秀的程序员都会有个人独占的一方网络空间,那里是他个人的舞台,听说过他的人会逐渐汇聚进来,认识他,熟悉他,鼓励他,赞扬他。而对他个人而言,他有了一个可以畅所欲言的小房间,他可以专研学术,聊聊情怀。同时和喜爱他的读者成为好友,共同成长。
这难道不是一件很cool的事情吗?
一、先看成果
1. 个人域名:
2. 无需购置服务器,本站同时挂载在Github Pages 和 GitCafe Pages上,免服务器费的同时还能做负载均衡,想想还有点小激动
3. 在GitHub上同时管理你的博客和相应代码,再也不用担心博客遗失
4. SSL支持,即"http://" -> "https://",更安全也更高大上
二、再看兵器
- 博客框架:,这是一款能快速、简洁且高效的博客框架,支持,自动渲染出漂亮的静态页面。
- 前端主题:,效果参考
- 域名购买:类似万网的平台都可以,你可以选购自己名字的域名,一年几十元左右,两杯咖啡的钱。
- SSL:
三、抄起家伙
本文写作方式是安装流程主线
+ 优质参考文章
。由于网络上关于Hexo搭建博客的教程玲琅满目,若读者完全自己动手则要一篇篇找,浪费时间走弯路;相反,若作者悉数摘抄进来,反倒未必符合各人情况,且不利阅读。
所以,主线
讲解思路,参考
深入阅读。
1. GitHub Pages
在不购买服务器的前提下,我们的网站需要挂在GitHub Pages上。
- 你需要拥有一个,去完成新手任务吧。
- 进入,一步步做,完成后就能在浏览器打开了。
至此,我们已经利用GitHub Pages搭建好了个人博客雏形了。下面要做的,就是个性化了。
2. 安装Hexo博客框架
i. 安装Hexo
ii. GitHub管理
git clone
好了,此时会自动在myblog
目录下创建子文件夹wingjay.github.io
,那里就是我们博客的代码,以后的操作都在git的管理之下了,此时默认的branch为master
。
iii. 初始化Hexo
iv. 熟悉Hexo
Hexo目录结构-
_config.yml
是整体的配置文件,很多基础配置、插件配置等都需要在里面进行。要注意的是,该文件格式要求极为严格,缺少一个空格都会导致运行错误。小提示:不要用Tab缩进,用两个空格符。 -
layout
,包括draft(草稿)、page(页面)、post(文章)
。这个就是三种文件的基本格式,其中post
是你发表的文章,会显示在你的网站里,一篇post会包括title标题、date日期、tags标签
等信息;draft
是草稿,只有你在本地能看到,必须要publish
后才能成为post
,draft和post差别是date,因为draft没有发表,所以不需要指定日期。page
是一个页面,对应一个新的html页面,比如是一个页面,也是一个页面。 -
public文件夹
,这个文件夹是最终会发布到网站上的真实内容。怎么理解呢?我们可以把public
文件夹当作是真正的被用户看到的,而其他的source、themes
等都是为public
服务的。Hexo里有一个很重要的指令hexo generate
,这个指令就是利用所有代码里的配置信息、source里写的文章、themes里的样式,共同生成最终的静态html文件
,存入public
文件夹内。在我们执行了发布指令hexo deploy
后,就会把public
的内容部署到GitHub Pages
上。当用户在访问我们的博客时,他们会看到public里生成的html文件。这个概念非常重要,即代码和真实静态页面是独立的
。 -
generate和deploy
,generate
会把我们的配置、文章和主题结合起来生成一堆酷炫的html静态文件放在public里面。但此时用户还看不到本地public文件
里的页面,我们必须用后一个指令deploy
才能把静态文件部署到GitHub Pages
上。不过,在部署前,需要配置让它自动部署到我们前面创建的中。 -
deploy
相关配置。为了能够让项目自动把public文件夹的内容部署到中,我们可以按进行配置,其中选择的branch
为master
。此后,每次运行deploy后,项目就会自动把public文件夹内容全部覆盖到。 -
代码
和静态文件
分开管理。根据上面知道,每次部署后,public文件内容会覆盖
掉项目整个master分支。这样可以实现网站静态文件
的版本控制,但是,仔细对比这个master分支,我们会发现里面只剩下静态文件了,我们的代码比如source、themes统统没有了,这就导致无法对代码进行版本管理了。这意味着我换一台电脑,我就再也找不到代码
了,只剩下一堆之前编译出来的静态文件。所以,为了对代码也进行版本控制,我们创建一个,然后在这个分支里进行代码控制,master里则保存部署的新的静态文件。大家可以自行比对这两个branch的内容差异。
v. 配置Hexo
vi. 小结
但此时还是默认主题,不够美观,所以下一步要配置Next主题。
3. 配置主题Next
- 第三方评论系统。评论系统很重要,你可以与读者进行更多交流,配置也简单,建议采用,更国际化一点,。另外,前期建议开启
不登陆评论
,即在Disqus的Comment Rule
里允许Guest comment
。 - 创建留言板。熟悉
page
的创建与使用, - 给自己博客做
SEO
。有好的SEO便于搜索引擎索引你的网站,随着以后读者增多,他们可以更好搜索到你的网站。
4. 替换自己的域名
好了,经过上面的步骤,博客已经拥有了一个全新的主题啦。
i. 购买域名
速速前往万网或相关域名购买网站,按自己名字挑选一个闪闪发光的个人域名吧!
ii. 域名解析_1
域名解析然后万网会在世界各地的DNS服务器上添加这两条记录,当用户访问
时会自动去访问wingjay.github.io
。
iii. 域名解析_2
但是,此时并不能成功访问,因为Github Pages是有限制的,它不允许任意域名都跳转过来,而是只限制一个域名,而且这个域名必须声明在CNAME文件中
。
不过,对于Hexo 3
,这里有一个坑要注意:大家应该还记得上文说的,master分支里的内容都是自动生成的,而且会完全覆盖之前的内容。如果我们直接创建一个新文件CNAME,填好域名。但会发现在下一次部署后这个文件就消失了。不用惊讶,因为hexo并不会自动生成CNAME文件,所以在部署时被覆盖删除了。
5. HTTP -> HTTPS
四、总结
经过上面的步骤,我们已经能够通过访问自己的域名进入自己酷炫的博客了。本文的任务也就告一段落。
五、一天变cool系列文章
谢谢!
wingjay