← 返回網誌
vibe-codingmistakesbest-practicesdebugging

5 個常見 Vibe Coding 錯誤(同點樣修正)

1/26/2026·222 Tech

錯誤 #1:冇 Error Handling

問題:
AI 生成嘅 code 通常假設所有嘢都完美運作。冇 try-catch、冇 error states、冇 fallbacks。

修正:
```javascript
// 錯
const data = await fetch('/api/data').then(r => r.json());

// 啱
try {
const res = await fetch('/api/data');
if (!res.ok) throw new Error('Failed to fetch');
const data = await res.json();
} catch (error) {
console.error('Error:', error);
// 顯示用戶友好嘅信息
}
```

錯誤 #2:Hardcode 秘密

問題:
AI 唔識 .env files。佢成日將 API keys 直接寫喺 code 入面。

修正:

  • 永遠唔好 commit secrets 去 git

  • 用 environment variables

  • 將 .env 加入 .gitignore
  • 錯誤 #3:冇 Input Validation

    問題:
    AI 信晒所有用戶輸入。呢個會導致安全漏洞同 crashes。

    修正:
    ```javascript
    // 錯
    const userId = req.body.userId;

    // 啱
    const userId = req.body.userId;
    if (!userId || typeof userId !== 'string') {
    return res.status(400).json({ error: 'Invalid userId' });
    }
    ```

    錯誤 #4:N+1 Database Queries

    問題:
    AI 成日寫每個 item 一個 query 而唔係 batching。

    修正:
    ```javascript
    // 錯 - N+1 queries
    for (const userId of userIds) {
    const user = await db.users.findById(userId);
    }

    // 啱 - Single query
    const users = await db.users.find({ _id: { $in: userIds } });
    ```

    錯誤 #5:冇 Loading States

    問題:
    AI 忘記 APIs 需要時間。用戶會見到空白畫面或壞嘅 UI。

    修正:

  • 加 loading spinners

  • 顯示 skeleton screens

  • 提交時 disable buttons
  • 需要幫手?

    呢啲只係冰山一角。我哋每日 review vibe-coded projects 同修正呢啲問題(仲有好多其他)。

    俾我哋 review 你嘅 code →