0%

Github + Hexo 搭建博客

最近突然想起自己之前还用 Github + Hexo 搭建过自己的博客,找到源码一看还是 2017 当时准备面试的时候写的几篇文章。​一转眼已经过去了四年,最近恰好有想要做的,也有想要分享的,那就重拾一下这个博客,趁着国庆放假,收拾收拾。背起行囊,继续出发。

种一棵树最好的时间是十年前,其次是现在。那就先简单记录一下自己 Github + Hexo 搭建属于自己的博客的过程吧!

在写之前还是先介绍一下两个主角:GitHub 和 Hexo

GitHub

GitHub 是通过 Git 进行版本控制的软件源代码托管服务平台,已经成为了世界上最大的代码存放网站和开源社区。里面其实有很多有意思的东西。这次主要用到的是GitHub Pages,GitHub Pages 是 GitHub 提供的一个网页托管服务,可以用于存放静态网页,包括博客、项目文档甚至整本书。一般GitHub Pages 的网站使用 github.io 的子域名,但是用户也可以使用第三方域名。

Hexo

Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。

接下来进入主题,搭建的主要步骤

步骤(Mac)

安装 HomeBrew

1
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

该步骤并不必须的,但是在Mac上安装了HomeBrew,安装一些package将会非常方便。

安装Git

1
brew install git

查看是否安装成功,正常会显示当前安装的git版本

1
git --version

GitHub创建个人仓库

  • 注册自己的Github账户
  • 创建自己的repo,命名规则为「用户名.github.io」
  • 设置user.name和user.email配置信息
    1
    2
    git config --global user.name "你的GitHub用户名"
    git config --global user.email "你的GitHub注册邮箱"
  • 生成ssh密钥文件,一直回车即可,不需要设置密码,然后找到生成的.ssh的文件夹中的id_rsa.pub密钥,将内容全部复制
    1
    ssh-keygen -t rsa -C "你的GitHub注册邮箱"
  • 打开Github,选择账户中的settings中的SSH and GPG keys 页面,点击New SSH key ,将刚刚生成的key内容复制进去,标题可以任意取
  • 检测是否已经配置成功,正常会显示「Hi monkeylzl! You’ve successfully authenticated, but GitHub does not provide shell access.
    Connection to github.com closed.」
    1
    ssh git@github.com 

安装Node.js

安装Node.js会包含环境变量及npm的安装

1
brew install node

检测是否安装成功

1
2
3
node -v

npm -v

安装Hexo

1
npm install -g hexo-cli

建站发布文章

  • 初始化,同时在该目录下创建了「blog」文件夹
    1
    hexo init blog
  • 进入到「blog」文件夹进行操作,可以进行预览,默认有一个「Hello World」的文档
    1
    hexo s
  • 修改根目录下的_config.yml文件,搜索「deploy」关联上面创建的git repo
    1
    2
    3
    4
    5
    6
    # Deployment
    ## Docs: https://hexo.io/docs/one-command-deployment
    deploy:
    type: git
    repo: git@github.com:monkeylzl/monkeylzl.github.io.git #添加自己的repo git 地址
    branch: master
  • 保存站点配置文件
    1
    npm install hexo-deployer-git --save
  • 创建文章并发布,发布完之后,打开 https://monkeylzl.github.io/ 自己的博客查看,注意发布可能需要一些时间,如果没有显示内容可以稍微等一会然后刷新下
    1
    2
    3
    4
    hexo clean 
    hexo new "Test"
    hexo g
    hexo d
  • 常用hexo命令
    1
    2
    3
    4
    hexo n "我的博客" == hexo new "我的博客" #新建文章
    hexo g == hexo generate #生成
    hexo s == hexo server #启动服务预览
    hexo d == hexo deploy #部署

计划

这篇文章初步讲解了搭建过程,后续会介绍 Hexo 的主题配置,打造自己喜欢的博客风格。

博客效果

可以复制链接然后打开 https://monkeylzl.github.io/

参考文献

[1] GitHub 维基百科:https://zh.wikipedia.org/wiki/GitHub

[2] Hexo 官网:https://hexo.io/zh-cn/

[3] HomeBrew 官网:https://brew.sh/

[4] Git 安装官网:https://git-scm.com/downloads

[5] GitHub 官网:https://github.com/

[6] Node.js 安装官网:http://nodejs.cn/learn/how-to-install-nodejs

------------- 本文结束 感谢您的阅读-------------

欢迎关注我的其它发布渠道