Skip to main content

Vibe Coding Tools

Vibe Coding refers to an approach to software development where you use chat agents inside your IDE and build an application mainly by using prompts. This guide introduces you to a curated collection of tools that can significantly improve your development process, from full-stack application development to code editing and research.

Watch a quick intro to Vibe Coding with the Celo MCP Servers. You can find out more about them in the MCP section.

info

Make sure you watch some tutorials and check out some X threads to understand other people's setup. Being successful with Vibe Coding relies on your preparation and setup.

Full Stack Development Tools

These tools help you build complete applications with minimal setup and maximum efficiency. We list here our favorite tools but this list will be updated continuously. Feel free to create a PR with your favorite tool and let us know why you think it's useful.

Create a frontend with AI tools, no code

Bolt

  • Design Integration: Native Figma support
  • IDE Compatibility: Runs directly in your development environment
  • Backend Solutions: Supabase integration for auth and database operations
  • Version Control: GitHub integration

Lovable

  • Beginner-Friendly: Simplified development process
  • Backend Integration: Supabase for authentication and database
  • Version Control: GitHub integration
  • Learning Resources: Comprehensive documentation

Development Environments

Replit

  • Production-Ready: Built-in production server
  • Collaboration: Real-time coding with team members
  • Deployment: One-click deployment options
  • Package Management: Integrated package handling

Base44

For advanced developers seeking:

  • Customization: Advanced configuration options
  • Performance: Optimized development environment
  • Integration: Extensive tool compatibility
  • Scalability: Enterprise-grade features

AI-Enhanced IDEs

Modern code editors with AI capabilities to enhance your development workflow.

Cursor

An AI-powered code editor featuring:

  • Code Assistance: Direct code modification suggestions
  • MCP Integration: Native MCP server support
  • Customization: Rules and context files for personalized guidance
  • AI Features: Smart code completion and refactoring

Windsurf

A development environment with:

  • Code Editing: AI-assisted code modifications
  • MCP Support: Integrated MCP server capabilities
  • Live Preview: In-editor application preview
  • Real-time Collaboration: Team coding features

Research & Context Enhancement Tools - MCP Servers

Tools that help you gather and process information effectively, mainly MCPs. Add these to your Cursor!s

  • Perplexity MCP
    • Web search capabilities
    • AI-powered reasoning
    • Context-aware responses
    • Research synthesis

Data Collection

  • Firecrawl MCP
    • Web scraping capabilities
    • Data extraction
    • Automated data collection
    • Structured output

Additional Resources