利用github和hexo搭建个人博客
0x00. 引言
- 使用github pages服务搭建博客的好处有:
- 全是静态文件,访问速度快;
- 免费方便,不用花一分钱就可以搭建一个自由的个人博客,不需要服务器不需要后台;
- 可以随意绑定自己的域名,不仔细看的话根本看不出来你的网站是基于github的;
- 数据绝对安全,基于github的版本管理,想恢复到哪个历史版本都行;
- 博客内容可以轻松打包、转移、发布到其它平台;
0x01. 准备工作
- 有一个github账号,没有的话去注册一个;
- 安装了node.js,并了解相关基础知识;
- 安装了git for windows(或者其它git客户端)。
0x02. GitHub创建个人仓库
- 新建一个github仓库,命名规则为
你的用户名.github.io
(必须是你的用户名,其它名称无效),比如说,我的github用户名是wayxz,那么你就新建wayxz.github.io
的仓库,将来我的网站访问地址就是 https://wayxz.github.io 。
0x03. 安装Git
- 从git官网下载Git,下载安装后在命令行里输入git测试是否安装成功。
- 安装成功后,将你的Git与GitHub帐号绑定,鼠标右击打开Git Bash。
1 2
| git config --global user.name "你的GitHub用户名" git config --global user.email "你的GitHub注册邮箱"
|
- 生成ssh密钥文件。
1
| ssh-keygen -t rsa -C "你的GitHub注册邮箱"
|
- 然后直接三个回车即可,默认不需要设置密码,然后找到生成的.ssh的文件夹中的id_rsa.pub密钥,将内容全部复制。
- 打开GitHub_Settings_keys 页面,新建new SSH Key。
- 在Git Bash中检测GitHub公钥设置是否成功,输入 ssh git@github.com ,如果显示successfully等如下字样,即配置成功。
0x04. 安装Node.js
- 下载Node.js ,从官网下载长期支持版: 10.16.1 (包含 npm 6.9.0)的Node.js,并安装。
- 安装成功后输入node -v,显示安装的node版本。
0x05. 安装Hexo
Hexo就是我们的个人博客网站的框架, 在在电脑常里创建一个文件夹,可以命名为Blog,Hexo框架与以后你自己发布的网页都在这个文件夹中。创建好后,进入文件夹中,右击鼠标运行git bash here。
使用node.js自带的npm命令安装Hexo,输入:
1 2 3 4
| npm config set registry http://registry.npm.taobao.org //由于国外npm源网速过慢,建议更换为国内源 npm config list //查看换源是否成功
npm install -g hexo-cli
|
- 安装完成后,初始化我们的博客,输入:
1
| hexo init blog //新建一个名为blog的网站
|
- 为了检测博客是否搭建成功,分别按顺序输入以下三条命令:
1 2 3 4 5
| hexo new test_my_site //新建一篇文章 文章被生成在.\blog\source\_posts文件夹下
hexo generate //生成静态文件,该命令可以简写为hexo g
hexo server //启动服务器。默认情况下,访问网址为:http://localhost:4000/,该命令可以简写为hexo g 。
|
推荐主题模板,教程很详细可以按照上面的设置
0x06. 推送网站到github
将我们的Hexo与GitHub关联起来,打开站点的配置文件_config.yml,翻到最后修改为:
deploy:
type: git
repo: 这里填入你之前在GitHub上创建仓库的完整路径,记得加上 .git
branch: master参考如下:
保存站点配置文件,其实就是给hexo d 这个命令做相应的配置,让hexo知道你要把blog部署在哪个位置,很显然,我们部署在我们GitHub的仓库里。最后安装Git部署插件,输入命令:
1
| npm install hexo-deployer-git --save
|
- 这时,我们分别输入三条命令:
1 2 3
| hexo clean hexo g hexo d
|
hexo d 就是部署网站命令,d是deploy的缩写。完成后,打开浏览器,在地址栏输入你的放置个人网站的仓库路径,即 https://wayxz.github.io
常用hexo命令
常见命令
1 2 3 4 5 6 7
| hexo new "postName" #新建文章 hexo new page "pageName" #新建页面 hexo generate #生成静态页面至public目录 hexo server #开启预览访问端口(默认端口4000,'ctrl + c'关闭server) hexo deploy #部署到GitHub hexo help # 查看帮助 hexo version #查看Hexo的版本
|
缩写:
1 2 3 4
| hexo n == hexo new hexo g == hexo generate hexo s == hexo server hexo d == hexo deploy
|
组合命令:
1 2
| hexo s -g #生成并本地预览 hexo d -g #生成并上传
|
参考
- Git教程
- Node.js教程
- HEXO教程