AI Coding 新闻天天有，Demo 天花乱坠个个都是 SOTA 。
抛个实际点的问题，前端工程师们实际在 PC 中后台通过源码构建的场景，利用 Figma + AI 辅助（ Cursor/Claude Code/...）完成业务需求的实际效果怎么样，能满足预期吗？有感觉比较满意的经验分享吗？
 |
1
mumbler 25 天前  1
25 年都过去三分之二了，还在怀疑 vibe coding 的能力，别人说不好你就继续刀耕火种吗
|
 |
2
midsolo 25 天前
前端早就能 vibe coding ，后端还是要费点功夫，要把需求拆成极小的单元任务块才行。
公司的祖传项目用 DDD 重构时，面对项目中总数高达 27w 行的存储过程，cursor 都冒烟了也毫无办法，只能靠人工一个一个的拆。 |
 |
3
dickeylth OP @mumbler 我没有怀疑，是实际遇到一些 case 发现并不好解决，想请教下看看大家的经验，你怎么就能断定我在刀耕火种呢？如果你有实际的效果特别满意的 case ，可以分享下经验，不要纸上论道。
|
 |
4
nanyong0627 25 天前
@dickeylth 我觉得你不如把你的 case 发出来..
|
|
5
dickeylth OP @dlmy 前端也有前端的痛，多模态可视化的能力目前看还达不到像素级精准还原的要求，figma MCP 也不完全是银弹（除非 Figma 和 PRD 质量都非常高），另外数据处理逻辑在复杂业务场景里也会很碎片化，交给 AI 要想干好，实测也需要很多上下文手把手的补充比如这里显示的数据从哪个字段取、面向展示需要做什么额外格式化逻辑等等
|
|
6
dickeylth OP @nanyong0627 可以，上一条回复补充了
|
|
7
dickeylth OP 加一些具体描述以免讨论泛泛而谈：
1. 面向的是中后台依赖 Pro Code （源码开发）场景，对 UI 有一定高保真还原要求； 2. Figma 和 PRD 受个体差异质量无法要求，Figma MCP 返回的结构化数据里节点排列可能会和在 Figma 中看到的图比如顺序上有差异，PRD 中可能会混合前端和后端的需求； 3. 部分场景下针对已有功能的优化不一定有完整的 Figma ，可能产品会基于线上截图给一些调整后的效果图；而对于图像的 OCR 识别，现成的即使是最好的 Claude 系模型也还做不到像素级精确识别布局间距这些信息； 4. 接口返回字段和页面 UI 上的映射关系，就过往的开发模式依赖于前后端的沟通，存量的业务逻辑在有限的注释量下交给 AI 来消化 |
 |
8
zuosiruan 25 天前
ai 在前端就是无敌的存在
|
 |
9
elmelloi 25 天前
写后台这种有主流组件库的比如 antd 非常好用，你把需求描述清楚生成的基本可用。如果是 C 端自定义样式的组件，哪怕有 figma MCP 生成的效果也是一坨。
|
|
10
elmelloi 25 天前
如果你只在乎功能可用，然后样式是基本美观的话，用 ai 工作效率非常高。但是样式交互定制化要求非常高的话，还是要手搓。我是这么认为的。
|
 |
11
zhousystem 25 天前
前端这个职业可以说已经废了。 即时是用 GitHub Copilot 里非常辣鸡的 GPT-5 min 写出来的落地页也非常的好。
|
 |
12
MrGba2z 25 天前 1
讲个这周的事情
SMS Forwarder 这个软件正式开始收费了 摸鱼半天写了个替代品侧载到自己手机上（没有一行代码是自己写的, 我也从没写过安卓）完美代替 |
 |
13
MindMindMax 25 天前
个人的体验：对于视觉要求（例如元素位置精度、动画效果）不高的 UI 基本上能搞定。
|
 |
14
murmur 25 天前
如果是手写 css 若一点，但凡你用那种助记词，ai 完爆初中级前端，你还得背助记词，ai 直接写的又快又好
|
 |
