这篇博文我已经拖更半年了,半年前兴致勃勃地买了域名、搭起了个人博客,结果到现在网页上还是空空如也,马上就要2023年了,准备从现在开始,每天坚持做一件事,希望时间的积分效应能让我有所收益。
本博文将介绍如何从零开始一步一步搭建出属于自己的个人博客网站,使用的框架为Hexo+Fluid。在写作时主要参考了以下博文,在此对这些作者表示由衷的感谢:
(1) 彻底搞懂如何使用Hexo+GitHubPages搭建个人微博
(2) GitHub+Hexo 搭建个人网站详细教程
本文会持续更新,最近一次更新时间:2022年12月17日
1. 配置GitHubPages
简单来说,GitHubPages的作用是提供免费的静态网站托管服务,我们只需要把自己写的html文档保存在其仓库中,该服务就会对这些文件进行处理并展示为网页的样式,即近似实现了Web服务器的功能,创建GitHubPages需要在GitHub上完成(注册GitHub账号以及配置SSH公钥可见这篇博文),具体步骤为:
(1) 点击GitHub首页右上角的“+”按钮,在弹出窗口选择“New respository”;
(2) 在新页面中的“Repository name”一栏输入你GitHub的用户名。注意:必须输入用户名,否则创建的将不是GitHubPages而是一个普通的仓库;
(3) 勾选“Initialize this repository with a README”选项,并点击“Create Respository”按钮。
此时在浏览器输入https://你GitHub的用户名.github.io后,已经可以看到一个简陋的界面,这就说明你已经成功开启GithubPages服务了。
2. 安装Hexo并初始化博客
Hexo是一个快速且简洁的博客框架,用户可以通过Hexo快速生成一个完整的博客页面。Hexo使用Node.js来对页面进行快速渲染,因此需要同时安装Node.js和Hexo:
2.1 安装Node.js
可在官网直接安装Node.js,建议使用Node.js 10.0及以上版本。可以在cmd中输入以下命令检查自己是否安装成功:
node --version
2.2 安装Hexo
npm是随Node.js一起安装的包管理器,可以使用npm直接安装Hexo:
npm install -g hexo-cli
2.3 初始化博客
在你喜欢的位置上新建一个文件夹,命名为《你GitHub的用户名.github.io》,该文件夹以后统称为站点根目录。进入到该目录的上级目录打开cmd,输入以下命令:
hexo init <folder> # 使用Hexo初始化站点根目录,即你新建的文件夹名
cd <folder> # 打开该文件
npm install # 安装npm所依赖的库
完成上述命令后,Hexo就会自动在站点根目录中生成一系列用于生成博客的文件,你只需要输入以下命令(需要在cmd中进入站点根目录),就可以在本地浏览博客:
hexo g # 生成博客,等同于 hexo generate
hexo s # 本地预览,等同于 hexo server
在浏览器中输入http://localhost:4000,就可以在本地看到一个原始的博客页面。此时,站点根目录的目录结构如下:
|-- _config.yml
|-- node_modules
|-- package-lock.json
|-- package.json
|-- scaffolds
|-- source
|-- themes

最低0.47元/天 解锁文章
371

被折叠的 条评论
为什么被折叠?



