> ## Documentation Index
> Fetch the complete documentation index at: https://docs.celo.org/llms.txt
> Use this file to discover all available pages before exploring further.

# Vibe Coding

# 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](/build/build-with-ai/mcp/index).

<iframe src="https://www.youtube.com/embed/QOCO1G8cJyI" title="YouTube video player" frameBorder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowFullScreen className="w-full aspect-video rounded-lg" />

<Note>
  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.
</Note>

## 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](https://bolt.new/)

* **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](https://lovable.dev/)

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

### Development Environments

#### [Replit](https://replit.com/)

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

#### [Base44](https://base44.app/)

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](https://www.cursor.com/)

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](https://windsurf.com/)

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

### AI-Powered Research - HIGHLY Recommended

* [Perplexity MCP](https://www.perplexity.ai/)
  * Web search capabilities
  * AI-powered reasoning
  * Context-aware responses
  * Research synthesis

### Data Collection

* [Firecrawl MCP](https://www.firecrawl.dev/mcp)
  * Web scraping capabilities
  * Data extraction
  * Automated data collection
  * Structured output

## Additional Resources

* [MCP Server Guide](/build/build-with-ai/mcp/index) - Learn more about MCP integration