前言
很早就想搭建自己的个人博客,就像刘未鹏 | Mind Hacks、廖雪峰的官方网站等大牛那样,能够将个人的学习、经验展现出来,是多么好玩且有意义的一件事情。
正在学习前端中,是时候试试搭建个人博客了。找了一份如何搭建博客的视频,抱着花费一个月时间把博客建立出来的觉悟。幸好,开始前,问了问琚老师搭建博客复杂程度,好更精确地估算所用时间。
琚老师提到了Hexo。
然后用近1小时来查找相关资料,又1小时竟然就将博客成功搭建起来咧,中间浪费了不少时间,如果你能只字不差地按照本教程操作,30分钟甚至更短时间内就可以学会如何用Hexo搭建个人博客了。
此教程不需要有任何编程基础,跟着步骤,只要能做到只字不差的阅读和操作,就能够搭建起属于你自己的个人博客。
一、Why:确立目标
先不要着急行动,在着手操作前,先停下来思考清楚你为什么想要搭建个人博客。
这很重要,经过认真思考过的清晰可行的目标是你成功实现结果的基石。
二、What:Hexo是什么
Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。
利用Hexo + Github Pages能够迅速搭建颜值爆表的个人博客,关键还是免费的哟。
三、How:具体步骤
1.安装Hexo
Hexo是基于Nodejs的博客系统,在安装Hexo之前需要安装Nodejs;是把博客搭建在免费的GitHub上,所以需要安装Git。
⑴安装Nodejs
Node.js的官网下载地址是:https://nodejs.org/
下载好之后,双击安装,一路Next即可
⑵安装Git for windows
Git for windows 的下载地址是:https://git-for-windows.github.io/
下载好后也同样是一路Next安装即可。
⑶安装Hexo
① 搭建好以上环境,打开Git Bash,执行命令:
npm install hexo-cli -g
② 初始化
进入你的博客目录,我的在E:/myblog 。点击右键,选择Git Bash Here。
然后在其中运行以下命令hexo init
:
接着,输入 npm install
:
然后,运行hexo g
:
运行hexo s
:
已经在本地成功的搭建了博客系统,可以去浏览器输入地址localhost:4000
查看。
hexo init //初始化一个文件夹,它会为这个文件夹配置所有骨架
hexo g //即hexo generate,生成静态文件
hexo s //即hexo server,创建服务
hexo d //即hexo deploy,用于将本地文件发布到github上
hexo n //即hexo new,用于新建一篇文章
2.配置Git
目前为止,我们已成功在本地搭建了一个博客系统,现在将其部署到github上。
⑴ 在github上注册一个账号,创建一个新的仓库。
图5 图6Repository name和自己的用户名相同。比如我的用户名为liming104,那么仓库名为liming104.github.io
⑵配置SSH
上传文件需要配置ssh key,不然无法上传。
设置name和emai:
git config --global user.name "<your name>"
git config --global user.email "<your email>"```
### 生成ssh密钥
`ssh-keygen -t rsa -C "<your github's email>"`
这一步在~/.ssh/下生成了两个文件id_rsa 和 id_rsa.pub
### 在Github上添加SSH密钥
打开上述的id_rsa.pub 文件,复制其内容,在https://github.com/settings/keys下 add new ssh key,
⑶将本地文件部署到Github
进入你的博客文件夹,找到并打开_config.yml文件,在底部修改 (Deployment部分)输入下面的代码
Deployment
Docs: https://hexo.io/docs/deployment.html
deploy:
type: git
repository: https://github.com/liming104/liming104.github.io
branch: master```
注意冒号(:)后都有一个空格。
⑷部署
配置好后,hexo g
然后hexo d
有问题的话,通过npm install hexo-deployer-git --save
解决。
之前的步骤如果没什么问题,我们在浏览器中访问https://liming104.github.io/ ,已经能够看到我们个人的博客了。
试着写一篇文章,《30分钟学会用Hexo搭建个人博客》。
我们的新建博客创建在E:\myblog\source_posts\hexo搭建博客系统.md,md后缀是markdown的文件格式。
hexo g >>创建静态文档
hexo s >>本地预览
hexo d >>上传github
从此以后,充分利用你专属的个人博客,记录你的成长轨迹,愉快地玩耍吧!
网友评论