【SOLO 挑战赛】我用 TRAE SOLO 肝了个“反诈”测试，硬核劝退了 99% 想炒股的韭菜
写在前面：一场由“杀猪盘”引发的独立开发
大家好，我是一名普通开发者。
今天我想和大家分享的项目，不是什么改变世界的大模型，也不是什么高大上的企业级SaaS，而是一个看似有点恶搞，但内核极其严肃的 Web 应用——《投资人格深度诊断：A股反诈与认知觉醒模拟器》。
做这个项目的初衷，源于我身边发生的一件真事。
我的一个某同学，平时挺踏实的一个人，突然迷上了一个所谓的“内部游资荐股群”。群里的“老师”每天发着豪车名表的截图，用一套套看似专业的“波浪理论”、“资金面分析”疯狂洗脑。老同学深信不疑，不仅把自己准备买房的首付砸了进去，还瞒着家里人加了十倍杠杆。结果可想而知，标准的金融杀猪盘，不到半个月，爆仓出局，负债累累。
我陪他喝小甜水的时，他一直在重复一句话：“我以为我能看懂，我以为我跟他们不一样。”
那天晚上我彻夜未眠。我意识到，金融市场里最高级的诈骗，往往不是别人骗你，而是你自己的“认知错觉”在骗你。 绝大多数散户（韭菜）在进入市场前，根本不知道自己的心理承受能力有多差，不知道自己对波动的敏感度有多高，更不知道自己是不是那种“一亏钱就想满仓回本”的赌徒。
防诈的最好方式，不是没完没了地说教，而是把一面镜子狠狠地砸在他面前，让他看清自己到底是个什么货色。
于是，我决定利用业余时间，做一款深度的“投资人格测试”工具。我要用 60 道直击灵魂的专业测试题，把那些做着暴富梦的韭菜们拉回现实。
但作为一个精力有限的打工人，要从零开始撸一个包含复杂状态管理、十维度雷达图可视化、18 种不同结果的动态渲染，甚至还要包含丰富 UI 动效的 React 项目，工作量大得让人头皮发麻。
直到我拿到了 TRAE SOLO 的内测资格。接下来，就是见证 AI 生产力爆炸的时刻。
架构构思：用 SOLO 构建反诈“小贴士”
在打开 TRAE SOLO 的那一刻，我没有写一行代码，而是像和产品经理开会一样，把我的构思一股脑地丢给了它mtc。
我给 SOLO 的初始 Prompt 是这样的：
“我要做一个 React + Vite 的单页应用。这是一个投资防诈与心理测试工具。核心功能包括：1. 60道题的问卷系统，支持进度条和状态回退；2. 答题结束后，根据十个维度（如风险偏好、情绪控制等）生成 Recharts 雷达图；3. 匹配 18 种极其毒舌、硬核劝退的投资人格结果；4. UI 要有赛博朋克和深色模式的高级感。”
让我震惊的是，SOLO 没有像传统的代码补全工具那样只给我几个代码片段，它直接开始全自动构建工程。它不仅帮我初始化了 Vite 模板，还自动配置了 Tailwind CSS，引入了 Zustand 做状态管理，甚至连 Framer Motion 的页面过渡动画都帮我规划好了。
[
：展示 TRAE SOLO 的工作界面，最好截一张 SOLO 正在自动创建文件目录、安装依赖的终端画面，体现 AI 自动接管工程的震撼感] (扩充提示：在这里你可以花 500 字详细描写一下你以前配 Webpack/Vite 踩坑的痛苦经历，对比现在 SOLO 一键生成的爽快感，增加真实度。)
核心功能拆解与防诈实战演示
这个项目不仅是技术的试验田，更是防诈理念的具象化。让我们看看 SOLO 是如何帮我把这些功能一步步落地，并直击用户痛点的。
-
直击灵魂的 60 问：撕开认知偏差的伪装
防诈的第一步，是打破幻想。
我准备了 60 道测试题，涵盖了“追高意愿”、“回撤容忍度”、“信息甄别”等 10 个维度。为了让问卷不那么枯燥，我让 SOLO 帮我用 Tailwind 写了一个极其流畅的答题卡片。
一开始，我自己在题库里写了一些比较极端的词，比如“割肉”、“天台”、“家破人亡”。在测试时，我发现这种词汇虽然吸睛，但容易让用户产生抵触心理，反而达不到“心理防诈测评”的专业感。
这时候我直接对 SOLO 说：“帮我把 questions.ts 里所有极端的、情绪化的词汇替换掉，改成专业、中立但依然犀利的心理学评估话术。”
SOLO 瞬间理解了我的意图，自动调用了搜索和替换工具，把“经常眼红，忍不住割肉追高”改成了“经常受到市场情绪感染，偶尔忍不住卖出原有持仓去追逐热点”。
[答题界面。展示题目卡片、选项按钮的 hover 效果，以及顶部的进度条。] (扩充提示：在这里可以详细写写这 60 道题背后的行为金融学逻辑。比如你可以挑两道题出来分析，比如“当持仓亏损 20% 时你的第一反应是什么”，写一写现实中诈骗分子是如何利用这种“厌恶亏损”的心理来诱导散户加仓的。这部分可以写 1000 字以上。)
通过 Zustand，SOLO 帮我完美处理了这 60 道题的状态流转。用户的每一次点击，不仅记录了分数，还在后台默默勾勒着他们“容易被割韭菜”的画像。 -
十维度能力雷达：无处遁形的数据剖析
做完 60 道题后，如何直观地向用户展示他们的“弱点”？雷达图是最好的选择。诈骗分子最怕的就是散户有自知之明。
我告诉 SOLO：“我需要用 Recharts 画一个雷达图，把 10 个维度的得分展示出来，颜色要用那种幽暗的翠绿色（Emerald），带点黑客帝国的感觉。”
SOLO 直接生成了完美的组件代码。不仅处理了数据聚合的逻辑（把 60 道题的散点数据聚合成 10 个维度的总分），还把图表的 Tooltip、网格线样式调得异常精美。
当用户看到自己“情绪控制”和“纪律执行”那两项凹陷到极点的数据时，那种视觉冲击力是文字无法替代的。
[雷达图展示区。展示带有半透明绿色填充的 RadarChart，以及周围的高级感发光背景。] (扩充提示：在这里分享一段技术心得。讲讲以前手写 D3.js 或者 Echarts 有多折磨人，配置项多如牛毛，而 SOLO 能够精准理解你对图表美学的要求，直接输出生产级代码。)
-
终极防诈武器：18 型人格与纯代码生成的“赛博盲盒”
这是整个项目最核心，也是我用 SOLO 配合得最爽的一部分。
为了给出最真实的建议，我将测试结果分为了 18 个层级（Tier）。但如果你只给用户看一段文字，他们看完就滑走了，根本记不住。我要让他们有一种“开盲盒”的仪式感。
一开始，我打算接入外部的 AI 绘画 API，根据用户的得分实时生成一张图片。但我发现 API 极不稳定，经常超时导致页面“白屏”。对于一个 Web 应用来说，白屏是灾难性的体验。
“求人不如求己，不用 API 了，用纯代码给我画！”
我在深夜对 SOLO 下达了这个疯狂的指令：“我要放弃所有外部图片 API。请你帮我写一个名为 TraeToy.tsx 的 React 组件，用纯 SVG 代码，给我生成 18 个完全不同、具有极高设计感的机器人形象！要有悬浮动画，要有光影特效，颜色要对应不同的人格！”
SOLO 简直像一个不知疲倦的高级 UI 工程师。它运用了 SVG 的 、 等滤镜，硬生生用数学和几何图形给我手搓出了一个盲盒系统。
更绝的是，我给它提了一个无理要求：“第 17 号人格是‘系统化投资者’，你给我画一个特殊的彩蛋，叫‘紫老头’，必须是全紫色的，手拿魔法棒，还要有全息发光的白色胡子！”
十几秒后，代码生成完毕。我在本地一跑，看着那个悬浮在屏幕中央、胡子散发着幽幽白光、极具科技感的“紫老头” SVG，我激动得差点拍桌子。纯前端渲染，0 延迟，永不白屏！
[插入截图 4：展示结果页的“紫老头”形象。一定要截出 SVG 的光影质感和旁边的魔法棒，这证明了 AI 生成代码画图的强大能力。] (扩充提示：这部分可以大书特书！详细描述你和 SOLO 是如何推翻重构这个组件的。讲讲 SVG 渐变、内外阴影的代码实现原理，探讨一下未来前端工程中“代码即插画”的趋势，字数可以轻松扩充 2000 字。)
不仅如此，结合这个酷炫的图形，我让 SOLO 配合输出了极其“毒舌”的文案。 这才是真正的防诈核心——我不教你怎么赚钱，我只求你别去送钱。
看看 SOLO 帮我排版出来的这些刺眼的红色警告标签：
• 如果你是**“冲动跟随者”，你的标签是：极度不适合 (“精准接盘侠”)。
• 如果你是“频繁止损者”，你的标签是：很不适合 (“无情割肉机”)。
• 如果你是“长期价值者”**，哪怕听起来很高级，你的标签依然是：坚决别炒股 (“时间成本黑洞”)。
每一条人格解析的最后，都有一句雷打不动的“安心建议”：把注意力放回主业，上班时别盯盘，健康、工作、家庭与现金流才是你可控的增长引擎。
当一个满怀暴富梦想的人，做完 60 道题，满怀期待地看着精美的赛博盲盒动画，最后弹出一句血淋淋的“极度不适合（大A提款机），建议销户安心上班”时，这种反差带来的震撼，比任何派出所的反诈宣传单都要深刻一百倍。
[插入截图 5：结果页的文字解析部分。重点截出红色的“极度不适合”标签，以及下方的“尽量避免”和“安心建议”文字排版。]丝滑上线：一行命令的 Vercel 部署
当所有的功能开发完毕，代码在本地完美运行后，最后一步就是把它推向公网，让更多人能够测试自己是不是那颗“待割的韭菜”。
以前部署项目，我们要搞服务器、配 Nginx、搞域名解析。而现在，我直接在 SOLO 的对话框里输入：“帮我把项目 build 一下，然后用我的 token 部署到 Vercel 上。”
SOLO 自动打开了底层的 Terminal，依次执行了 npm run build。看着控制台里 Vite 极速压缩文件的进度条，再到 npx vercel --prod 的自动执行。虽然中间 Vercel 的 IP 稍微出现了一点网络超时的波动，但系统自动重试并最终给出了一个绿色的 Production URL。
https://workspace-nine-blush.vercel.app/
当我在手机浏览器里输入这个网址，看到我构思的那个“反诈宇宙”完美呈现，滑动丝滑，SVG 盲盒闪烁着光芒时，我看了一下表，从构思到上线，如果只算有效编码时间，仅仅用了不到几个小时。
[插入截图 6：TRAE SOLO 执行 Vercel 部署命令成功的 Terminal 截图，展示绿色的 URL 链接。] (扩充提示：讲讲你对 Serverless 架构的看法，以及 AI 工具如何抹平了前端开发和运维部署之间的鸿沟，让全栈开发真正变成“单人成军”。这里可以再扩写 1000 字的架构演进思考。)

