前言
之前我的博客没有绑自己的域名,一直在github上放着,访问起来比较麻烦,前阵子在阿里云买了这个域名,配置上之后,就可以通过自己的域名访问了,有些朋友问我这个博客怎么搭的,用的什么主题,所以准备写一写博客的搭建过程,以及主题的配置,最后再说说域名的配置,这些内容一篇文章写起来有些费时间,打算分成三篇来写,跟着文章来走一遍过场,动手尝试搭建一个属于自己的Blog吧!
万丈高楼平地起,对于搭建Blog来说,环境的部署就是这高楼的基石,下面我们来看看怎么部署环境。
步骤总览
Git环境
- 如果您还没有注册GitHub,先到这里 GitHub注册教程 看我之前的文章
- 安装Git 点我下载 选择适合自己计算机环境的版本下载,我这里是Windows环境,下载后,根据提示点next一步步安装即可。关于Git的更多使用技巧,推荐看廖雪峰老师的Git教程 点我学习
Node环境
- 安装Node.js 点我下载 同样选择适合自己计算机系统的版本下载安装即可。更多Node.js教程 点我学习
- 安装完毕后,测试是否安装成功,打开命令终端,我这里是Windows,win+r输入cmd进入终端,键入命令
node -v
或者直接输入node
回车即可,如果出现下图显示则说明node环境安装成功: - node中集成了npm包安装工具,输入命令
npm -v
查看版本号,如图:
Hexo环境
Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。点我了解更多
- 安装hexo-cli:进入终端,键入命令
cnpm i hexo-cli -g
[其中 ‘cnpm’ 代替 npm,安装速度更快; ‘i’ 表示install, ‘-g’表示全局安装 (注意:如果安装失败,建议在管理者模式下安装)] - 初始化:在本地合适的位置创建一个文件夹用作Blog环境,比如,我这里在D盘根目录下创建了一个myblog文件夹,进入此目录,按住
shift
键同时点击鼠标右键打开Powershell终端,键入命令hexo init
进行初始化,进度可能很慢[蹲个厕所回来大概就OK了],耐心等待安装即可。出现下图表示安装成功完毕后发现空目录多出很多文件,如下图:这里的node_modules是项目依赖,在初始化的时候已经下载下来了,不用再hexo i
了(有的教程写的hexo i 就是安装依赖的作用)。
测试本地运行
上述环境完成后,我们就可以在本地预览blog了。很简单,两行命令。
- 键入命令
hexo generate
生成静态文件,可以简写为hexo g
-
键入命令
hexo server
在本地运行, 可以简写为hexo s
出现下图则表示成功 -
打开浏览器,地址栏键入
http://localhost:4000
即可进行预览,效果如下
总结
经过以上操作,我们已经在本地搭建好了blog项目,并且在浏览器上预览成功,下一篇将接着写怎么把本地blog部署到github上,再换一个好看主题。