我用 Nuxt 4 完全重构了技术分享小屋 & 网站设计介绍

关于小屋
发布于 11/07/2025, 11:16 PM4 人读过

最开始,我只是想要给我的网站添加SSR功能,便于搜索引擎收录。但是在使用中,我发现Nuxt4也可以用于服务端的开发。并且,得益于前后端使用一套语言,我可以只定义一次数据格式,省去了前后端同步数据格式的麻烦,这也大大增强了网站前端的健壮性。


经过近一年陆陆续续的开发和修复,我终于可以自豪的从技术角度介绍我的个人网站。

技术栈

语言:TypeScript

框架:Nuxt 4

ORM框架:Prisma

数据库:PostgreSQL

部署:Nginx

运维:GitHub CI/CD + Docker

API设计

网站的API严格遵循Restful风格,主要分为以下几个资源。

  • Articles(文章)
  • Drafts(草稿)
  • Images(图片)

文章

文章必须从草稿发布。

POST /api/articles 根据传入的草稿ID,发布一篇新的文章,并删除原草稿。 GET /api/articles?offset=...&limit=...&categoryId=... 根据条件批量获取文章

草稿

草稿是还没有发布的文章,每篇文章可以有且最多仅有一篇与之关联的草稿。

POST /api/drafts:新增草稿(可以通过传入文章ID,复制文章的标题和内容等,生成一份与文章关联的草稿,供编辑文章使用)

DELETE /api/drafts:删除草稿

PATCH /api/drafts:更新草稿

GET /api/drafts?offset=...&limit=...&articleId=...:根据参数批量获取草稿,也可根据一篇文章的ID获取与之关联的草稿(这与批量获取互斥,但响应格式一致)

GET /api/drafts/[id]:获取指定ID的草稿


未完待续...