15
littlebaozi 25 天前 1
涉及一些复杂的业务逻辑，还不如自己想想写得快
|
 |
16
weixind 25 天前 3
你的感觉没错。
因为前端的反馈周期最短，浏览器就能直接运行，所以登上 “愚昧之巅” 的人最多。 现在设计稿的还原还处于“史密斯吃面”的初级阶段。 你可以生成一万个史密斯吃面，都是有两个眼睛一个鼻子，至于眼睛在哪鼻子在哪，属于管你这那的，就问你有没有两个眼睛吧。 对于设计稿还原，你直接盯着 figma 和 figma 插件的生态就可以了，真到可用的阶段，一定是最先反映到最前沿。 |
 |
17
ShayneWang 25 天前
如果还有机会换工作,面试的时候我只能说熟练编写各种 AI 工具提示词...
|
 |
18
jones2000 25 天前
1. 对于能力低的开发，AI 辅助编码是有用的，反正也不会写， 没有思路， 用了 AI 起码能把代码搞出来， 至于对不对，就看 AI 了。
2. 对于能力强的开发，AI 辅助编码比较鸡肋，如果描述少了，AI 就根据自己的思路逻辑写代码，可能跟你的思路不一样，这个时候就比较变扭了。如果把自己的思路描述很详细，其实跟自己写代码时间差不多，有时候用 AI 可能更费时间，你还要检查 AI 的代码是不是根据你的思路写的。 |
 |
19
ryncv 25 天前 1
cursor + claude4 。在公司已经几个月没有手写代码了。。
|
 |
20
x86 25 天前
现在真可以用嘴写代码了
|
 |
21
shakukansp 25 天前
挺好啊，新功能如果和老功能差不多，我就跟 cursor 加一句说你参考下别的页面看着办
|
 |
22
wu67 25 天前 via Android
@MrGba2z 啊？
防诈提醒：SmsForwarder 完全免费开源，请您在 打赏 前务必确认是否出于自愿？本项目不参与任何刷单返利担保！请您远离刷单返利陷阱，谨防网络诈骗！ https://github.com/pppscn/SmsForwarder |
 |
23
shiweifu 25 天前
面对一般交互的项目，属于有嘴就能写
|
 |
24
kzfile 25 天前
某些复杂的细节要是说出来,还不如我直接上手干,
当然因为业务扯皮,很多细节其实都没啥意义 |
 |
25
wtf12138 25 天前
简单的增删改查表单页完全可以一字不改，业务逻辑复杂的得拆的很细和 AI 说，反而不如自己写，还有一些地图应用，生成的都不行
|
 |
26
lizy0329 25 天前
1 有特定 UI 要求, 图片/动效 较多的,AI 无能为力,或者说你压根不知道如何清晰地表达
2 你需要不断修改项目的 project_rules 或者喂 context7 的文档, 反反复复地调试 3 对 UI 库上的每个组件形式, 需要单独调试,特别是弹窗, 一连串的交互动作,特别难 4 在使用 AI 写项目前,要求你对整个项目有一个充分的认知, 可以让 AI 写 prd,一项项对. 同时要将 数据库, 存储, 环境 等提前告知 AI 总之 AI 适合没有特定 UI/交互要求的项目, 最好能从 0.0.1 版本每次只加 1 个功能,慢慢累加 |
 |
27
musi 25 天前 via iPhone 3
说 AI 在前端无敌的，你们真的用 AI 去一比一还原公司那质量不高的 figma 稿子了吗？
|
 |
28
hemllimoer 25 天前 3
我倒觉得 AI 在后端使用更丝滑，前端需要 UI 还原，交互多的也不好描述清楚，还有自动化测试我们前端也没有，纯用 AI 还是不太靠谱，还要自己读 AI 写的代码，大量测试完善。
|
 |
29
abelmakihara 25 天前
很明显写接口用 ai 和功能更好用 不是很懂那些写页面的是不是没 ui 或者管理后台随便糊弄就行的..
|
 |
30
dyq917 25 天前
@zhousystem 看来只做这类项目啊
|
 |
