数据科学与工程学院暑期夏令营实践项目 - 基于 GitHub 的博客网站
实验内容：
部署一个静态网页博客。静态网页博客是一种不需要后端服务器和数据库支持的网站，只需要使用 HTML、CSS 和 JavaScript 等前端技术就可以实现。静态网页博客有很多优点，比如速度快、安全稳定、易于维护等。
你需要选择一个自己感兴趣或擅长的主题来制作一个静态网页博客，比如个人介绍、爱好分享、技术总结等。你需要设计至少四个页面来展示博客内容，不限于首页、关于我、文章列表、文章详情等。
参考链接：(GitHub Pages + Hexo搭建个人博客网站
以下是本次实验的总结与反思：
博客主题及其选取原因
采用 Hexo 来创建博客网站，Hexo 是一个基于NodeJS的静态博客网站生成器。选择的主题为 Fluid 主题，该主题为网站或应用程序提供流畅、现代、响应式的体验，选择该主题基于以下的优点：
- 响应式设计：Fluid 主题能够适应不同尺寸的屏幕，包括桌面、平板电脑和移动设备，提供无缝的浏览体验
- 现代化：Fluid 主题的设计风格现代、时尚，使网站或应用程序看起来更加专业和高端
- 自适应：Fluid 主题具有自适应功能，可以根据用户的使用习惯和行为进行调整，提高用户体验
- 易于使用：Fluid 主题提供了一种直观的用户界面，使用户能够轻松浏览和使用网站或应用程序
- 可定制性：Fluid 主题提供了许多自定义选项，使用户可以根据自己的需求和喜好对网站或应用程序进行个性化定制
- 更好的性能：Fluid 主题采用了优化的代码和技术，可以提高网站或应用程序的性能和速度
博客页面布局及其设计思路
Hexo 框架是一个基于 Node.js 的静态网站生成器，其页面布局和设计思路可以分为以下几个部分：
- 主题布局
Hexo 主题通常由一个主题布局文件和多个页面布局文件组成。主题布局文件定义了网站的整体框架和样式，而页面布局文件则定义了不同类型页面的结构和样式
- 页面类型
Hexo 支持多种页面类型，包括文章、页面、归档、标签、分类、搜索等。每种页面类型都有对应的布局文件
- 模板语言
Hexo 使用的是 EJS (Embedded JavaScript) 模板语言，允许将 HTML 和 JavaScript 结合起来，方便页面的生成和渲染
- 层级结构
Hexo 的页面布局采用了层级结构，每个页面都可以继承主题布局和其他页面布局，并可以根据需要添加自己的内容和样式
- 模块化设计
Hexo 主题的页面布局采用了模块化设计，允许将页面分成多个模块，每个模块负责不同的功能或样式，可以方便地进行组合和重用
博客功能实现及其技术选择
Hexo 框架可以实现以下的功能：
- 文章列表和文章页面
Hexo 通过 Markdown 格式的文章文件来存储博客内容，可以方便地创建文章列表和文章页面。对于文章列表，可以使用主题提供的列表页面模板；对于文章页面，可以使用主题提供的文章页面模板或自定义模板
- 评论系统
Hexo 可以使用第三方评论系统来实现评论功能，如 Disqus、Gitment 等。这些评论系统提供了评论框架和数据库存储，可以方便地嵌入到 Hexo 网站中。需要注意的是，这些评论系统需要将评论框架嵌入到 Hexo 主题的相应位置中
- 分类和标签
Hexo 提供了分类和标签的功能，可以使用主题提供的分类和标签页面模板或自定义模板。在文章文件头部添加分类和标签的信息即可实现分类和标签的功能。
- 归档
Hexo 的归档功能可以通过插件实现，如 hexo-generator-archive 插件。这个插件会生成一个归档页面，其中包含了按照时间排序的所有文章列表
- 搜索
Hexo 的搜索功能可以通过插件实现，如 hexo-generator-search 插件。这个插件会生成一个搜索页面，其中包含了搜索框和搜索结果列表
博客样式设计及其美学考量
在进行博客样式设计时需考虑以下的几个方面：
- 颜色搭配
选择合适的颜色搭配可以让网站更具吸引力，同时也能增强网站的整体视觉效果。需要注意的是，颜色的选择需要与博客主题和内容相匹配，不宜过于突兀或炫目
- 字体和排版
选择合适的字体和排版可以让博客更加易读和美观。需要注意的是，字体的选择应该具有一定的可读性和易读性，排版要合理，使得文章内容更容易被读者阅读和理解
- 图片和配色
图片和配色在博客样式设计中也占有重要的地位。合理的配色可以让图片更加鲜明，图片也能使得博客更加生动和有趣
- 布局和空白
布局和空白是博客样式设计中最基础的元素，一个好的布局可以让博客内容更加突出，一个合理的空白可以让读者更加舒适地阅读文章