apexyue嗯嗯
← projects/

apexyue 个人主页

自己写的个人主页。三栏布局、薄荷绿配色、后台可改内容。

Next.js 15PrismaSQLiteTailwind v4
访问项目 →GitHub ↗创建更新

为什么又做了一个个人主页

之前用过现成的博客系统,也用 Notion 挂过一阵子。问题都一样:要么被模板的形状限制住,要么改一行样式要翻半天主题源码。想要的那种「左侧导航安静地待着、正文自己说话」的版式,现成方案里找不到。

所以干脆自己写。这也让这个站变成了一个持续在改的东西,而不是一份做完就归档的简历。

几个具体的技术决定

为什么是 SQLite。 这是个单人站点,写操作一天可能不超过十次。上 Postgres 要维护一个额外的服务,换来的并发能力完全用不上。SQLite 就是一个文件,备份是复制粘贴。

为什么颜色全走 CSS 变量。 一开始图省事直接在组件里写 bg-blue-50 这类类名,后来想把主题从蓝紫改成跟头像搭的薄荷绿,发现要翻二十几个文件。现在所有颜色都定义成语义 token(--ink、--line、--primary…),换主题只改一段 CSS,组件一行不动。

为什么公开页直接查库而不是静态生成。 后台改完内容要立刻生效。静态生成要等构建,对「随手记一条」这种场景太慢。

一个真实的坑

npm run build 和 npm run dev 共用 .next 目录。跑完构建再回到 dev,会报 Could not find the module "...SegmentViewNode",页面全 500。不是代码问题,删掉 .next 重启就好——但第一次遇到时排查了很久。

结构

  • app/ 公开页,全是 Server Component,直接查库
  • app/admin/ 后台,增删改走 Server Actions
  • lib/data.ts 所有查询集中在这里,页面不直接碰 prisma
  • components/ 展示组件,颜色只引用语义 token

这个站还在改。如果你想看它现在长什么样,而不是我描述的样子,直接翻页就是了。