Hello World - Hexo 建立个人独立博客

2017-09-08 :Next 主题更新后,Disqus 居然消失了,现在不能留言啦。

2017-09-27 :留言换做gitment

Hello, World

Wordpress,Blogger,Tumblr,……,统统不入法眼,程序员喜欢自己动手。

Hexo + Next + Github = 个人独立博客
以下内容是在 Mac OS 上完成,Windows 可以参考(建议使用 cygwin)。

domain

首先,你得要有台 Mac(至少得接触过 Linxu/Unix),然后得有个域名(domain),不知道啥是域名就不要在网上混了。但是起个好域名其实是所有工作中最难的,因为好名字都被狗注册了。起名字不是个技术活,主要靠自己异想天开吧。

注册域名的地方多如牛毛,国外出名的如NamecheapGoDaddy,关键是找个便宜的,看看有没有 promotion。

brew

接下来得”装”,『brew』是 Mac 上的安装程序,不知道啥是 brew 就不要用 Mac 了。先装brew,命令行一条就搞定,然后一通 brew install:

$ /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
  • 需要用到 Git,所谓的 source version control;
  • node.js,因为 Hexo 是用基于 Node & Javascript 开发的,Node 是个 Javascript Server Engine,是个 Javascript 神器,这些年 Javascript 已经上升为宇宙第一编程语言,以后心情好再多聊聊;
$ brew upgrade
$ brew update
$ brew install git
$ brew install node

Github

