---

name: mcp-toolbox description: Leverage MCP servers for AI-native development with context, automation, and integrations.

MCP Toolbox Skill

Use Model Context Protocol servers to extend AI capabilities beyond code generation.

When to Use

• Need up-to-date library documentation
• Automating browser tasks or testing
• Database queries without writing SQL
• Breaking down complex problems
• Connecting to external services

1. Essential MCP Servers

Documentation & Context

Development Tools

Database & Backend

Design & Productivity

2. Usage Patterns

Before Coding

Copy1. context7: resolve-library-id → query-docs
2. Check for latest syntax/patterns
3. Implement with confidence

Debugging Flow

Copy1. Sequential Thinking: break down the problem
2. Context7: verify correct API usage
3. Puppeteer: test in browser if UI issue

Database Work

Copy1. Supabase MCP: list_tables, execute_sql
2. Check schema before writing queries
3. Use apply_migration for DDL changes

3. Quick Reference

Copy// Always start with context7 for any library
mcp_context7_resolve-library-id({ libraryName: "react", query: "how to use useEffect" })
mcp_context7_query-docs({ libraryId: "/facebook/react", query: "useEffect cleanup" })

// Supabase operations
mcp_supabase_list_tables({ project_id: "xxx", schemas: ["public"] })
mcp_supabase_execute_sql({ project_id: "xxx", query: "SELECT * FROM users" })

4. Best Practices

• Always verify docs first — Don't assume, use Context7
• Batch operations — Combine related MCP calls when possible
• Check advisors — Run get_advisors after DDL changes
• Use right tool — MCP for external integrations, local tools for files

---

Cross-reference: See best-practices for UI standards, vibe-coding for workflow philosophy.