V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
• 请不要在回答技术问题时复制粘贴 AI 生成的内容
zwpaper
V2EX  ›  程序员

后端程序员终于也能写写前端了

  •  
  •   zwpaper ·
    zwpaper · 14 天前 · 5391 次点击
    作为一个后端程序员,之前也尝试过很多次入门前端技术,毕竟能自己写前后端才能更容易写出一些实用的工具,可惜入门多次都没能研究明白前端的样式到底要怎么调。

    最近各种 Agent Mode 的工具出现,花了差不多半天时间,尝试让 AI 写了一个我自己的 Landing Page ,说实话,效果还挺让人满意的。

    整个过程我几乎没有真正调整过代码,项目介绍基本也都是 AI 自己生成的,原本想着 GitHub 最近除了 MCP Server ,想尝试直接通过 MCP 直接把 Page 也部署了,后来发现还没实现 Page 相关的功能,就放弃,手动部署了。

    附上地址,给各位看看成片效果:

    https://kweizh.com/
    26 条回复    2025-04-16 15:57:49 +08:00
    xuelang
        1
    xuelang  
       14 天前
    哈哈哈,还不错啊
    i8k
        2
    i8k  
       14 天前
    好像有 bug ,view on github 按钮点了没反应
    zwpaper
        3
    zwpaper  
    OP
       14 天前
    @i8k 还真是,不过也正常,现在的 AI 不是在写 Bug 就是在写 Bug 的路上,我来找一个 Agent 批评一下
    LittleYangYang
        4
    LittleYangYang  
       14 天前   ❤️ 1
    Next 的话可以考虑用用看 v0.dev

    btw ,我忘了关自动订阅被收了两个月的月费了 orz
    xiaoming1992
        5
    xiaoming1992  
       14 天前   ❤️ 1
    右键查看元素就能看到,上面盖了一个不知道干嘛用的 canvas ,把那个 canvas 隐藏掉就能点到了
    zwpaper
        6
    zwpaper  
    OP
       14 天前
    @LittleYangYang v0.dev 也用过,确实好评,最早尝试的就是 v0 ,但是有一个问题是 v0 似乎主要是生成前端的,设计很好看,但是要去接后端的时候,就有点抓瞎了。

    最近这波 Agent mode 能直接让 AI 把后端也接起来,我再接手比较容易
    ongfei211
        7
    ongfei211  
       14 天前 via iPhone
    @xiaoming1992 背景那个动画
    MonikaCeng
        8
    MonikaCeng  
       14 天前 via iPhone   ❤️ 1
    我一直用这个帮我写前端,只需要聊天就行: https://lovable.dev/?via=typescript
    jaylee4869
        9
    jaylee4869  
       14 天前
    @zwpaper #6 Next.js 也能写后端,而且无缝连接 supabase neon 这类数据库。
    Yanlongli
        10
    Yanlongli  
       14 天前
    虽然但是,后端程序员写前端不是基操吗?
    lyxxxh2
        11
    lyxxxh2  
       14 天前
    我 3.7 现在用得好降智。
    1. 登录成功刷新页面

    (我..cursorrules 已经说明了是 vue )

    2. 更过分的: 在 template 里面用.value

    看着 template 里面的.value,能这么用的?
    IAmAnonymous
        12
    IAmAnonymous  
       13 天前
    话说我每次被 nextjs 的 tailwind 配置搞的放弃,配置后老不生效,AI 也无法解决
    zwpaper
        13
    zwpaper  
    OP
       13 天前
    @lyxxxh2 所以现在都说最佳编程模型成 Gemini 2.5 Pro ,另外我猜测可能和中英文有关系
    zwpaper
        14
    zwpaper  
    OP
       13 天前
    @IAmAnonymous 哈哈哈,我就是每次都调不明白样式
    gynantim
        15
    gynantim  
       13 天前 via iPhone
    感觉和网站找个模版套进去也没啥区别,bug 还更少。
    bololobo
        16
    bololobo  
       13 天前
    需要付费吗?
    dcoder
        17
    dcoder  
       13 天前
    我以为你写了个产品来 demo, 一看是个个人主页 ...
    zwpaper
        18
    zwpaper  
    OP
       13 天前
    @dcoder 我内容里就说了,尝试让他写一个我自己的 Landing Page ,毕竟 AI 和我都还没到半小时写了一个产品的水平

    @gynantim 主要是为了验证一下现在 AI Agent 写前端的能力,能从零按需写 Landing Page ,类型也能按需写其它需要的产品前端
    zwpaper
        19
    zwpaper  
    OP
       13 天前
    @bololobo 有很多不需要付费的工具,Cursor 免费也能用,Google 也刚推了 Firebase Studio
    5had0w
        20
    5had0w  
       13 天前
    让 ai 用 tailwind.css 写,做出来基本都不会太丑
    zwpaper
        21
    zwpaper  
    OP
       13 天前
    @5had0w 是的,tailwindcss 莫名契合了 LLM 时代,而且本身 tailwind 也确实挺好看的,就是平时没啥机会写前端,突然要写的时候,根本弄不明白该咋写,这时候 AI 就帮上忙了
    ghos
        22
    ghos  
       13 天前
    OP 能稍微说说用的什么工具吗?我也想开发一个自己的页面
    zwpaper
        23
    zwpaper  
    OP
       13 天前
    @ghos 我这个页面实际在做的时候,使用了好几个工具,直接可用的就是 cursor 和 copilot 的 Agent Mode ,注意模型最好使用 Gemini 2.5 Pro 和 claude 3.7 ,模型的选择会带来质的差异
    ghos
        24
    ghos  
       13 天前
    @zwpaper 太感谢了~这就去玩一下
    heftyMan
        25
    heftyMan  
       13 天前
    还可以,bug 修一下,细节优化下就更好了
    zwpaper
        26
    zwpaper  
    OP
       12 天前
    @heftyMan 哈哈,毕竟只是个试验田,昨天批评了一下 AI ,没修好,就先做回打工人了,有空慢慢修一下
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   5691 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 29ms · UTC 06:12 · PVG 14:12 · LAX 23:12 · JFK 02:12
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.