Github 既可做源代码版本控制也可用作免费的博客服务器,博客的文件统统存在 Github 上。不知道 Git/Github 是啥的程序员绝对是可以回家种地瓜,不懂的话自己找个搭车的时间补补课(网上 Git 资料是相当丰富的,当然知乎上也有个『小白教程』,我有机会会聊聊 Git。

Git 的全局配置,如果还没有配置的话:

$ git config --global user.name "fastzhong"
$ git config --global user.email "[email protected]"

Github 允许 http 或者 SSH 连接,SSH 可使用 key,这样不需要每次提交时输入用户名和密码,所以选择 SSH。配置 SSH 的 config 文件通过 Host 别名支持不同的 SSH 连接和 key,config 的配置格式参考这里

$ SSH-keygen -t rsa -b 4096 -C "[email protected]"
$ cd ~/.ssh
$ mv id_rsa id_rsa_fastzhong
$ mv id_rsa.pub id_rsa_fastzhong.pub
$ touch config
$ chmod 600 config
$ vim config
$ cat config
Host github-fastzhong
HostName github.com
User git
IdentityFile ~/.ssh/id_rsa_fastzhong
Host coding-fastzhong
Hostname git.coding.net
User git
IdentityFile ~/.ssh/id_rsa_fastzhong
$ SSH-add ~/.ssh/id_rsa_fastzhong
$ clip < ~/.ssh/id_rsa_fastzhong.pub

现在可以把公钥(id_rsa_fastzhong.pub)加到 Github 上,参考这里,然后测试一把:

$ ssh -T github-fastzhong
Hi fastzhong! You've successfully authenticated,but GitHub does not provide shell access.
$ ssh -T coding-fastzhong
Coding.net Tips : [Hello! You've connected to Coding.net via SSH. This is a deploy key.]

卧槽,居然成功了。Github 用来作为博客服务器必须符合它规定的条件,详见Github Page,需要做的是:

  • 在 Github 上 create 一个username.github.io 的 repository,例如fastzhong.github.io
  • 匹配自定义域名(fastzhong.com)的话,需要添加一个CNAME文件,把博客域名放进去,否则只能通过默认的username.github.io 来访问。
$ cat CNAME
fastzhong.com
  • 拿到username.github.io 的 ip:
$ ping fastzhong.github.io
Pinging sni.github.map.fastly.net [151.101.41.147] with 32 bytes of data:
Reply from 151.101.41.147: bytes=32 time=182ms TTL=53
  • DNS 服务器上设置一个 A Record,让@指向 IP 地址 151.101.41.147(有的 DNS 服务器不支持@的 CNAME Record,否则可以让@直接指向 fastzhong.github.io)
  • 如果有子域名,如 www.fastzhong.com,再设置一个 CNAME Record,让 www 指向 fastzhong.github.io

Hexo & Next

传统的博客系统如 WordPress,CSDN 博客,新浪博客等等,你只管写博客内容,其它一概交给系统。但是程序猿或者所谓的 hacker 感觉不爽,就像自己撸代码和只是运行程序玩的感觉是不同的,所以静态博客生成器就诞生了。对我而言,独立博客的最大好处是博客的内容是属于自己的,而不是”掌控“在博客系统里,说穿了就是有种可以玩弄于掌股之间的感觉。

静态博客生成器多如牛毛,各种比较在此:

我选择的是Hexo,主题选择Next

安装

我把博客放在 Google Drive 下的一个目录里(fastzhong.com),这样可以在不同的机器上编辑,也不怕硬盘坏掉:

$ cd ~/Google\ Drive/
$ mkdir fastzhong.com
$ cd fastzhong.com
$ npm install -g hexo
$ hexo init
$ npm install
$ cat package.json
$ npm install hexo-generator-cname --save
$ npm install hexo-generator-feed --save
$ npm install hexo-generator-search --save
$ npm install hexo-generator-searchdb --save
$ npm install hexo-generator-seo-friendly-sitemap --save
$ npm install hexo-generator-baidu-sitemap --save
$ npm install hexo-deployer-git --save
$ npm install hexo-wordcount --save
$ npm install aplayer --save
$ npm install dplayer --save
$ npm install hexo-tag-aplayer --save
$ npm install hexo-tag-dplayer --save
$ cat package.json
$ git clone https://github.com/iissnan/hexo-theme-next themes/next

装了几个 plugins(npm install xxx –save), 用途一目了然。

配置

HexoNext的文档以及配置里的注解都挺清晰的,跟着一步一步做就行了:

修改 Hexo 的_config.yml 并添加相应的文件:

  • local search:
search:
path: search.xml
field: post
  • deploy:
# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
- type: git
repo: [email protected]:fastzhong/fastzhong.github.io.git
branch: master
- type: git
repo: [email protected]:fastzhong/fastzhong.git
branch: master

注意 repo 的写法是 SSH 而非 https,而且 host 改成 github-fastzhong,和 SSH 的 config 对应(见上面)。

修改 Next 的_config.yml 并添加相应的文件:

  • favicon.ico
  • social
  • avatar
  • links
  • Duoshuo ShortName
  • jiathis
  • google_analytics
  • duoshuo_info
  • wechatpay

Markdown

Markdown 是一种极简的标识性语言,5 分钟就可以上手:怎样引导新手使用 Markdown?
Markdown 的编辑器也是一堆的,码字必备:18 款优秀的 Markdown 写作工具 | 2015 年度盘点
MarkdownPad,Typora 等等都不错,就是有 bug 不稳定,我目前就用 VS Code + Markdown。

使用

通常博客编辑流程是:

  1. 用 Markdown 编辑博客文章(source/_posts 目录下)
  2. 清理所有生成的博客 hexo c
  3. 重新生成博客 hexo g
  4. 在本地浏览 hexo s
  5. 部署到服务器上 hexo d

Create a new post

$ hexo new "My New Post"

More info: Writing

Clean & Generate static files

$ hexo clean && hexo g

More info: Generating

Run server

$ hexo s

本地可以浏览 http://localhost:4000 , more info: Server

Deploy to remote sites

$ hexo clean && hexo g && hexo d

更新至 Github,more info: Deployment

这个命令在 Windows 上似乎是有问题的,可以直接到.deploy_git/下 git push。

更多

搞到这,基本成了,有一些进一步的工作:

图片

图片或视频这类东西一般较大,占据磁盘文件读写和网页流量大部分比例,可以把它们从源代码里分离出来,托管在云存储(S3,Dropbox,等等),或放到专门图床上,通过他们加速加载,国内最出名的图床应该是七牛,( 可是注个册居然要手机号码,不知道手机号码属于个人隐私吗,国内就是个流氓环境,国人已经麻木了),目前我选用的是微博,弄个Chrome 插件。弄大点可以考虑自建图床和 CDN。

内容加速 CDN

除了图片可以通过缓存加速外,网页也是可以的,免费的有好几家,不过个人博客不大,目前暂时忽略。

sitemap

博客做好后,可以立马通知 Google 和百度的爬虫来爬一爬,Hexo 会自动生成 sitemap,在生成的博客文件夹(public)里。
Google sitemap 上传:https://support.google.com/webmasters/answer/183668?hl=en#addsitemap
百度 sitemap 上传:http://zhanzhang.baidu.com/abc/index

analytics

Google 和百度还提供网站流量分析报告,想要搞成专业博客的话可以研究一下。
Google Analytics: https://support.google.com/analytics/answer/1008015?hl=en
百度统计分析:http://tongji.baidu.com/web/welcome/login

翻墙

最后如果是海外的博客,放在 Gitlab 上,会被墙的或者不稳定,所以要同时考虑国内外的用户,同样可以在国内建立一个镜像。这个得分两个步骤:

  • 第一步找个国内 Github 的山寨版coding.net或者gitee.com
    这个做法和 Github 类似,先注册 coding,然后配置 SSH(见前面Github),创建 coding 项目,配置 hexo(部署部分增加一行,见上面)。然后使用 coding 的 pages 服务,设置『部署分支』和绑定『自定义域名』,参考帮助
    coding-pages

  • 第二步找个“智能”DNS,国内用户访问时,把他们导到国内 Github 的山寨版那去;国外用户则是正常访问。具体做法是用 DNSPad 这个神器。首先让 DNS Server 指向 DNSPod,由 DNSPod 来做域名解析,通常这个设置在域名注册服务商那里完成。然后就在 DNSPod 里设置同样的域名国内国外采用不同的服务器:
    DNSPod

参考:

  • coding.net 的pages服务
  • gitee.com 的pages服务,码云的 pages 服务似乎还未支持自定义域名

另外一个做法是使用 CDN,见下。

HTTS

Github 对独立域名不支持 HTTPS,得找个免费的 - CloudFlare,连带 CDN 都送了,只要 CloudFare 注册个帐号,按着上面的流程选择 Free Website 的 Plan,把 DNS Server 换一下指向 CloudFlare 就行。CloudFlare 在中国的 CDN 服务不知如何,目前这是我的选择。

撸到这里,差不多了,感谢生活在互联网的时代

0%