Hexo+GitHub搭建个人博客并绑定个人域名

一、技术选型与前期准备

1.1 技术栈分析

Hexo作为基于Node.js的静态网站生成器，具有以下优势：

轻量高效：生成纯静态HTML文件，访问速度优于动态博客系统
Markdown支持：原生支持Markdown语法，适合技术文档编写
插件生态：拥有丰富的主题和插件（如hexo-generator-search、hexo-deployer-git）
部署便捷：支持一键部署到GitHub Pages、Vercel等平台

GitHub Pages提供免费静态网站托管服务，与Hexo形成完美组合：

免费SSL证书（HTTPS）
自动构建触发（需配合GitHub Actions）
全球CDN加速

1.2 环境配置要求

组件	版本要求	安装方式
Node.js	≥14.0.0	nvm或官方安装包
Git	≥2.28.0	官方安装包或系统包管理器
Hexo	≥6.0.0	`npm install -g hexo-cli`

二、Hexo博客搭建流程

2.1 初始化项目

# 创建项目目录
mkdir my-blog && cd my-blog
# 初始化Hexo
hexo init
npm install
# 验证安装
hexo server

访问http://localhost:4000应看到默认主题页面。

2.2 主题定制

推荐主题：

NexT：经典技术博客主题（git clone https://github.com/next-theme/hexo-theme-next themes/next）
Fluid：响应式设计（npm install hexo-theme-fluid --save）

配置步骤：

下载主题到themes/目录
修改_config.yml中的theme: next
调整主题配置文件（themes/next/_config.yml）

2.3 内容管理

文章创建：

hexo new post "技术文章标题"

生成的文件位于source/_posts/目录，采用YAML Front Matter格式：

---
title: 技术文章标题
date: 2023-11-15 14:30:00
tags: [Hexo, GitHub]
categories: 技术教程
---

标签与分类：

通过tags和categories字段组织内容
生成标签云：hexo new page "tags"并修改对应页面的Type为tags

三、GitHub Pages部署方案

3.1 仓库配置

创建GitHub仓库（命名格式：username.github.io）
启用Pages功能：Settings > Pages > 选择main分支和/(root)目录

3.2 部署方式对比

方案	命令	适用场景
手动部署	`hexo clean && hexo deploy`	简单项目，偶尔更新
GitHub Actions	配置`.github/workflows/deploy.yml`	需要自动化构建的复杂项目

自动化部署配置示例：

# .github/workflows/deploy.yml
name: Deploy Hexo
on: [push]
jobs:
  build:
    runs-on: ubuntu-latest
    steps:
    - uses: actions/checkout@v2
    - uses: actions/setup-node@v2
      with: { node-version: '16' }
    - run: npm install
    - run: npm install hexo-cli -g
    - run: hexo clean && hexo generate
    - uses: peaceiris/actions-gh-pages@v3
      with: { github_token: ${{ secrets.GITHUB_TOKEN }}, publish_dir: ./public }

四、域名绑定全流程

4.1 域名购买与解析

推荐域名注册商：

Cloudflare：免费DNS解析+CDN
阿里云：国内备案便捷
Namecheap：国际域名优惠

DNS解析配置：
| 记录类型 | 主机记录 | 记录值 | TTL |
|—————|—————|————————————————-|———|
| A | @ | 185.199.108.153（GitHub IP） | 300 |
| A | @ | 185.199.109.153 | 300 |
| A | @ | 185.199.110.153 | 300 |
| A | @ | 185.199.111.153 | 300 |
| CNAME | www | username.github.io | 300 |

4.2 GitHub仓库配置

在仓库Settings > Pages中添加自定义域名
勾选Enforce HTTPS强制HTTPS
创建CNAME文件（根目录下）：
```
yourdomain.com
```

4.3 验证与故障排查

验证步骤：

执行ping yourdomain.com应返回GitHub IP
访问https://yourdomain.com应显示博客内容
检查浏览器地址栏是否显示安全锁图标

常见问题处理：

DNS未生效：使用dig yourdomain.com检查解析记录
HTTPS证书错误：等待DNS传播（通常24小时内）
404错误：检查_config.yml中的url和root配置

五、进阶优化技巧

5.1 性能优化

启用Gzip压缩：在_config.yml中添加：
```
deploy:
type: git
repo: ...
compress: true
```
使用CDN加速静态资源：通过插件hexo-cdn配置

5.2 安全加固

启用GitHub Pages的GitHub Token保护
配置.htaccess防止目录遍历（需GitHub Pages支持）
定期更新Hexo和插件版本

5.3 数据分析

集成Google Analytics：

# _config.yml
google_analytics: UA-XXXXXX-X

使用Cloudfare Web Analytics（隐私友好方案）

六、维护与备份策略

6.1 版本控制

建议将以下文件纳入.gitignore：

db.json
node_modules/
public/
.deploy_git/

6.2 定期备份

使用GitHub的仓库备份功能
本地备份source/和themes/目录
数据库备份（如使用hexo-admin插件）

6.3 升级指南

备份当前项目
更新Hexo核心：npm update hexo
检查主题和插件兼容性
本地测试后再部署到生产环境

通过以上步骤，您将获得一个功能完整、性能优化的个人博客系统。该方案具有零成本、高可用、易维护的特点，特别适合技术写作、项目展示等场景。实际部署中，建议先在测试环境验证所有配置，再逐步迁移到生产环境。

零成本搭建个人博客：Hexo+GitHub全流程指南与域名绑定实践