使用Hexo + GitHub打造属于自己的博客(一)

介绍

跨过重重困难终于解决了自己的博客,从此也算是有了自己的地盘了,也算了了一个心愿。
本文记录了整个博客的搭建过程,以及自己遇到的问题。
特此附上本人博客一个Android小白的记事本有写的不对的地方欢迎指正。

  • 什么是Hexo?

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

  • 主要用到的文件备注

本文中的博客搭建的系统为Mac,Windows请酌情改动

文件名称 注释
_config.yml 整个博客的配置文件
public 博客展现出来的内容
source/_posts 创建的文章内容都在这个文件夹下
themes 博客主题模板存放的文件夹
themes/_config.yml 模板的配置文件
  • 建设博客的步骤

1.配置搭建博客所需的各种插件以及环境
2.安装Hexo以及Hexo的设置
3.将Hexo与GitHub Page关联
4.文章的发布
5.后续细节添加

  • 1、配置博客环境以及插件
安装Node、Git

不安装Git也可以使用SourceTree

  • 1.下载地址点击下载安装即可。

    使用Hexo + GitHub打造属于自己的博客(一)_第1张图片
    Node下载

  • 2.安装之后,想要查看是否安装成功只需要在终端目录下输入以下命令查看即可:

node -v
npm -v
使用Hexo + GitHub打造属于自己的博客(一)_第2张图片
检查版本
  • 3.这个时候就需要用到GitHub账号了

如果没有GitHub账号,可以去注册一个上方连接直通官网。
账号准备好之后,创建一个新的库只不过这个库跟以往的不太一样。

使用Hexo + GitHub打造属于自己的博客(一)_第3张图片
创建仓库

库创建好了之后需要设置主分支

使用Hexo + GitHub打造属于自己的博客(一)_第4张图片
设置

设置主分支

使用Hexo + GitHub打造属于自己的博客(一)_第5张图片
设置主分支

GitHub仓库创建好了之后就可以着手准备安装Hexo了。
首先创建一个新的文件夹:

mkdir 文件夹的名字

在刚创建的文件夹下安装Hexo以及install组件

npm install hexo-cli -g  // Hexo
npm install hexo --save  //install组件
// 查看版本
hexo -v

如果查询到版本信息就说明已经安装成功了
接着开始继续配置Hexo创建文件夹cd进入这个文件夹,安装npm

hexo init hexo // 创建文件夹
cd hexo  // 进入文件夹
npm install // 安装npm

开启本地服务

hexo s -g

此时终端会生成一个“http://localhost:4000/”这样的连接
点击就可以看到我们的博客雏形了。

至此前期准备完成

你可能感兴趣的:(使用Hexo + GitHub打造属于自己的博客(一))