Hexo

现在越来越多的人悬着使用githubpage搭建自己的个人博客，但是github提供的默认的域名是这种形式：username.github.io，是个二级域名，这对于很多人来说可能感觉不是很酷。那么我们今天就来做一件比较酷的事情，为站点自定义一个域名。目录0、准备工作 1、域名申请 2、为站点添加CNAME 3、在DNSPOD配置域名解析 4、修改DNS 5、验证结果准备工作一个完整的github page博客项目。 名词解释： DNS：网域名称系统。你可以把它想象成一张域名和IP地址映射的数据表。 DNS解析：就是通过我们输入的网址（域名）查找到对应的主机（IP地址） CNAME重定向：username.github.io和username.tk是两个域名，添加CNAME文件选择首选域，使其指向同一主机。 DNS原理>>申请域名 有很多网站都有域名购买服务，我使用的是Freenom。常见的域名注册网站还有万网、腾讯云、GoDaady（狗爹）。 我选择Freenom的最主要原因就是：免费+顶级域名。对，你没有听错就是免费的顶级域名，一开始就认为注册域名肯定要花费不少moneyd的人是不是感觉赚到了😉。进入该网站注册成功之后，选择Register a New Domain进行域名申请检验。它可以提供免费的顶级域名有：tk，ml，ga，cf，gq选择你喜欢的域名，进入选购界面在Period里面可以选择使用时间，最多是一年的免费使用，顶级域名耶，已经很大的优惠了。当然如果你是土豪这都无所谓了。 为站点添加CNAME文件 在Hexo的本地站点里，进入source文件，新建文件CNAME，注意没有后缀，打开文件填入刚申请的域名zhangferry.tk保存。然后发布站点，这时CNAME文件就被发布到了github上对应的站点仓库中CNAME文件的作用： CNAME是一个别名记录，它允许你将多个名字映射到同一台计算机。比如刚才添加的CNAME文件，会被github自动识别，当我们输入zhangferry.github.io和输入zhangferry.tk时，它将指向同一个ip地址，展示同样的内容。 在DNSPOD中配置域名解析 注册DNSPOS账号，进入管理控制台点击添加域名，输入我们刚刚申请的域名。确定之后就是进行添加记录添加记录的每一项，系统都会提示代表意思，这里主要解释记录类型A记录：地址记录，用来指定域名的IP地址 CNAME记录：如果需要将域名指向另一个域名，再由另一个域名提供IP地址，就需要添加CNAME记录 NS记录：域名服务器记录，如果需要把子域名交给其他DNS服务商解析，就需要添加NS记录上面的NS记录是系统默认添加的。 A记录就是指向对应IP地址，这里的192.30.252.153和192.30.252.154是github的服务器IP地址。 CNAME记录这里可填可不填，因为A记录已经将zhangferry.tk和zhangferry.github.io的域名统一为一个IP地址了。有一种情况就是为了提高访问速度，要区分国内国外不同用户使用不同的网站进行重定向需要添加对应的CNAME记录。 修改域名DNS 再回到刚才的域名申请网站，点Services->My Domains->Manage Domain->Management Tools->Nameservers将f1g1ns1.dnspod.net和f1g1ns2.dnspod.net填入到Nameserver1和Nameserver中，点击Change Nameservers保存操作。注意到刚填的域名服务就是对应NS记录的记录值。完成之后稍等片刻，DNSPod会有如下提示，否则就按照提示进行检验哪一步出了问题。验证结果 之后需要等待全球递归DNS服务器刷新（最多72小时） 在命令行执行：$ dig zhangferry.tk，出现以下结果说明配置成功，主要IP地址的对应。参考 Hexo博客系列：域名和DNS 为你的Github Pages博客绑定一个免费顶级域名吧