31
cutpictureboyxx 25 天前
是不是说 AI 在前端无敌，AI 在前端能完全 vibe coding 的都是后端。真正对前端要求高一点
复杂一点的商业化的项目，AI 目前来说还是存在很多问题，可以辅助编程，但是完全 vibe coding 只能说 demo 还行。 |
 |
32
arayinfree 25 天前
后端更容易,接入第三方服务,直接丢 接口 和 文档 让 ai 实现. 当然前提是我们系统设计的合理.接入实现接口即可. 例如下单,付款,回调,验证 ...
|
 |
33
dingxi 25 天前
感觉在做交付周期短，小外包项目的时候，出活儿特别快。
但如果，在自研公司，ai 的作用，更大的作用还是在，解决特殊场景时，提供你方案和思路，尤其是和业务关联不强，但复用场景多的 工具函数，组件。 完全可以交给 ai 去写，自己 review ，省事很多 |
 |
35
Lexin914 25 天前
设计稿还原现在还不行，其他能力真的很强，拿来写一些公司内部项目是真不错（对设计交互无硬要求的）
|
 |
37
vitoaaazzz 25 天前
嵌入式 C/C++、工具脚本 python 、后端 Java 、前端 vue 。
全栈都能通过 cursor 提高开发效率，你要全自动编程现在还远远达不到，但是辅助编程越是资深工程师效率的放大倍数越高。 |
 |
38
layxy 25 天前
写工具还行,写页面就是屎山,写业务目前还是个半吊子,别说我没拆分和规划,拆分了,规划了,但是反复出错
|
 |
39
gerorge 25 天前
我的代码 50%都是 ai 写的 复杂逻辑都交给 ai 来写了 我只细微调教
|
 |
40
leega0 25 天前 via iPhone
用 AI 完成了一个后台管理系统，纯手写的逻辑代码不超过 100 行，大量时间是在告诉它怎么做和对它生成的界面进行微调，不过期间也是发现了问题，给再高清的图片也无法 1:1 还原，让它改会越改越复杂，例如布局上 CSS 几行代码可以搞定的东西，它要写数倍代码，3d 大屏带交互这类的就更不用说了，基本上不可用。
|
 |
41
Chuckle 25 天前
能搞定非业务的，比如让 ai 帮整个表单架子还是 ok 的，但是表单延申出来的动态逻辑控制、校验规则之类的，还是得靠人写，也就是还原产品 prd 里那些弯弯绕绕的逻辑。另外写工具也不是万能的，我最近在重构老页面，让 ai 帮我封装 antd 的 Formitem,支持双向字段映射，ai 写不出来，可能是因为没学过，我在网上也没搜到类似的实现。
|
 |
42
SaiyZhao 25 天前
UI 实现没问题，但是 vibe code 代码都是屎山，当然很多初级根本不明白屎山是什么。还是只能当工具用，不过整体代码效果比去年好很多了。
|
 |
43
raolight 25 天前
Ai 写逻辑和功能挺强的，拿来写设计稿 UI 就算了，别折磨自己🌚
|
 |
44
shaojian0702 24 天前
2c 的，只能生成大体结构，好多还是要自己写。正常业务逻辑可以写个架子，然后跟着调整，实现出来就是流水账。不想费脑子追求优雅的话，就当跟 ai 聊天了。
|
 |
45
accelerator1 24 天前
看一些回复就知道有些人对于前端的认知还在 html+js+css 的时代，感觉自己分分钟能 cover 一样，要是真能 cover ，干嘛不把前端的工资一起拿了，对吧全栈工程师
 。2B 的场景下，只要项目组件的接口/文档足够详细，完全可以让 AI 去做，大部分也能完美实现； 2C 的话，你要浪费不少 token 了，因为基本做不到你满意的效果（就 V2EX 上经常出现的 vibe coding 的产品页面，一股子 AI 味），v0 也做不到像素级还原，还是要自己一个细节一个细节的去对话调整（我的 cursor 60 刀套餐都是浪费在页面微调上了）。 |
 |