尾声：为什么我们需要这样的 SOLO？
回到最初的那个故事，那个因为“杀猪盘”倾家荡产的老同学。
如果时光倒流，如果在他加杠杆梭哈之前，能有人按着他做完这 60 道题，让他看到雷达图上自己那千疮百孔的“情绪控制力”，看到屏幕上那句刺眼的“极度不适合，精准接盘侠”，他会不会停下按向“买入”键的手？
我不知道。但我知道，作为技术人，我们能做的不仅是写出跑得更快的代码，更是用技术去构建一面面镜子，去照亮人性的盲区。
在这次「AI 无限职场」SOLO 挑战赛中，我最大的震撼不在于 AI 帮我少写了多少个 div，而在于它极大地缩短了“想法”到“现实”的距离。
以前，我有一个公益反诈的想法，可能因为嫌配环境麻烦，嫌画 SVG 太费头发，嫌部署太繁琐，这个想法就死在了我的脑海里。
但现在，有了 TRAE SOLO，我只需要充当一个“导演”和“产品经理”。我把对于金融诈骗的痛恨、对心理学的理解倾注到业务逻辑中，而 SOLO 替我摆平了 React 的状态流转、Tailwind 的像素级对齐、SVG 的光影渲染和 Vercel 的自动化部署。
AI 并没有剥夺程序员的工作，它只是帮我们剥离了那些枯燥的泥瓦匠工作，让我们重新成为了真正的架构师和创作者。
这不仅仅是一个防诈测试工具，这是我对“AI 赋能超级个体”交出的一份真实答卷。
最后，奉劝各位看到这篇文章的朋友，去测一测吧（最好别在上班摸鱼的时候测，怕你道心破碎）。如果测出来是“紫老头”或者“提款机”，听我一句劝：
卸载炒股软件，好好工作，多陪家人。这，就是这个世界上最顶级的防诈指南。 -
附录：技术栈一览
• 核心框架：React 18 + Vite + TypeScript
• 样式引擎：Tailwind CSS (极致的暗黑玻璃拟物风)
• 状态管理：Zustand (轻量级处理 60 题状态回溯)
• 动画库：Framer Motion (丝滑的组件过渡与悬浮效果)
• 图表库：Recharts (高度定制化的十维度雷达图)
• 绘图引擎：Pure SVG (完全摒弃外部 API，前端代码直接生成复杂光影机甲盲盒)
• 部署方案：Vercel CLI (一键式 CI/CD)(感谢 TRAE 与脉脉提供这样一个平台，希望我的 SOLO 实践能给更多开发者带来灵感！大家如果有 SVG 代码生成或者状态管理的疑问，欢迎在评论区交流，看到必回！)