作为一名技术人员没有属于自己的博客，就像是喜欢LOL的玩家却没有一款炫酷的皮肤一样，这不叫真爱。虽然现在是微博的时代，讲究方便阅读，易传播，但是对于博客来说，特别是技术博客，专业性永远都是第一位的。我们需要用大大的篇幅去阐述自己对技术的理解并将其分享给其他人，所以无论社交软件如何发展，我们都需要博客。下面就跟着我一块搭建属于自己的博客小屋吧。搭建环境 已经安装Git的Mac电脑，这个默认都能满足，所以就不详细介绍了。 创建github page 首先注册github账号，然后在repository选项卡里New一个新的仓库来存储我们的网站然后命名为username.github.io。安装Hexo 在安装Hexo之前我们需要安装nvm和Node.js。Hexo是目前很流行的博客管理框架，基于Node.js nvm是Node.js的版本管理工具 而Node.js是一个基于 Chrome V8 引擎的 JavaScript 运行环境。Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型，使其轻量又高效。不太理解和想要深入了解各软件作用的同学可以自行google，接下来我们开始安装这些东西（确实挺多的）。 1、通过curl方式安装node版本管理工具nvm curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.30.2/install.sh | bash其他方式的安装可以自行google。 2、配置环境变量 完成之后nvm就被安装在了~/.nvm下，接下来配置环境变量 在~/目录下看是否有.zshrc,.bash_profile,或者.profile,如果没有就新建一个.profile文件。 注意：.开头的文件是隐藏文件，在终端查看的时候使用命令ls -a,然后打开对应的配置文件在最后一行加上： export NVM_DIR="$HOME/.nvm" [ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh" # This loads nvm这一步的目的是每次新打开一个bash，nvm都会被自动添加到环境变量中。 3、验证nvm安装 在命令行输入nvm看到如下信息： Node Version ManagerNote: <version> refers to any version-like string nvm understands. This includes: - full or partial version numbers, starting with an optional "v" (0.10, v0.1.2, v1) - default (built-in) aliases: node, stable, unstable, iojs, system - custom aliases you define with `nvm alias foo`Usage: nvm help Show this message nvm --version Print out the latest released version of nvm nvm install [-s] <version> Download and install a <version>, [-s] from source. Uses .nvmrc if available --reinstall-packages-from=<version> When installing, reinstall packages installed in <node|iojs|node version number> nvm uninstall <version> Uninstall a version nvm use [--silent] <version> Modify PATH to use <version>. Uses .nvmrc if available nvm exec [--silent] <version> [<command>] Run <command> on <version>. Uses .nvmrc if available nvm run [--silent] <version> [<args>] Run `node` on <version> with <args> as arguments. Uses .nvmrc if available nvm current Display currently activated version nvm ls List installed versions nvm ls <version> List versions matching a given description (usually `~/.nvm`)那么恭喜你！nvm安装成功了。这一步在我看来是最容易出错的。 4、安装node.js 如果上面的步骤完成了，node.js的安装就简单多了，直接： nvm install node这个指令是安装最新版node 安装成功后可以使用nvm ls查看当前node版本号 5、安装Hexo 安装Hexo也比较简单 sudo npm install hexo-cli -g配置Hexo站点 完成所需组建的安装，接下来就要建立本地站点，配置站点了。 1、本地新建博客目录 目录可以自由选择，我选择在主目录下： ~$ mkdir username.github.io ~$ cd username.github.io ~$ hexo init username.github.io2、配置站点 在站点下有一个_config.yml，这里我们可以进行一些对博客的配置 language: en #语言设置 theme: next #主题设置，因为下面将使用next主题 deploy: type: git repo: https://github.com/username/username.github.io.git这里的repo就是我们新建仓库的git地址，之后发布的时候就会将内容发布到这个地址下。更多设置可以查看更多Hexo配置 3、配置主题我使用的是目前最受欢迎的一款Hexo主题Next使用它的话，我们需要先把它clone到本地 $ cd username.github.io $ git clone https://github.com/iissnan/hexo-theme-next themes/next在theme文件夹内也有一个_config.yml文件，这里是用来配置主题的，详细设置 新建、发布博客 经过上面的努力终于可以开心的写博客了，Hexo博客是基于Markdown格式编译的，所以，我们需要了解常用的Markdown语法，不了解Markdown的可以点这里参考Markdown，以下命令均在博客站点目录操作 1、新建 hexo new "my blog"文件生成在username/source/_posts/my-blog.md，打开文件，利用markdown语法将内容写到里面。 2、编译 hexo generate //可以简写为hexo g这一步的作用是将刚才的markdown语法的博客内容编译成html语言。编译之后生成public文件夹，里面放的是生成的html文件。之后同步到github上的就是这个文件夹的内容。 3、** 开启本地服务** hexo server //可以简写hexo s这个命令的作用是开启本地服务。之后会有下面两条语句生成 INFO Start processing INFO Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.我们就可以访问 http://localhos:4000/预览博客内容了。 4、部署 hexo deploy //可以简写为 hexo d部署的作用就是将博客内容发布到网络。执行完成之后我们就可以访问http://username.github.io了，当你能够看到自己写的内容呈现在自己眼前的时候有没有很激动呢。哈哈 5、清楚public内容 hexo clean 这个命令用在当我们更改source内部的资源路径之后，执行此命令可以重新编译生成public文件夹。好了，讲解到此结束，下一篇讲解如何发布博客到指定域名。这个是我的博客http://zhangferry.tk，欢迎访问