这个网站
我用过 Notion,也试过现成的博客模板。想加一个自己的项目展示方式,排版就卡住了;几张高清图又能让手机页面变慢。后来我干脆自己搭了这个网站:项目页跟着代码和 Git 走,文章在 CMS 里写,部署到自己的服务器。它也是我每个新项目的落脚点。
2026 至今自托管个人主页与博客持续维护中Next.js
项目背景 / Problem
你正在看的 heyblaine.com:项目和主页文案跟着代码走,博客文章放在自托管的 Payload CMS 里,一起跑在自己的服务器上。
我的角色:AI Native:信息设计、架构取舍、实现组织与部署验证
为什么要自己搭
我很早就开始在各种平台上记东西。时间一长,问题越来越具体:想加一个自己的项目展示模块,平台的版式不允许;想改一个项目的状态,要在好几个地方分别改;现成模板塞满了用不上的脚本,几张图就能让手机页面变慢。
我想要一个从写字、管理到上线每一步都自己说了算的地方,于是和 AI 一起把它搭了出来。
代码管展示,CMS 管文章
这个网站经过几轮重构,现在是一个边界清楚的 Next.js + Payload 应用:
- 项目和主页文案跟着代码走: 项目页有很多定制排版和反复推敲的文字,放在前端内容模块里,每一次修改都留在 Git 历史中。
- 博客文章放在 Payload CMS: 文章可以直接在后台写,也可以在本地写好 Markdown 再导入;标签、系列和文章关联由数据库管理。
- 部署保持简单: 应用跑在 VPS 的 Docker 里,宿主机上的 Caddy 负责证书和反向代理。日常改文案只需要交付新的构建产物,不用重新打镜像。
东西多了,也要定期收拾
项目越做越多,网站也越来越杂。这次更新时,我把重复的项目列表、没人点的页面和过时的经历一起收拾了:项目按“产品、Agent Skills、更早的实践”三组排,经历合并到了关于页。少一点入口,找东西反而更快。
结果与范围 / Now
主页、项目和博客收进同一个 Next.js + Payload 应用,不再维护第二套站点
Markdown 导入时自动转换 WebP 图片,减轻手机端加载负担
用 Docker 运行应用、宿主机 Caddy 管证书,发布前先验证再交付构建产物
Next.jsPayload CMSReactTailwind CSSDockerCaddyGitHub Actions
