π Vibe Coding Practical Configuration Guide (Java + React Full Stack Edition)
Core Strategyβ
- Frontend (VS Code): Pursue Full Automation, let Agent write components by itself.
- Backend (IDEA): Pursue Robustness, use plugin as external brain + super fast completion.
- Model Core: Full access to DeepSeek V3 API (Cheap, Smart, Domestic Direct Connection).
1οΈβ£ Frontend Battlefield: VS Codeβ
Goal: React component generation, style adjustment, auto fix Bug.
- Main Force Plugin: Cline (Must Install)
- Config: API Provider select
DeepSeek, model selectdeepseek-chat. - Usage: Sidebar conversation -> "Help me write a user list card, using Tailwind style" -> It automatically creates file and writes.
- Config: API Provider select
- Backup Plan: Antigravity
- Scenario: When you don't want to configure Key, just want to use free quota for quick Demo.
2οΈβ£ Backend Battlefield: IntelliJ IDEAβ
Goal: Complex business logic, architecture refactoring, second-level completion.
- Brain Plugin: Continue (Must Install)
- Config: Access
DeepSeek API. - Usage: Encounter complex logic/refactoring -> Invoke dialog box -> "@Codebase help me check transaction consistency issue of UserServiceImpl".
- Config: Access
- Hand Speed Plugin: Tongyi Lingma (Lingma) (Must Install)
- Config: Log in with Aliyun account.
- Usage: Daily coding -> Press Tab wildly, enjoy millisecond-level auto completion.
β‘ Workflow Cheatsheet (Workflow)β
| Scenario | Tool | Action |
|---|---|---|
| Write React Page | VS Code + Cline | "Read @api.ts, help me generate corresponding frontend CRUD page, want dark mode." |
| Write Java Interface | IDEA + Continue | "@Codebase based on existing entities, design a high performance batch insert interface." |
| Write Specific Code | IDEA + Lingma | Type first few letters, press Tab to complete remaining code. |
| Fix Bug | VS Code + Cline | Paste error to it -> "Run terminal, locate and fix this issue." |