GitHub Pages 不只是用来作为 Hexo 博客，它本质上是一个 静态网站托管服务，上传的就是 HTML/CSS/JS 文件。基于这个特性，可以做很多事情。

1️⃣ 个人网站 / 简历 / 作品集

• 个人主页：展示自己、技能、项目经历。

• 在线简历：使用 Markdown + Jekyll 或其他静态网站生成器。

• 作品集：上传项目截图、Demo 链接、代码链接。

• Portfolio 网站模板：

  • Start Bootstrap
  • HTML5 UP

2️⃣ 文档 / 知识库

• 项目文档：GitHub Pages + MkDocs/Docsify/Hexo。
• 技术笔记 / Wiki：上传 Markdown，自动生成导航。
• 教程网站：开源教程、课程笔记，甚至能搭建像 readthedocs.io 一样的网站。

3️⃣ 静态应用 / 前端项目

• 纯前端网站：HTML + CSS + JS 写的小游戏、工具、实验页面。

• 单页应用（SPA）：

  • React / Vue / Svelte 等框架都可以，编译后直接 push 到 GitHub Pages。

• 前端 Demo 集合：

  • 交互动画、Canvas/Three.js 动画、WebGL 实验。

4️⃣ 学术或团队展示

• 研究项目网站：上传论文、实验数据、可视化图表。
• 团队主页：介绍团队成员、项目进展、贡献统计。

5️⃣ 小工具 / 交互式页面

• 在线 Markdown 编辑器。
• 代码片段展示器。
• 小游戏 / 小实验：比如 Tic-Tac-Toe, Snake, 2048 等纯前端游戏。
• 可视化数据展示：D3.js / Chart.js / ECharts。

6️⃣ 教程 / 教学

• 编程学习网站：自己写教程 + 示例代码 + Demo。
• 静态在线课程：Markdown 写课程、配合 Mermaid 做流程图、PlantUML 做 UML。
• 实验记录：实验数据、步骤、可视化图表。

7️⃣ 创意玩法

• 动态博客：虽然 GitHub Pages 是静态的，但可以通过 JavaScript 调用 GitHub API，实现文章搜索、评论等功能。
• 迷你社交功能：用 Issues / Discussions 做留言板。
• PWA 网站：做一个可离线访问的个人应用网站。

💡 总结：
GitHub Pages 只是一个静态文件托管，你上传的 HTML/CSS/JS 文件都能直接访问。所以它的用途几乎无限制，关键是你想做什么。Hexo、Jekyll、VuePress、Docusaurus 都只是生成器而已。

GitHub Pages 静态网站/应用的可做项目清单

一、个人展示类

1. 个人主页 / 简历网站

   • 展示个人信息、技能、联系方式。

   • 模板：

     • Start Bootstrap（多种单页模板）
     • HTML5 UP（简洁现代风格）
     • Personal Portfolio Jekyll

2. 作品集 / Project Showcase

   • 展示项目截图、Demo 链接、GitHub 代码。

   • 模板：

     • DevPortfolio
     • Creative Portfolio

3. 团队或实验室主页

   • 团队介绍、成员、研究成果、联系方式。

   • 示例：

     • Lab Website Jekyll

二、博客 / 技术笔记类

4. Hexo 博客（你正在做的）

   • Markdown 写文章，静态生成 HTML。
   • 支持主题、插件、评论系统。

5. Jekyll 博客

   • GitHub 官方推荐生成器，支持 Markdown、Liquid 模板。
   • 主题参考：Jekyll Themes

6. VuePress / VitePress 知识库

   • 适合文档、笔记网站。

   • 参考：

     • VuePress Docs
     • VitePress

7. Docsify / MkDocs 文档站

   • 轻量 Markdown 静态文档生成器。

   • 参考：

     • Docsify
     • MkDocs

三、前端交互 / SPA 类

8. 单页应用 (SPA)

   • React / Vue / Svelte 写的应用，编译后上传 GH Pages。

   • 示例：

     • React 官方模板：Create React App + GitHub Pages

9. 在线工具 / 小工具

   • Markdown 编辑器、计算器、Todo List、颜色选择器等。

   • 示例：

     • StackEdit
     • 自制可直接上传 HTML/JS/CSS。

10. 可视化数据展示 / Dashboard

    • 用 D3.js / Chart.js / ECharts 做图表或仪表盘。

    • 示例：

      • ECharts 示例
      • D3 Gallery

四、学术 / 教学类

11. 在线课程 / 教程网站

    • Markdown + Mermaid/PlantUML 做流程图、UML 图。

    • 示例：

      • Teaching Site Template

12. 实验记录 / Lab Notebook

    • Markdown 写实验步骤，配合代码块和图片。

    • 可参考：

      • Jupyter Notebook + nbviewer

13. 知识库 / Wiki

    • GitHub Pages + Docsify 或 MkDocs 构建。

    • 示例：

      • Docsify Wiki

五、创意 / 娱乐类

14. 小游戏

    • HTML5 Canvas、Three.js、WebGL 做小游戏。

    • 示例：

      • 2048
      • Snake

15. 互动实验 / 可视化实验

    • Physics、AI 可视化演示、数据模拟。

    • 示例：

      • p5.js Examples
      • Three.js Examples

16. 迷你社交 / 评论系统

    • 利用 GitHub Issues 或 Discussions 做留言板。

    • 示例：

      • Utterances（基于 Issues 评论）
      • Giscus（基于 Discussions）

17. PWA / 离线可访问网站

    • 将网站做成 Progressive Web App，可在手机上离线访问。

    • 示例：

      • PWA Template

18. Markdown 博客 + Mermaid 可视化

    • 用 Hexo/Jekyll + Mermaid 渲染流程图、序列图。

    • 示例：

      • Hexo Mermaid Plugin

19. 代码片段展示器 / 在线 IDE

    • 可展示代码高亮、运行演示。

    • 示例：

      • CodePen Embed
      • 自制 HTML/JS 前端小工具。

20. 静态资源托管 / CDN

    • 可直接上传 JS、CSS、图片、字体等，提供外部引用。

✅ 总结：
GitHub Pages 的核心价值就是“免费、静态网站托管”。你能做的几乎只受 前端能力 和 静态特性 限制：

• 纯展示 → 简历、作品集、博客
• 教学 / 知识管理 → 文档、实验记录、Wiki
• 交互 / 游戏 → SPA、可视化、小游戏
• 创意拓展 → 评论系统、PWA、工具网站