什麼是「Vibe Coding」？

一句話：把「寫需求 → 生程式 → 改需求 → 重構」放進一條連續的對話裡完成。
它的特點：

• 不是丟一個超長 Prompt，而是像Pair Programming一樣「連續溝通、快速迭代」。
• 每回合都很短：說你要什麼 → Cursor 生成 → 立刻預覽 → 就地修。
• 重點不是讓 AI 全包，而是讓你專心在方向與品質上。

幾種 AI 與開發環境

1) AI-First IDE

• Cursor：有 Chat、Inline Edit（就地改碼）、多檔案代理（Composer/Agent），支援 @file/@folder 注入上下文與 Diff 套用，超符合 vibe 節奏。
• Windsurf：主打「agentic IDE」，內建 Cascade 代理，強調「連想 10 步」的任務推進。

2) VS Code / Visual Studio 生態

• GitHub Copilot Chat & Edits：在 VS Code/Visual Studio 內做聊天、Inline Chat 與跨檔案編修（Copilot Edits）；也提供「模式」切換（Ask / Edit / Agent）來配合不同任務。
• Copilot agent（雲端任務代理）：能自動開環境、分析 repo、嘗試修 bug/加功能，做完再給你審核（企業/高階方案）。
  The Verge
• （趨勢）多模型支援：Copilot 已宣佈可在多家模型間切換（Claude、Gemini、OpenAI），更適合按任務選模型。

3) JetBrains 系列（IntelliJ / WebStorm / PyCharm 等）

• JetBrains AI Assistant：IDE 內建 Chat、生成與雲端補全、就地修改/重構，最近還推出自家模型與更即時的上下文整合。

我怎麼運用?

在一開始可以給他簡單的prompt，告訴他你的期帶，大概要長怎樣怎樣。本米使用Cursur。
ex.

我現在要做個主頁 呈現所有商品 要有商品名稱 現在價格 原本價格 折扣多少 點選商品可以進入商品個別頁面 顯示價格浮動線

這時，我可能想要"增加個登入登出個人按鈕"跟"我的最愛"，跟它說:

我希望右上角可以增加小圓圈指標放上去會跳下來操作 像是登出/登入 設定 圓圈旁加個透明愛心框 指標移到那會有實體愛心 點進去會是有加入我的最愛的商品

依此下去，慢慢去改動。

感想

本米之前只有用過 Cursur(不是網頁開發，當時覺得很難用) 或是直接問ChatGPT，這次第一次用Cursur進行網頁開發，還在熟悉，這幾天可能會是好好跟它聊聊我的網頁，之後的東西可能就比較隨興一點，說我現在在用的東西或是其他筆記。