Chapter 1: When AI Goes in Circles? The Art of Starting Fresh and Basic Git Rollback Strategies

During Vibe Coding, the most common problem you'll encounter is: "The AI suddenly starts messing up the code, and it keeps getting worse!" This is commonly known as "AI going in circles." This chapter will help you understand why this happens and how to perfectly solve it through "starting fresh" and "Git rollbacks."

Why Does AI Go in Circles?

Large language models (like GPT-4, Claude 3.5 Sonnet) are essentially text generators. When the context window is filled with flawed logic, ineffective patches, or contradictory prompts, the AI's attention mechanism gets distracted by this noise.

Specifically, AI going in circles usually occurs in these scenarios:

1. Band-aid Fixes: You find a bug, the AI provides a fix, but it introduces another bug. You keep feeding it new bugs, and the AI keeps patching... until the entire file becomes a mess.
2. Context Pollution: The conversation thread becomes too long, and the AI forgets the initial system architecture settings.
3. Hallucination: The AI fabricates non-existent packages or API libraries.

Core Principle: The Art of Starting Fresh

When you notice the AI failing to fix the same issue after two attempts or introducing more errors, stop the conversation immediately! Don't try to convince the AI to fix the already broken code. Instead, you need to "start fresh."

What Does Starting Fresh Mean?

1. Abandon the current conversation thread (Context).
2. Roll back the code to the "last working state."
3. Start a brand-new conversation thread and re-describe the problem.

Hands-on Tutorial: How to Safely Roll Back with Git

In Vibe Coding, we strongly recommend that you "commit after completing each small feature." This way, when the AI messes up, you can revert with a single command.

Scenario Simulation

Suppose you're developing a login button. The button originally looked great, but after asking the AI to add animations, the button disappeared. After 20 minutes of discussion with the AI, the entire page goes blank.

Step 1: Check the Current Modification Status

Open your terminal or Cursor's Git panel and enter:

git status

You'll see a list of modified files in red.

Step 2: Be Ruthless—Discard All Changes

If you haven't committed the broken code yet, you can discard all modifications with:

# Discard all unstaged changes (Warning: This action cannot be undone)
git checkout .

# If there are new but untracked files, use this to clean them up
git clean -fd

Step 3: What If You've Already Committed?

If you've accidentally committed the broken code, don't panic—use git reset. First, check the history:

git log --oneline

Find the last working version (e.g., hash a1b2c3d), then execute:

git reset --hard a1b2c3d

Boom! Your project is instantly restored to that glorious moment.

Prompt Techniques for Restarting the Conversation

After rolling back to a safe point, start a brand-new conversation (New Chat). Don't continue in the old thread, as it's already polluted.

Use this prompt structure to restart the conversation:

[Goal] I want to add a Framer Motion hover animation to LoginButton.tsx.

[Current Code] (Paste the clean, working code after rollback)

[Lessons from Previous Failure] Earlier, I tried wrapping it in a <motion.div>, which broke the original flex layout and made the button disappear. Please be careful not to disrupt the existing className="flex items-center" structure.

Summary

1. The root cause of AI going in circles is context pollution.
2. If a bug isn't fixed after two attempts, stop immediately.
3. Use Git to roll back to the last safe point.
4. Start a new conversation, summarize the failure, and reissue the prompt.

Master this principle, and your efficiency when using Cursor or ChatGPT for coding will improve by 300%. You'll never feel like smashing your computer out of frustration with AI again!

Chapter Summary

• Understand core concepts and principles
• Master implementation methods and techniques
• Familiar with common issues and solutions
• Able to apply in real projects

Further Reading

• Official documentation and API references
• Open source examples on GitHub
• Technical books and online courses
• Community discussions and tech blogs

The Vibe Coding Mindset

Vibe coding is a new programming paradigm where you describe what you want in natural language and let AI generate the code.

When to Use Vibe Coding

| Scenario | Vibe Coding | Traditional Coding | |----------|-------------|-------------------| | Rapid prototyping | ✅ Fast iteration | ❌ Slow setup | | Exploring unknown tech | ✅ AI knows libraries | ❌ Must learn first | | One-off scripts | ✅ Quick results | ❌ Over-engineering | | Production systems | ❌ Need precision | ✅ Full control | | Security-critical code | ❌ Hard to audit | ✅ Known behavior | | Learning | ✅ See real examples | ✅ Deep understanding |

The Vibe Coding Workflow

1. Describe → Tell AI what you want in plain language
2. Generate → AI writes the code
3. Review → Read and understand the output
4. Test → Run and verify it works
5. Iterate → Refine your description and repeat
6. Commit → Save working code

Setting Up Your AI Coding Environment

Essential Tools

| Tool | Purpose | Free Tier | |------|---------|-----------| | VS Code | Code editor | ✅ Free | | GitHub Copilot | AI code completion | ✅ 30-day trial | | Claude/ChatGPT | AI chat for code generation | ✅ Free tier | | Git | Version control | ✅ Free |

VS Code Extensions for AI Coding

{
  "recommendations": [
    "github.copilot",
    "github.copilot-chat",
    "ms-vscode.live-server",
    "dbaeumer.vscode-eslint",
    "esbenp.prettier-vscode"
  ]
}

Writing Effective Prompts

The Anatomy of a Good Prompt

| Element | Example | Why | |---------|---------|-----| | Role | "You are a senior React developer" | Sets expertise level | | Context | "I have a Next.js 14 project with app router" | Provides background | | Task | "Create a user profile page" | Clear goal | | Constraints | "Use TypeScript, no external UI library" | Sets boundaries | | Format | "Return the component and its types" | Expected output |

Prompt Template

You are a [role]. In my [project type], I need to [task].
Constraints: [constraints]
Requirements:
- [requirement 1]
- [requirement 2]
- [requirement 3]

Please provide the code with explanations.

Example: Create a Todo Component

You are a senior React developer. In my Next.js project, I need
a TodoList component with add, toggle, and delete functionality.

Constraints:
- Use TypeScript
- Use React hooks (useState)
- No external libraries
- Clean, readable code

Requirements:
- Input field with "Add" button
- List showing all todos
- Checkbox to toggle completion
- Delete button per item
- Show count of remaining items

Reviewing AI-Generated Code

Checklist

| Check | What to Look For | |-------|------------------| | Correctness | Does it solve the problem? | | Security | Any injection vulnerabilities? | | Performance | Unnecessary loops or calls? | | Best practices | Follows community standards? | | Error handling | What happens on failure? | | Edge cases | Empty states, invalid inputs? |

Summary

Vibe coding changes how you build software — describe, generate, review, iterate. It's fastest for prototyping and exploration, but requires careful review for production code.

Key takeaways:

• Vibe coding: describe in natural language, AI generates code |
• Best for: prototyping, exploration, one-off scripts |
• Not ideal for: production systems, security-critical code |
• Good prompts: role + context + task + constraints + format |
• Always review AI output for correctness and security |
• Iterate: refine prompt based on results |
• Essential tools: VS Code, Copilot, Git |
• Vibe coding accelerates learning by seeing real examples |

What's Next: Debugging with AI

The next chapter covers using AI to debug and fix code.