Hexo搭建GitHub博客(一)- 环境搭建

前言

之前无意中发现conglang的github博客,简洁干净,符合我的style。后来发现他使用HEXO+GitHub+Next主题搭建的。按耐不住就索性自己也来一个。同时也记录一下自己的实现过程,做个备案。

推荐理由:

  1. 免费:github提供gh-pages服务是免费的,有300MB空间;
  2. 开源:由于github开源的原因,有很多人参与其中,自然技术支持很好。
  3. 便捷:博客完全托管在github上,基本上不需要花时间去管理,博客使用Markdown语法,上手很容易。

需要了解的内容(能掌握更好):

  • html+css+javascript
  • git基本语法
  • markdown语法
  • nodejs

说明:
本次搭建的环境是:Ubuntu14.04

安装 Git

安装 Git 客户端

  1. 安装 Git 客户端 下载地址Git客户端安装
  2. 安装Git客户端:Windows用户直接Next就可以了。Mac和Linxu系统的用户可通过命令方式安装,这里不详细介绍了。
  3. 附上廖雪峰的Git经典入门教程: Git入门教程

注册 GitHub

老手和已注册过的用户略

  1. 打开GitHub官网:https://github.com/
  2. 填写注册信息进行注册操作:没有登录的用户打开网站首页就会显示注册的操作(如图所示),或者是点击Sign up按钮进入注册详情页。 GitHub注册
  3. 填写好注册信息,点击Sign up for GitHub(注册)按钮后,接下来是选择协议部分。根据自己的情况选择相关的协议,一般人选的都是免费的那一项。

创建仓库

  1. 登录github账号:在github首页点击Sign in按钮进入登录页面。填写用户名或邮箱和密码,点击Sign in按钮登录。 登录GitHub
  2. 点击创建仓库:点击在登录的用户图像左边的+号和下三角符号按钮。 点击创建仓库
  3. 填写创建仓库信息:
    仓库名称必须是用户名.github.io(别问我为什么,人家就是这样规定的),比如我的用户名是wgfxcu,就是wgfxcu.github.io。 填写创建仓库信息
  4. 填写好相关信息,点击Create repository(创建仓库)按钮。

配置 SSH

老手和已注册过的用户略

  1. 打开Git Bash终端:在桌面右键,会出现”Git Bash here”的选项,点击即可。
  2. 设置user name和email:

    $ git config --global user.name "你的GitHub用户名"          
    $ git config --global user.email "你的GitHub注册邮箱"         
    
  3. 生成ssh密钥:输入下面命令

    $ ssh-keygen -t rsa -C "你的GitHub注册邮箱"         
    

    一般情况下是不需要密码的,所以,接下来直接回车就好。
    此时,在用户文件夹下就会有一个新的文件夹.ssh,里面有刚刚创建的ssh密钥文件id_rsa和id_rsa.pub。
    注:id_rsa文件是私钥,要妥善保管,id_rsa.pub是公钥文件.

  4. 添加公钥到github:
    点击用户头像,然后点击显示的Settings(设置)选项;

    Settings

    在用户设置栏,点击SSH and GPG keys选项,然后点击New SSH key(新建SSH)按钮;

    SSH and GPG keys

    将id_rsa.pub中的内容复制到Key文本框中,然后点击Add SSH key(添加SSH)按钮;

    Add SSH keys
  5. 测试 SSH:

    $ ssh -T git@github.com    
    

    接下来会出来下面的确认信息:

    The authenticity of host 'github.com (207.97.227.239)' can't be established.    
    RSA key fingerprint is 17:24:ac:a5:76:28:24:36:62:1b:36:4d:eb:df:a6:45.      
    Are you sure you want to continue connecting (yeso)?
    

    输入yes后回车。
    然后显示如下信息则OK(其中的SeayXu是用户名)。

    Hi wgfxcu! You've successfully authenticated,
    but GitHub does not provide shell access.
    

搭建 Node.js 开发环境

本次没有使用ubuntu自带的nodejs版本,实在是版本太低。也没有使用源码进行安装,实在是太麻烦。根据Hexo官方文档使用nvm管理和安装Node.js。
nvm 的全称是 Node Version Manager,之所以需要这个工具,是因为 Node.js 的各种特性都没有稳定下来,所以我们经常由于老项目或尝新的原因,需要切换各种版本。

安装 nvm

cURL:

$ curl https://raw.github.com/creationix/nvm/master/install.sh | sh

Wget:

$ wget -qO- https://raw.github.com/creationix/nvm/master/install.sh | sh

脚本下载nvm仓库下载到 ~/.nvm , 同时在你的配置文件中添加源代码行 (~/.bash_profile, ~/.zshrc, ~/.profile, or ~/.bashrc)

export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh" # This loads nvm

如果你在shell命令行中输入nvm,得到的是 nvm: command not found。你需要在命令行中执行以下命令:

source ~/.bashrc

安装切换各版本 node/npm

nvm install stable #安装最新稳定版 node,现在是 v7.2.0
nvm install 6.0.0 #安装 6.0.0 版本
nvm install 0.12.7 #安装 0.12.7 版本

# 特别说明:以下模块安装仅供演示说明,并非必须安装模块
nvm use 0 #切换至 0.12.7 版本
nvm use 6 #切换至 6.0.0 版本
nvm alias default 7.2.0 #设置默认 node 版本为 7.2.0

这时候可以看到自己安装的所有 Node.js 版本,输出应如下:
查看node版本

使用 .nvmrc 文件配置项目所使用的 node 版本

如果你的默认 node 版本(通过 nvm alias 命令设置的)与项目所需的版本不同,则可在项目根目录或其任意父级目录中创建 .nvmrc 文件,在文件中指定使用的 node 版本号,例如:

cd <项目根目录>  #进入项目根目录
echo 7 > .nvmrc #添加 .nvmrc 文件
nvm use #无需指定版本号,会自动使用 .nvmrc 文件中配置的版本
node -v #查看 node 是否切换为对应版本

nvm 与 n 的区别

node 版本管理工具还有一个是 TJ 大神的 n 命令,n 命令是作为一个 node 的模块而存在,而 nvm 是一个独立于 node/npm 的外部 shell 脚本,因此 n 命令相比 nvm 更加局限。

由于 npm 安装的模块路径均为 /usr/local/lib/node_modules ,当使用 n 切换不同的 node 版本时,实际上会共用全局的 node/npm 目录。 因此不能很好的满足『按不同 node 版本使用不同全局 node 模块』的需求。

因此建议各位尽早开始使用 nvm ,以免出现全局模块无法更新的问题。关于 nvmn 详细区别可以参考淘宝前端团队(FED)博客。

###