46
cochlea 24 天前 1
作为深度体验以及准备转行到 AI 赛道的前端来说下，目前生成的效果完全取决于模型的效果，此外存在一系列问题，看你能不能接受
1. 设计图的还原度，结合 mcp 可以大概还原，但是对于一些复杂的设计图，随便举个例子来说例如大屏根本没办法写。 2. 对于多次迭代，一个项目最初通过 AI 来迭代，但是后续功能依然通过 AI 来迭代，来个几次你就会发现上下文不够，或者说改了一处另外一处出现问题 3. 对于提示词你需要结合业务来梳理，但是实际上这个过程非常的繁琐，因为如果你要效果好，就必须输入很详细，但是很详细真的很浪费时间，另外如果出现细微的错误，你依然要指点它如何排查，如何修改，这个过程也不会轻松 4. 对于我来说我有工程洁癖，必须按照最佳实践来写，但是问题在于 AI 的训练有时间节点，很多库或者调用都不会最新的可能，以前的写法都被废弃等。 5. BUG ，这个是最让人头疼的，就是莫名其妙的陷入一个问题出不来，你需要协助它来排查，甚至可能还要自己编码一部分，例如我有一个播放器的需求，让他生成一个音乐播放器，明确还原我的要求...但是最终生成的结构没有遵从样式，导致我需要自己来改。 6. 最重要一点就是，你如果不懂前端就根本没办法掌握 AI ，别人给你写的代码，你能读得懂吗，真的能定位出来问题吗？我持怀疑态度。 ... |
|
48
MrGba2z 23 天前
@wu67 我指的是 play store 上那个
这类软件同名的很多 我用的那个收费了之后 我很清楚应该有很多别的软件能有这样的效果，我那天是纯粹想 vibe coding 一下 Android app 所以没去找现有的同类产品。 |
 |
49
liangjiujiu 23 天前
@zhousystem 但凡你稍微使用过都不会说出这种没有一点边界感的话
|
 |
51
94 22 天前
@dickeylth #7 ，技术不是万能的，很多时候不能靠程序去规范和规避工作流程和团队沟通上的所有问题。
一般项目都是在项目开始前制定好一个样式规范，所有的间距字号杨式布局等等都是按照这个规范来约定，那么可以让 AI 很快的糊出来。 没有这先行的标准，并且有第 3 条和第 4 条这种意识流或者口口相传的情况的话，即使全手写也没办法保证一把能过走查。虽然可以用提 issue 的方式慢慢调，但效率肯定不如截图标注和口口相传。 如果大部分情况下其实开发的都是管理后台项目，早几年通过简单的表单生成器都能胜任的工作 ai 肯定可以胜任的。 如果是一些 2C 的项目或者落地页。在页面高度定制的情况下，除非 UI 同学在 figma 中或者提交蓝湖前做好各种命名和层级拆分不然是没办法避免第 2 条的问题。 还有很多 UI 设计稿都是靠手拖，没有使用网格和参考线，即使有像素级的还原也会有各种对齐的问题。 |
|
52
zhousystem 22 天前
@liangjiujiu 不要把自己的已有的知识和技能看的太重。 我不会写前端，我已经用 AI 给我写了支持全平台（ electron/ios/android ）的 VPN 应用。 从官网到应用全是 AI 写的。https://safewoo.com. 别说前端了，我 android 和 ios 从一丁点不知道怎么写到 AI 全写完也就各用半个月。
|
 |
53
coolmenu 22 天前
还是看语言的，比如 elxir 这种小众的语言，AI 就明显资料不够，如果是 typescript ，java ，python 这种，问题不大，就是要控制代码，分层，不然就是 Claude 也是容易写出垃圾山，并且 Claude 有时候过度设计明显，不如 codex ，两个一起用。
|
 |
54
sakura1988 22 天前 1
@zhousystem 我发现这帖子里很多人都像没干过活。自己写和给公司写是一个概念吗？
|
|
55
dickeylth OP @dfkjgklfdjg 认同，感谢回复
|
Select Language