我的博客系统 jscodes 上线啦!
为什么搭建博客系统?
起因是最近做了一些实用的在线工具,没有一个地方统一呈现,另外平时的开发过程以及思考也希望有个地方可以记录。如果只是写写文章,在第三方平台写写也就可以了,但是会有些约束,写的文章中还不能有营销内容,否则审核不通过,个人开发的工具更不让其挂链接,如此诸多限制不如自己开发一个网站,还能随意设计。
我想每个程序员都应该有一个属于自己的博客,虽然“博客”这个词似乎有些古老,不过我认为古不古老不重要,重要的是找到属于自己的空间去记录和输出,用第三方平台或者自己搭建都可以。
为什么不基于现有开源系统改造?
主要的考虑还是灵活性和可维护性,在开始之前最好先想清楚自己愿不愿意长期维护以及能力边界。
市面上博客系统最广泛的莫过于 Wordpress,稳定性不用多说、主题也够丰富,不过是php的,不适合自己,主要迭代功能麻烦。也有一些其他博客系统,要么有些丑不好改,要么是纯Markdown文件系统,功能太过单一。既然AI发展这么强,为何不自己搭建一个,也不会需要多长时间,功能还能随意加减。
博客系统有什么功能?
项目第一次git提交是在2025年10月10日晚上8点,到今天差不多12天时间,核心功能总算都差不多了。主要有以下能力:
核心功能
前台博客列表以及详情展示 前台作品集页(汇总展示曾经做过的成果也是初衷之一) 后台文章管理、发布设置 Markdown 格式写作并支持服务端预渲染 登录、注册、非站长用户隔离 封面图上传及管理 分类管理 评论管理 SEO相关配置 全站服务端渲染SSR(主要对SEO友好) 明暗模式支持 移动端支持 仪表盘及统计分析
当然还有些系统设置相关待实现,访问加速等还有些提升空间,好在可以专注写内容了~
主要管理界面


博客系统有什么规划?
初步想法是自己使用,如果开发成熟后也可考虑开源或有愿意付费用户做定制能力。如果有朋友有想法欢迎评论区留言。
博客系统建设历程?
个人项目的开发在流程上可以不用这么严格,用最顺手最快的方式达成效果即可。除了LOGO是单独AI设计的,其他界面都未经UI设计,也不是新类型产品,大体的功能都差不多。
第一步:确定产品核心功能以及AI生成PRD
核心功能无非就是能通过markdown格式写文章并支持管理,在前台界面渲染,同时对SEO友好。也是前面列的一些个人认为核心的功能。
对于PRD其实没有也可以,只是在交给AI开发的时候往往没有参考,会做成开放式的博客系统,如csdn、掘进社区类似的平台。如何让AI写好PRD这里推荐一下字节推的Trae IDE,主要是可以创建自定义智能体,自定义提示词。我是定义了几个角色,PRD就由 产品专家 智能体来完成(如何定义其实很简单,主要就是写好系统提示词以及授权可用的MCP工具,这里不多介绍,建议下载自己尝试)。

话说PRD是项目贯穿整个生命周期的重要文档,但是个人试了几个IDE内嵌的大模型写了三四版都不太行(DeepSeek-3.1-Terminus、GML4.5、Kimi-K2-0905),大部分都直列文档大纲和简单功能点,没有说明更多的细节(没有细节会导致在后续代码生成上需要更多的调试)。可能是IDE对模型做了特别限定。最终这个PRD只是在项目初始生成代码时用到,后面就再没用到,初始用到已经很关键了,将项目的前台和后台生成了基本雏形。
第二步:技术方案及框架代码实现
技术方案对我来说比较简单,因为之前有项目沉淀,所以就直接将项目复制过来,删除 .git 目录,修改一些变量名,剩下交给AI来改造(这样打包、部署、SEO配置等不用太过关心)。
虽然这部分代码量可能占项目的一半,但是开发时间也是最短的,我会告诉AI:这是一个模板项目,我希望实现什么样的站点,核心功能参考前面的PRD。另外我会准备项目提示词 prompt.md,说明项目中使用了什么技术栈、框架、组件、部署方案以及一些重要目录,剩下就交给AI,第一次项目改造是最耗费时间和Token的,Trae几乎一次执行了半个小时,再经过几个小时的调试几乎可以写博客并发布了。
第三步:细节调试
第一、第二步完成PRD以及框架代码用了一天,但是细节调试却用了10天左右。期间也有使用阿里的Qoder和腾讯的CodeBuddy来实现。
代码质量问题 + 抽象欠缺
AI提效是显而易见的,但是在细节调试上有时没这么放心AI,所以耗时较多,这可能目前AI仅作为辅助更合适的原因。尤其在抽象和复用上,一个页面如果功能较多,AI很少会主动抽象组件和复用已抽象的组件,导致单个页面文件较大(有的能超过1000行),在后续迭代时AI读取上下文会有些吃力。
一些功能不符合预期
大部分其实还是消耗在这些地方,如图片上传,在线上环境 cloudflare workers 中不能使用 https.request 导致需要重新实现接口;暗黑模式下页面中部分没有正常显示、较小屏幕时响应式不符合预期、接口未做缓存(个人项目服务端性能有限,适当的缓存是非常有必要的)、服务端渲染和客户端渲染水和问题等
Markdown 渲染
关于markdown渲染自己其实早有沉淀,只是在不同项目略有差异,还需要做写调整,阅读起来最好更舒适。
SEO 配置
对于博客站点的访问,搜索引擎起到很重要作用。核心是配置好页面的 title、description、keywords、og相关标签、canonical等,静态页面话直接可以写死即可,但是动态页面如博客详情,需要服务端预渲染然后读取动态数据。
以上这些只列举了部分,还有些细节 AI 的实现并不理想,需要不断的调试方可满意。
第四步:部署验证
这一步本来是很简单的,因为是模板项目改造的,但是最近看到腾讯推 EdgeOne,想尝试一下,但是踩坑真不少,本地开发热更新问题比较多(经常遇到缓存问题需要重启才可解决,非常麻烦),另一个较大的问题是数据库,EdgeOne 目前仅提供KV数据库,官方文档也有推荐 supabase,supabase确实好用,不过supabase 的两个免费名额被我用完了(将薅羊毛进行到底)。后来尝试使用KV数据库,普通增删改还是可以的,但是关联查询就有些无从下手。
本着薅羊毛的一贯宗旨,最后还是采取免费的 Cloudflare D1 作为数据库,Cloudflare Pages + Workers 作为部署运行环境。
整个项目主要花费是一年40多元的域名和这十来天的开发时间,其他都采用免费方案。最后我只想说:啊~真香!
The End.
版权声明
若无特别说明,本站内容均为本站作者原创发布,未经许可,禁止商业用途。
转载请注明出处:https://jscodes.cn/posts/2025_10_21_first_post

评论 (0)
暂无评论
成为第一个评论的人吧!