GitPages+Hexo搭建个人博客

96
WenBo丨星空灬
0.2 2018.01.21 19:28* 字数 550
image

前言

如果你想从零开始搭建一个属于自己的静态博客网站,可以参考下面三篇博文,这三篇博文是记录我从零开始搭建自己静态博客的全过程,希望能给需要的朋友一些参考:

最终成果: blogwenbo.com

一、GitHub创建项目

  • 1.1 使用GitPages搭建自己静态博客前提要注册申请GitHub账号。GitHub相关配置可参考这篇文章:MAC上Git安装与GitHub基本使用
  • 1.2 GitHub上新创建一个wenmobo.github.io仓库,wenmobo是我的账号名,这里替换成你自己的就可以了。项目格式名称为[用户名].github.io,如下:
username.github.io

创建成功之后如下:


屏幕快照 2018-01-14 下午11.52.25.png
  • 1.3 在桌面新建一个文件夹MyBlogcd到该文件夹,将项目克隆到本地:
git clone git@github.com:wenmobo/wenmobo.github.io.git

二、安装Node.js

  • 2.1 Node.js支持用HomeBrew安装,首先要安装Homebrew,Homebrew安装可查看这篇文章:MAC上Homebrew常用命令整理
  • 2.2 Homebrew安装好之后,用Homebrew安装Node.js,终端输入:
brew node

三、安装hexo

  • 3.1 安装hexo,终端输入:
npm install -g hexo-cli
  • 3.2 在本地仓库MyBlog新建文件夹Blog,然后在终端cd [Blog文件夹路径],执行以下命令初始化博客:
hexo init

//或者
hexo init <folder>
cd <folder>
npm instal

成功之后,目录文件如下:

.
├── _config.yml
├── package.json
├── scaffolds
├── source
|   ├── _drafts
|   └── _posts
└── themes
  • 3.3 查看本地效果,终端输入:
hexo s

终端输出:

WMBdeMacBook-Pro:Hexo WENBO$ hexo s
INFO  Start processing
INFO  Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.

http://localhost:4000/.拷贝到Chome浏览器,查看效果,如下图所示:

屏幕快照 2018-01-14 下午11.01.57.png

四、总结

GitHubPages+Hexo搭建静态博客的准备工作到这里都完成了,下面一篇文章:Hexo相关配置和使用会介绍Hexo相关配置。

五、参考文章

1、GithubPages教程 在GithubPages上搭建个人主页
2、在Github上使用Hexo搭建个人博客
3、如何使用hexo搭建个人博客(Mac OS系统,windows仅作参考)
4、Hexo博客主题推荐

博客小屋