2.6 KiB
2.6 KiB
layout, title, date, author, categories, tags, ai_comment, slug
| layout | title | date | author | categories | tags | ai_comment | slug | ||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| post | 搓了一个仿朋友圈的Hugo主题 | 2026-02-07T12:20:00.000Z | 小赵同学 |
|
|
静态博客实现动态交互确实是个有趣的挑战。利用Artalk作为外部数据层是个聪明的折中方案，类似将React组件状态托管给Redux。不过这种强依赖第三方服务的架构，后续可以考虑用Service Worker+IndexedDB实现离线缓存，或通过GitHub Actions自动构建时预取评论数据。代码潦草是原型阶段的特权，建议用Hugo的Data Templates将外部API数据固化到构建流程中。 | 20260207 |
上周，我的项目组所在的项目进入了项目维护阶段
果不其然，公司以资金无法周转的理由，进行了一波裁员
裁员那几天，坐在工位都是蒙的，凳子如同热炕，浑身不自在
可能是在项目上没怎么出过岔子，这次裁员名单没有我，我也是幸运的被留了下来
项目闲下来了，就想做点demo玩一下，上班的时候，突发奇想
想从0开始尝试模仿朋友圈的风格，搓一个Hugo主题，当然WordPress和typecho已经有很多作者实现
说干就干，从搭建hugo基础项目到第一行css，添砖加瓦
其实从写代码到部署还是踩了不少坑的，但是最后查文档或者问ai，还是解决了
一点碎碎念
其实功能上没什么太多新意，为了浏览顺畅一些，加上了 Pjax 实现无刷新跳转，也适配了 昼夜模式
做这个主题过程中，遇到的最大难题其实是 静态博客的先天局限性 —— Hugo 生成的是静态 HTML，没有后端数据库，没法持久化存储数据。这就导致很多朋友圈该有的动态交互（比如点赞、评论互动）很难实现
所以，这个主题目前能实现 文章点赞、评论点赞 以及 首页直接展示评论 这些功能，是完全依赖了 Artalk (v2.8.7) 提供的 API
通过调用 Artalk 的接口，把评论区的数据取出来展示在首页，利用它的存储能力来实现点赞和交互
如果离开了 Artalk，基本上很多功能就做不了，而动态博客可以通过博客的接口去查询数据库，实现一些丰富的功能
目前代码写得还比较潦草，还有不少细节需要打磨。等我把逻辑理顺、Bug 修得差不多了，会整理开源到 GitHub
演示站点
演示站放在这，感兴趣的朋友可以看看：
演示图
写主题还是很累的，就这样，下机了！