v0 (Vercel)

前端圈公認「生出來的 UI 最好看」的 AI Builder:Vercel 的 v0,一句描述換一個能直接用的 React 元件。

它是什麼

• 開發商:Vercel(Next.js 背後的公司)
• 核心能力:自然語言生成 UI 與前端程式碼,React 元件可直接複製進專案,品質貼近設計系統水準
• 同類定位:Lovable、Bolt.new 追求整個應用,v0 的殺手鐧是前端與 UI 的精緻度,並與 Vercel 部署生態無縫銜接

典型情境

• 輸入「SaaS 定價頁、三個方案、支援深色模式」,拿到可用的 React 元件
• 設計師丟參考截圖,快速產出互動原型給團隊討論
• 工程師把表單、儀表板這類重複性 UI 交給 v0 起稿,自己只調細節
• 做多版本頁面測試,快速產出幾種視覺方案供比較挑選

選型重點

• 主戰場是前端 UI、團隊用 React 與 Next.js → v0;要含後端與資料庫的完整應用 → Lovable 或 Bolt.new
• 它與 Lovable、Bolt.new 常同時出現在考題,記住 v0 的關鍵字永遠繞著前端打轉
• 注意事項:生成的程式碼仍要審查可存取性與效能;深度綁定 React 生態,用其他框架的團隊效益打折

💡 一句話記憶:v0 = Vercel 的 UI 神筆,一句話換一個 React 元件。

iPAS 考點

科目二屬「AI App Builder(UI 生成)類」,判斷關鍵字是UI 生成、React、前端品質。題目給「快速產出高品質介面元件」→ v0;陷阱是把它當全端生成工具 — 它強在前端呈現,完整應用生成是 Lovable、Bolt.new 的主場。光譜屬 No-code 到 Pro-code:設計師可只用畫面,工程師可直接取碼。