为什么要搭建私人博客?
- 阶段性总结、消化所学的知识,每天比昨天的自己进步一点点
- 与小伙伴交流技术,碰撞思维的火花
- 现成博客网站广告多,阅读体验不佳
- 可diy私人博客的一切
好,话不多说,直入主题!
本次采用的是Hexo+GitHub组合来搭建私人博客。Hexo是一个轻量、简易、高逼格的博客框架,主页在此:Hexo,Hexo是一个基于node.js制作的博客工具,不是一个开源的博客系统。而我们也不需要部署Hexo到我们的服务器上,Hexo用Markdown来解析文章,帮我们生成静态网页,然后将生成的html上传到我们的服务器。简言之:Hexo是一个静态页面生成、上传的工具。GitHub是一个面向开源及私有软件项目的代码托管平台,只支持 Git 作为唯一的版本库格式进行托管,同时也是全球最大的男性交友平台。
安装Node.js
Hexo是基于Node.js环境的静态博客,所以先安装Node.js。首先在官网根据自己的系统下载对应版本的安装包,由于本人是Mac系统,可以直接用brew命令:
brew install node
安装成功后,可以通过node -v查看版本信息,如果出现版本信息则证明安装成功,否则需要配置node相关的环境变量。
安装Node.js的同时会安装npm,npm是Node.js的包管理器,用于节点插件的管理(包括安装,卸载和管理依赖等)。通过npm -v来检查npm是否安装成功。
由于npm服务器在国外,经常会下载缓慢或出现异常,所以我们实际上用到更多的是cnpm,我们可以从这个服务器上稳定下载资源。通过以下命令来下载cnpm:
npm install -g cnpm --registry=http://registry.npm.taobao.org
完成后,同样用cnpm -v来验证cnpm是否安装成功。
安装并初始化Hexo
安装好Node.js,我们就可以安装Hexo了,正如官网显示,执行以下命令就可以安装Hexo了
cnpm install -g hexo-cli
安装完成后,通过hexo -v查看Hexo是否安装成功
接着我们可以在自己喜欢的位置建一个文件夹,如blog,里面用来存放于私人博客相关的所有内容。进入blog文件夹,接下来我们的主场就在blog文件夹里。
进入blog文件夹后,执行以下命令初始化hexo
sudo hexo init
输入密码,执行完成后,我们就完成了一个Hexo博客的初始化。此时查看blog文件夹,可以看到多了一些新的内容:
以后我们就通过这些文件来管理博客,这里简单介绍其中主要文件夹及文件的作用:
_config.yml:全局配置文件,配置网站的很多信息,如网站名称,副标题,描述,作者,语言,主题,部署等等参数。
package.json:配置hexo框架的参数和所依赖插件
scaffolds:英文是“骨架”的意思,里面存放模板文件,当新建一篇文章时,hexo是根据这个目录下的文件进行构建的。
source:新建的文章都是在保存在这个目录下的_posts ,即我们写作的地方。_posts 目录下的md文件,会被编译成html文件,放到 public文件夹下。
themes:网站主题目录,默认为landscape
node_modules:主要是用来存Hexo的一些功能性文件,比如渲染器以及各种插件
public:存储生成的静态文件,在hexo g命令后生成
现在我们可以使用以下命令启动本地服务器:
hexo s
访问 http://localhost:4000 就可以访问本地的Hexo博客啦
至此,一个简单的本地Hexo博客已经搭好,接下来,让我们写篇文章试试。
小试牛刀Hexo
通过以下命令可以创建新的md文件
hexo n "我的第一篇文章"
查看blog/source/_posts文件夹,可以看出多了一个md文件
用Markdown编辑器打开文件,进行写作,Markdown语法详见Markdown教程,熟练之后效率奇高。
写作完成之后,使用hexo clean命令清除冗余文件,hexo g生成新的public静态文件夹,重启本地服务器即可看到《我的第一篇文章》。
部署到GitHub
本地的Hexo博客已经搭好,但是想要其他人访问你,和他们碰撞出思维的火花,我们还得部署到远程的GitHub仓库中。
此处需要读者对git和github有一定的了解,推荐给大家一个教程:Git教程。
接着安装git,在github上建立仓库,仓库名为YourGithubName.github.io,此处注意一定要和自己的GitHub名字相同,比如我的就是RabbitGY.github.io。
建好仓库后,回到blog文件夹中,通过以下命令安装git部署插件
cnpm install --save hexo-deployer-git
接着我们需要对Hexo配置,使其对应到我们刚刚建立的git仓库,首先获取git仓库的地址
接着打开blog/_config.yml文件,对Deployment进行配置,配置内容如下
# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
type: git
repo: [email protected]:RabbitGY/RabbitGY.github.io.git
branch: master
至此,我们就将本地的Hexo与远程的GitHub联系起来,通过访问 https://YourGithubName.github.io 就可以访问到你的私人博客啦,是不是很棒!以后每次发布文章,都可以通过hexo clean + hexo g + hexo d 来进行远程部署了,实在是方便易懂。在此,再介绍一些Hexo常用的命令。
hexo init:用于初始化本地文件夹为网站的根目录
hexo new “文章标题” / hexo n “文章标题”:用于新建文章
hexo generate / hexo g:用于生成静态文件
hexo server / hexo s:用于启动本地服务器
hexo deploy / hero d:用于部署网站
hexo clean:用于清理缓存文件
选择主题
如果你跟着我到了这一步,会发现Hexo默认的主题landscape很不优雅,那么为了提升自己的逼格,我们可以更换主题,比较热门的主题有hexo-theme-next、hexo-theme-casper等等,本人选用了hexo-theme-ayer,一个安静又优雅的主题,相关的一些设置详情可以查看GitHub。
以上就是用Hexo+GitHub搭建私人博客的教程啦,喜欢的小伙伴可以关注收藏我的私人博客,这里有你想要的一切哦,兄弟,还等啥呢?