有关驱动式学习的感悟
驱动式学习，世界上最好的学习方式，不是为了解决学习而学习， 而是为了解决实际的问题。 第一次听到这个词语 我第一次听到这个词语，是我大一下的时候。那天有一个即将毕业的大四学长的讲座分享会，我在观众的名单中，看见了一个我在意的人的名字，于是也报名了这个讲座当观众的活动。算是赚大，学到了很多，也是在学长的分享会上我第一次听到了这个词语--驱动式学习。 学长很优秀，有过大厂的实习经验，即将毕业，手里已经收到了多份大厂的offer，小红书，快手，字节等。他说了他了大学四年的经历，很丰富，也很精彩。他说推荐我们一种学习方式：驱动式学习。听到这个词，那时我立刻就有了一种陌生又熟悉的感觉，随后...
以 STEP 为框架理解 Plate 的测试实践：从全面检查到持续回归保护
摘要： 无Ai，纯手搓
我们软件测试课程有课程分组任务，我选择了STEP模型，刚好最近Plate在重构中也在经历测试阶段了，借此机会我希望用STEP为框架去理解Plate的测试实践。本文只是自己的思考，肯定不100%正确，但是足够了 何为STEP模型 STEP模型是软件测试中的一种测试模型，具体我感觉我也说不清楚，可能问Ai，才能知道最标准化的答案，我只能去回答一些自己对于这个事物的认知。 STEP模型思想，把测试融入进来的了开发的过程中，让开发和测试紧密结合（？？TDD测试驱动开发？？）。分为三个阶段 Planning--测试规划 ...
Plate V1 和 V2对比
摘要： 人工写，无Ai
最近在Plate实习，老板让我先充分学习之后再去做功能，所以就有了这篇文章，搞清楚两个版本的对比，才能知道我现在正在做的事情到底是什么事情（个人理解，会有差错） Slate 和 Plite [!TIP] V1 V2 不是指Plate包的版本，而是因为重构了底层编辑器引擎，所以我称之为V1 V2版本，但是我刚刚参与进来，很多底层我还不了解，内容请勿计较 Slate是Plate v1 一开始使用的Rich-text editor 的框架和编辑引擎，但是Slate只做了很基础的底层的事情，并没有直接实现好富文本编辑器，富文本编辑器更多的功能，Plate选择使用一种插件体系去...
从展示页到网站入口：首屏页（Shouping）的架构演进与开门动画转场实践
摘要： Gemini摘要：本文系统梳理了 Sin的UIAnimation小项目，首屏从展示页向全站门户演进的技术全貌。文章深入剖析了如何依靠 1:1 响应式 6 栅格与 Nuxt UI 原生 Carousel 构建自适应手势看板，并重点解密了一套无需 clip-path 损耗性能的高清全屏“开门”动画转场方案：利用盒模型实现 GPU 级视口裁剪，击穿 Web Component Shadow DOM 无法被深克隆的时钟黑洞，并结合 MutationObserver 页面卸载感知与 requestAnimationFrame 帧同步，彻底根除路由过渡中的白屏与频闪顽疾。
很早就想试试网格布局了，刚好看见了imsyy多年前的项目布局，很喜欢，拿来改成了更加符合现代的技术栈的页面重新审视入口：从独立展示页到门户 最初，shouping 只是一个挂在 /shouping 路由下的独立实验页面，网站原有的内容流主页依然在 /。它的诉求清晰而纯粹：访客进入网站时，首先感知站点的调性与主人的气质，随后再决定是探索主站，还是直达特定工具。 随着视觉打磨与交互逻辑的逐渐成熟，它的角色发生了质的转变——它不再只是一个“附属展示页”，而应当是整个站点的“正门”。我们逐步将完整的站内生态、动态数据看板与沉浸式转场融入其中，最终将它与原首页平滑对调，确立为网站的正...
基于 View Transitions 的主题切换水波动画圆心偏移排查与重构
摘要： 今天下午，开发者 sin 在编写 UI 动画时发现此前实现的主题切换水波扩散按钮出现了严重的圆心偏移。本文由 Google 打造的大型语言模型 Gemini 3.8 Flash 以 AI 结对助手的视角，完整记录我与 sin 从常规排查陷入误区、到 sin 引入关键反例证伪假设、共同深挖 Chromium 视口快照图层与高分屏 DPR 坐标错位机理，最终重构为高稳定性 CSS 变量纯扩散方案的全过程。
一、问题起因：一次 UI 开发中的严重坐标偏移 今天下午，开发者 sin 在调试其前端 UI 动画合集项目时，测试了之前编写的一个深浅色主题切换按钮。该按钮基于现代浏览器原生的 View Transitions API 打造，预期效果是以鼠标点击位置为圆心，通过 clip-path 裁切出一个正圆水波，丝滑地向全屏扩散展开。 然而在交互实测中，sin 发现了一个无法忽视的视觉瑕疵：水波扩散的圆心并没有对准鼠标的点击位置，而是发生了肉眼可见的大幅空间偏位。 sin 最初编写这个按钮时，参考了开源社区的流行做法（包括 Nuxt 官方示例库中广泛流传的实...
React学习心得分享: React 对比 Vue
摘要： 小满的课程，上班时候学的，上班的时候不能看视频，全是看文档学习的，Gemini3.7执笔，我修改少部分细节
前言：一直以来，Vue 都是我的主力前端框架。从模板语法、响应式数据到组合式 API，Vue 的“开箱即用”和“保姆级体验”伴随我完成了许多项目。最近，我系统地学习了小满老师的 React Docs 文档，将 React 作为我的第二门前端框架正式纳入口袋。 虽然目前我刚刚学完整个教程、还没有在实际商业项目中完整踩过实战的坑，但这套体系化学习下来，我最大的感受就是：*React 和 Vue 的底层世界观完全不同。...
【FRP + Vite 踩坑记录】localhost 能访问，公网却 502？排查 IPv6、服务重载与代理重名
摘要： 踩坑日记, 由Ai总结, 答案都是问Ai出来的, 让Ai总结更好
踩坑日记, 由Ai总结 ---- 踩过的坑才印象深刻, 才能真正记住 坑 1：localhost 能通，127.0.0.1 却连不上（导致公网 502） 1. 现象与排查 本地 Vite 服务运行在 3200 端口，浏览器访问 http://localhost:3200 正常，但执行 curl.exe http://127.0.0.1:3200 却报错 Failed to connect: Could not connect to server。 检查端口监听状态： powershellnetstat -ano | findst...
NestJS学习
摘要： 延续对之前Nest的学习，拖了有点久....
前言 最近花时间学了 NestJS，从一个「听说过但没碰过」的状态，到能搭出一个完整的后端项目。这篇东西算是一个学习记录，把过程中的理解、踩过的坑、对框架的感悟写下来，也算是对自己这段时间的一个交代。 我对 NestJS 的理解 刚接触的时候，最直观的感受是：它和传统的 Node.js 框架不太一样。 以前写 Express ，都是"需要什么自己加"，很灵活，但也容易写散。NestJS 给我的感觉是 —— 它把规矩定好了。模块怎么拆、代码放哪里、请求怎么流转，都有一套明确的规范。 刚开始觉得有点束缚，但写多了发现，这种约束其实是一种解放。项目结构...
Protfolio Template - Home Page - GLM的总结
摘要： 天天读文档, 文档找不到问Ai.....
Tailwind / Nuxt UI 经典套路速查 本项目开发过程中累积的高频、可直接复用的样式搭配速查表。 涵盖定位、毛玻璃浮岛、Tailwind 4 新语法、Nuxt UI 主题色别名、动效联动等。 一、定位 / 居中三件套 任意宽度元素的绝对居中(最经典) ... left-1/2:把元素左上角点放到屏幕水平中线 -translate-x-1/2:再回拉自身宽度的一半,实现真正的...
Zod
摘要： Zod
Zod的学习, 非技术分享 什么是Zod Zod 是一个 帮助Ts的使用者们在Ts的编写和运行时，进行类型的推断和校验的库，极大的维护了Ts类型安全，0外部依赖， 轻巧，十分流行。 Zod的简单用法 下面是在NuxtContent里面看见的Zod的用法，今天看文档的时候看见了Zod，发现不会使用于是就学习了下 // 代码 schema: z.object({ // Hero 区: CTA 按钮组 + 跑马灯图片组 her...