In Part 1, we learned to manage context, build effective prompts, and work with basic functionality of Cursor/Claude Code/Codex. Now let's move to the advanced level: here you'll learn how to connect AI to external tools via MCP and optimize token usage, what to always check in AI-generated code, and when it's better not to use AI at all.
Let's start with MCP — the protocol that transforms AI from a chat bot into a full-fledged assistant with access to your tools.
MCP
What is MCP and Why You Need It
Model Context Protocol (MCP) is an Anthropic standard for connecting AI to external tools and data. Simply put, it's a way to give AI access to your APIs, databases, issue trackers, and more.
Why use it?
Instead of copy-pasting data from Jira/Notion/GitHub into chat, AI reads and uses it directly.
Context7 — Must-Have for Working with Libraries
AI often suggests outdated library methods or hallucinates non-existent APIs. This is especially relevant during migrations (e.g., React Router v5 → v6 or Tailwind v3 → v4).
Context7 dynamically pulls current documentation for specific library versions directly into AI's context.
Usage example:
Config for Context7
"mcpServers": {
"Context7": {
"command": "npx",
"args": ["-y", "@upstash/context7-mcp"]
}
}How it works:
use context7 to help me implement React Hook Form with Zod validation using the latest API
Context7 pulls current examples from official React Hook Form and Zod documentation, and AI delivers working code on the first try without getting stuck in old documentation error cycles.
Other Useful MCP Servers
Figma MCP - excellent for transferring design blocks from Figma to projects, requires minor adjustments but saves significant time
Sequential-thinking - structures AI's "thought process" during task execution, outputs thoughts in JSON format, can be useful for complex tasks.
Playwright - gives AI browser access (opening/closing, simulating user actions, checking console errors/warnings), allows before/after page snapshots. Can help troubleshoot detected console problems and test interactions with various page elements.
Important: Using MCP increases context load, which may negatively impact usage limits. You need to understand whether MCP benefits outweigh additional token costs.
MCP Integration Examples:
- GitHub MCP — working with issues/PRs
- Slack MCP — reading channel messages
Token and Limit Management
Problem: AI is expensive.
How to reduce costs
- Use the right model for the task
Using Claude 4 Opus for minor bug fixes isn’t probably the best solution.
Structure:
- Simple tasks (refactoring, documentation): mini models
- Medium tasks (features, bug fixes): base models
- Complex tasks (architecture, debugging): top models
- Limit MCP output
In Claude Code:
export MAX_MCP_OUTPUT_TOKENS=50000
If MCP server returns huge data, ask it to filter results.
- Monitor usage
Regularly check your provider's dashboard. If you see sharp increases, you're using too much context — consider starting a new session/chat.
Precautions and Security
AI generates code but doesn't guarantee its safety.
Safe Work Rules
1. Check every line of AI code.
Yes, every line. Especially:
- Authentication/authorization logic
- User input handling (forms, URL params)
- dangerouslySetInnerHTML usage
- Local storage / cookies operations
- API calls and response handling
2. Run security scanners.
Integrate into CI/CD:
- ESLint security plugin — finding unsafe patterns,
- npm audit / yarn audit — checking known package vulnerabilities.
3. Don't trust AI with compliance.
If your code must meet standards (GDPR, PCI DSS, etc.), AI doesn't know this. Check it manually.
4 Data privacy.
When you send code to ChatGPT/Claude via web interface, it may be used for training. For production code use:
- API with disabled training data collection
- Self-hosted models
- Enterprise plans with data isolation
5. Definitely NOT to do:
❌ Blindly copying AI-generated code to production.
❌ Giving AI access to production databases without read-only mode.
❌ Storing credentials in a chat with AI.
❌ Using AI to generate crypto/security-related code.
Life Hacks and Best Practices
1. Project Structure for AI
Create the following in your project:
.cursor/rules # Rules for Cursor
.claude/ # For Claude Code
commands/ # Custom commands
config.json # MCP configuration
docs/
architecture.md # System architecture
status.md # Current project status
technical.md # Technical standarts
AGENTS.md # For Codex CLI
2. Prompt Template
# Context
[Project description, tech stack]
# Role
You are a [role] working on [project type]
# Task
[Specific task]
# Requirements
- [Requirement 1]
- [Requirement 2]
# Desired format
[How the result should look]
3. Iterative Approach
Don't ask it to "create the entire feature." Work in steps:
- Create the basic component structure with props interface
[Review]
- Add data fetching with TanStack Query
[Review]
- Add loading and error states
[Review]
- Add tests with Vitest and Testing Library
[Review]
4. Additional Logic Review
After the AI has provided a solution:
Explain this solution to me like I'm a junior React developer:
- Why this approach was chosen
- What alternatives exist
- What edge cases are handled
- How React re-renders are optimized here
Sometimes, during the explanation, you can immediately spot inaccuracies or contradictions in the current solution and refine it. You might also learn something new for yourself.
5. One Task Per Session/Chat
Symptoms that it's time to start a new chat:
- The AI has started repeating itself.
- It suggests solutions incompatible with previous ones.
- It has "forgotten" important instructions.
- It generates bizarre code.
Solution: Use /clear or start a new chat.
When NOT to Use AI
Yes, there are cases when AI is a bad idea:
- Algorithmic challenges.
If a task requires a deep understanding of algorithms (virtualization of long lists, render optimization, custom reconciliation), AI might suggest an inefficient solution. - Business-critical logic with edge cases.
Complex business logic with numerous edge cases and specific rules (e.g., complex calculations in a checkout flow). AI is likely to miss critical nuances. - Performance-critical code.
If every single render counts (large lists, real-time updates, 60fps animations), it's better to write and optimize manually using tools like React DevTools Profiler. - When you don't understand the task yourself.
If you can't explain what needs to be done, AI won't help either. First, figure it out yourself. Anything not described precisely for the AI will be done as the AI imagines it, and it guesses poorly in 99% of cases.
Cheat Sheet
Quick Commands
Cursor:
Cmd+K — Inline edit
Cmd+L — AI chat
Cmd+I — Agent mode
@file.tsx — Reference file
@docs — Reference docs
Claude Code:
/clear — Clear context
/mode — Change approval mode
@file — Reference file
Codex CLI:
codex --suggest "task"
codex --auto-edit "task"
codex --full-auto "task"
Golden Rules
- Specificity — The more precise the prompt, the better the result.
- Iterativeness — Don't try to get everything at once.
- Verification — Always review AI-generated code.
- Context — Actively manage the context.
- Security — Don't trust AI with security-critical matters.
Troubleshooting
AI generates strange code:
- Check the context (it might be overloaded).
- Start a new chat.
- Be more specific in your prompts.
AI "forgets" instructions:
- Use .cursorrules / system prompts.
- Repeat important requirements in every prompt.
- Reduce the context length.
Too expensive:
- Switch to a smaller model for simple tasks.
- Limit MCP output.
AI suggests outdated methods:
- Set up the Context7 MCP.
- Explicitly specify library versions.
- Check the documentation manually.
AI creates infinite loops / memory leaks:
- Ask it to explain the dependency arrays in useEffect.
- Check that AI isn't creating objects/arrays inside render.
- Ask it to add the ESLint exhaustive-deps check.
Conclusion
So, we've journeyed from a novice to an advanced user of AI tools.
Key takeaways:
- Context is everything — manage it actively.
- Prompts should be specific and iterative.
- MCP transforms AI into a full-fledged assistant with access to external tools.
- Always review AI-generated code, especially for security-critical parts.
- Remember when it's better not to use AI.
We hope this material has been helpful. Apply it in practice and share your experiences! Happy coding!
