博客头像

    Suim

    状态

    • 网站出生日期
      2026-06-26
    • 文章总数
      2
    • 评论数量
      0

    关于我 / About Me

    你好,我是 Suim 🚀


    👨‍🎓 关于我的一些线索

    • 🏫 2026-06-19当前状态:我是一名大二在读生,学的专业是软件工程全程专业全栈开发方向。
    • 🎯 兴趣爱好
      1. 💻 学习软件相关的知识和技能(后续有时间有能力还想去学习网络安全方面的东西)
      2. 🎮 玩游戏
      3. 踢球

    💡 开发博客的启发与部分实现思路

    📢 开发初心:当时也是大二下学期刚开学,靠着前面自学过的vue3去找了个后台管理项目去做,后续又学习了WebApi,就想着那我现在前后端都会了,我可以去写一个前后端项目来巩固一下,当时我就想到写个个人博客吧就着手去准备了…

    📐 1. 系统设计阶段

    因为网上有存在很多大佬们写的博客我就翻阅了大量的博客网站去参考去设计我的博客该怎么写,我先使用 draw.io 去画了对应的图,因为我当时想的是我后端使用 DDD(领域驱动设计) 的方式去开发后端么,我就先设计了领域模型和划分聚合聚合根

    🎨 2. 前端

    • 前端选型:我当时是先写的前端,因为前台项目涉及搜索引擎搜索嘛,我就问了AI用什么前端技术去开发前台SEO性能更好,就查到了 Astro 这个框架,我先跟着他的官网学习了一个很基础的博客教程很顺利,我从来没见过一个技术的文档写的非常通俗易懂,跟着这个文档一步一步来就基本不会出问题。
    • 样式布局:博客前台的布局和样式我有参考 fuwari 模板并设计,我认为他这个设计的非常简介好看,我这个前台项目使用了 tailwindcss,当时也没学过这个就去查了官网学习,有些看不懂就问ai了,后续写好了前台整体通用Layout布局后就开始写文章列表的渲染了。
    • 动静结合:因为我的前台项目属于 SSG构建 我需要全量获取文章数据并渲染成列表,AStro跟Vue不一样,Vue实现单页面效果比较简单,Astro要通过的他动态路由的方式在构建时获取全量数据并渲染成静态HTML,当时是去看了官网文档把示例复刻了一边看到效果就明白他这个动态路由怎么实现的,后续先用AI搞了很多假数据去模拟渲染文章列表和渲染文章详细页面还有Md源码渲染html等,做到这里已经花了半个多月了但是前台还没写完只写了文章列表渲染和文章详细渲染还有静态分页,我就打算先做后端了。

    🛡️ 3. 后端

    我开始是打算做的用户注册用户登录这一块的,因为我当时想的是我博客的评论功能是要登录状态下才能评论和访问,画了很多领域模型和思路的设计图。

    • 注册防护:我一开始打算是通过邮箱去注册但是我想了一下如果什么邮箱都可以注册的话,那很难维护,搞不好有人搞一些垃圾邮箱来注册(虽然我知道这个网站肯定没几个注册 但是我是站在一个学习的角度并不是我不需要就不弄,以后上班了说不定就用得着呢,而且都是安全方面的考虑)后面我就打算只能用qq邮箱注册了,毕竟qq邮箱注册也不是很轻松把。我在注册上防止有人恶意一直注册 使用了 CloudFlare Turnstile(无感人机校验)。
    • 高并发核心缓存设计:在后面我想到了更多安全上的问题,要是有人一直恶意快速调用我接口怎么办,那数据库不就一直查询,我就想到了去缓存,缓存这一块也做了好久:
      1. 🔒 防穿透:防止一直请求同一条数据而查询数据库我缓存了对应数据(防止穿透数据库)。
      2. 🕳️ 布隆过滤:我做了布隆过滤(防止请求全随机不重复穿透数据)。
      3. ❄️ 防雪崩:缓存值的生命周期范围随机(防止雪崩)。
      4. 🔨 防击穿:当这个数据缓存消失后如果有大量高并发请求这条数据造成击穿我做了排队上锁取数据操作(防止击穿)。

    💡:虽然我知道我这个小项目在前期根本就用不到这些严苛的防护措施和高并发应对手段。因为我从来没有把它仅仅当成一个本地玩玩的项目,而是自始至终把它当成一个真正要上线、要在生产环境去抗压、去和恶意攻击肉搏的商业项目来高标准要求自己。 只有真正走过一遍这些坑,以后在真的需要遇到类似的业务才能真正做到心中有思路。

    💬 4. 评论渲染与后台推进

    在做完登录和注册后,我用AI生成了大量模拟数据插入到我的数据库中,先做了文章列表的渲染、文章详细的渲染、评论的渲染。

    因为评论的渲染我采用的是 CSR客户端渲染 而不是静态构建渲染,我给评论也做了缓存,使用细致颗粒度缓存方法

    💡 先缓存评论分页对应评论id,再缓存每一条对应的评论。当评论有增删会影响分页结构的时候,只需要更新缓存的评论id即可。

    等这些可以通过查询渲染的东西做好了后,后面实现了评论的新增。后续去做了后台页面,后台页面涉及很多以前写过的后台页面逻辑所以这里不想浪费时间在码农上面,就大量使用ai开发提速。后端接口自己写,写好告诉ai接口和思路来开发前台页面。

    此处省略1万字…懒得说了(我得赶项目了) 🏃‍♂️💨

    开发这整个项目遇到很多问题也自然而然学到了很多很多很多思路和技术(非常高兴)也了解到更多的技术栈,受益匪浅!

    🛠️ 博客的技术栈

    项目模块核心技术栈古法编程与 AI 比例AI 具体协同方式
    前台页面Astro + Vue3 + Tailwind CSS古法 80% / AI 20%主要用于 Mock 数据的生成 和 评论组件的更好看的样式效果
    后端架构ASP.NET Core WebApi古法 90% / AI 10%生成一些古法意义不大的重复的代码 例如根据 EF Core 的模型配置 生成 FluentValidation 的校验类等…
    后台页面Vue3 + Vite古法 10% / AI 90%告诉 AI 后端的接口 和 实现思路效果,极致提效

    🤝 如果项目有发现 BUG 请你联系我,感谢!!!

    如果你在浏览、测试过程中发现了任何神奇的 Bug,欢迎随时狂轰滥炸我的联系方式:

    • 🐧 QQ2931873609 (👉 点击可直接前往我的空间
    • 💬 微信 / VXa2931873609a