A Comprehensive Guide to Vibe Coding Tools
If you have been hanging around developers watering holes (X and YouTube), chances are you have come across a new emerging lexicon with words like — “cracked,” “cooked,” “lock in” and variations of “vibe coding.”
Every time there is a new wave of a trend like this, I often wonder — is there a way to trace a trend back to one moment, one conversation where this may have started and then took on a whole new life?
Maybe not for everything but thanks to most of the conversations now happening in the online world, the provenance of some can be verifiably traced back to the moment something was minted.
This is the story of Vibe Coding — a term first articulated by the prolific thinker — Andrej Karpathy on X.
Ever since this was posted, the post has been viewed over 4.5 million times, and the ever-expanding plethora of vibe coding tools has become a mini-industry of its own. To be fair, a lot of these existed before this now famous tweet but now with an official category name, there are no dearth of “influencers” riding the wave of posting and re-posting screenshares of games and other SaaS applications people have been building using vibe coding.
In many ways, I think of vibe coding as an evolution of programming from telling the system how to do something, for example a bubble sort, to telling it what to do. In some cases, as Andej mentioned, it probably does not matter how certain things are made as long as they work.
And therein also lies the challenge if you are an engineer working in a team in a large enterprises where you not building new games or apps every day, rather working on millions of lines of code that have been already written to improve, fix and add features on top of. Here, it does matter how things are made. If vibe coding is about Day 0 experience of building apps, Day 1 is about building upon that code, fixing bugs, adding features and working with other team members.
As a professional dopamine chaser who loves to build things and get a kick out of watching something come to life, I have been using and playing around with all possible vibe coding tools I could get my hands on for a few months now. In this article, I am cataloging those tools as of today to organize my own thoughts and help others who may be interested in getting a high-level overview of this fascinating new universe of coding before diving in.
Before we dive in though, let’s break the vibe coding tools under some broad categories of what people are looking to build.
Full Stack App
A full stack app consists of a front-end code (UI), backend (API) calls, database, integration and storage. If you have a business idea and you are looking to sell software or a product this is what you want which means in addition to the list of things above, there are two other important ingredients of full stack apps — Authentication and Payment integration. Finally, once the app is made, you want to deploy it to a server so that users can access them from a URL.
Traditionally, building a full stack app required teams of people and took months, if not years to build. Today, believe if or not, you can build a full stack app in a day with just you sitting in front of a computer.
Let’s first look at UI centric AI coding tools that can be used to build full stack apps. Using these tools not only can you generate and immediately view the apps, but you can also click on certain elements in the app and continue asking the AI tool to change specific parts of the UI.
- Tempo Labs
Tempo labs is not entirely built for a no-coder but it also has fairly good controls for both low-code and intermediate programmers. With Tempo labs, you can choose the authentication technology and backend at the start of the project and one of its neat feature is that it also generates the Product Requirements Document (PRD) and user flow diagrams along with the code and you can continue to either add new components visually or directly with AI prompts or by exporting the code and using the PRD to iterate on the code with other AI coding tools. The overall user flow diagram is also a very nifty way to visualize your app’s user journey in an efficient way.
With Tempo labs you can also create payment integration with Stripe and Polar and enable authentication and database with Supabase or Convex.
More recently, Tempo labs launched a new feature that enables creating a new application from an existing Github repo. However, at the time of writing this article, I could not get this to work for three different NextJS existing applications. I have hope this gets better with time so the tool becomes useful not for just Day 0 apps but also Day 1+ apps.
2. Bolt.new / Bolt.diy
Similar to Tempo labs, Bolt.new is a tool created by Stackbliz that enables building an entire full stack app using AI visually. One of its unique features is to directly import designs from a Figma account and convert those into code (application)
Stackblitz had introduced the idea of web containers that enable Node to run in the browser and using this feature, which means not only can you use AI prompts to build the app visually, you can also open the entire code base in a Visual Studio IDE running a browser (Stackblitz). This enables making changes to the code directly when you need to and you can add additional VS code extensions to keep your programming experience consistent across multiple computing environments.
Bolt.new also has integration with Supabase that lets you create both authentication as well standard backend database CRUD operations but at the time of writing this article I did not see an “out-of-box” integration with a payment system like Polar or Stripe. Finally, they recently added the ability to import a project from Github which means you can bring in an existing application and continue to work in Stackblitz. However, the apps you import into Stackblitz is not something you can use in Bolt.new but this would be a good feature if the creators add in the future.
3. Lovable.dev
Probably the most user friendly for non-coders and low coders, the next full stack AI tool to look at is Lovable.dev. It has very similar features to both Bolt.new and Tempo labs. You can build and deploy an entire app using the AI prompt and one Lovable’s unique feature is to be able to select parts of an app/webpage and request the AI to make very targeted and specific changes. It is also integrated to Supabase for both authentication and database CRUD operations and you can connect your Github repo to the app. This means you can work on your code base outside of Lovable and when you do a push to the main branch, Lovable does an automatic pull so you can go back and forth from either writing code in your code editor or using Lovable’s visual UI prompts.
Others — There are a few other tools just like the three above but in order to not make this article not too unwieldy I will just mention these but not go into details since they are very similar to all the three above:
Replit — Replit agent allows you to build apps using AI prompts and directly deploy to a production server within Replit in a single interface.
Base44 — This is another tool very similar to the ones above but has more bare bones starter template and seems like it is geared more towards more advanced developers.
Now that we have looked at the full stack visual tools, let’s look at some of the code editor tools that have become very popular in making applications. Within this category itself there are either VS code forks or extensions that live within VS code. Personally, I prefer VS code extensions because I can switch tools as needed without changing my experience and I am not locked into one tool or one way of doing things for the same code base.
VS Code Forks
- Cursor — One of the early starters in the vibe coding space, Cursor first started as a way to chat and get code completions and changes. A few weeks later they launched Composer feature that allowed users to directly tell the agents to make the code changes directly and since then this entire space and this tool has evolved significantly. More recently, Cursor also added support for MCP servers so that you can also use it to call other pre-built tools and services to help build an entire app using just AI prompts.
What I don’t like about Cursor is that it has become very complicated with different and often unnecessary bells and whistles and as the codebase becomes bigger and complicated, you now have to maintain rules files and context files to constantly guide Cursor to not mess up and do things that are either not needed or repeat mistakes that were already fixed.
2. Windsurf — Similar to Cursor Windsuft is another VS Code fork and has very similar if not identical features. In terms of user experience, Windsurf comes across better than Cursor but the results you get from the AI models are usually similar given this also does not have constant context of the code base as it continues to grow. Windsurf also has support for MCP servers. One of the new features that Windsurf added which is not currently in Cursor is the ability to preview the app directly in the code editor. This is something, however, I think others will also add to their tools.
3. Trae — Speaking of preview or web view, yet another VS code fork is from the makers of Tiktok called Trae. It has better user experience and a very generous free tier, but it lacks MCP integration features which means you cannot really use only this tool for your entire application build. Not a surprise it also lacks robust context management which means it is not very useful if you are trying to work on a existing code base or if you are working with multiple team members.
Now let’s look at the last category (my favorite) — VS Code extensions. These are AI tools that you can bolt on to your existing coding workflow and add/remove as needed given the fast pace of changes in this area.
VS Code Extensions
Augment is a VS Code extension that integrates with existing repositories by first indexing and then analyzing the codebase. If you are on a free tier it tells you that the tool will use your codebase for their own training which to me is a put off. However, if you are ok with that then once the codebase has been indexed you can use Augment to primarily either ask questions about your code or get code completions. At the time of writing this, Augment did not have an agentic mode nor did it support MCPs.
2. Continue
Continue is similar to Cursor in that it has both a chat mode and an agent mode and it has MCP servers integration. It also has a feature to index your entire codebase but it still requires users to mention files and folders in order to get the right context. What I also like about Continue is that it has MCP integration as well so I can bring in my tools like Brave search and Firecrawl to build additional context.
3. Cline
Cline also has similar if not identical features to Cursor and Windsurf but in a VS Code extension vs an entire VS Code fork. Cline’s agentic features focus on task automation, allowing developers to describe complex tasks that the tool then breaks down and implements step-by-step. For UI modifications, Cline can analyze component structure and suggest changes that maintain visual consistency. What distinguishes Cline is its specialized “code prediction” feature that anticipates what developers might need next based on coding patterns and current context. Having said that I found Cline to be very token hungry which makes it expensive especially if you try to run it in a YOLO (you only live once) mode.
4. Sourcegraph
Probably the best tool for professional grade developers looking to work on existing code bases and multiple team members is Sourcegraph. It offers enterprise-grade repository integration with support for multiple version control systems and large-scale codebases. This means you can connect hundreds of repositories and not only search across them but look for insights and do batch changes like refactoring or updating a library or security fixes etc. Recently it also added a VS code extension — Cody that is integrated with Sourcegraph and you can use it to chat in addition to also doing code completion based on its powerful search and context management features.
What makes Sourcegraph stand out is its “cross-repository awareness” that allows developers to understand how code is used and shared across multiple projects, making it especially valuable for large organizations.
Others — There are two other tools in this space that are similar that are worth mentioning
- Fynix — Fynix distinguishes itself with its “code evolution tracking” feature that helps understand how code has changed over time, making it easier to plan and implement consistent modifications.
- Pythagora
I found Pythagora’s use interface hard to get used to but having said that it is great if you are building a brand-new Node based app. It was not very helpful when I tried it against an existing codebase.
I also found the overall user experience to be extremely confusing.
Finally, let’s look at the last category of standalone tools.
Standalone Tools
Devin connects to existing repositories through a combination of Git integration and specialized code understanding capabilities. Its codebase search and context features are good, with the ability to understand complex project structures and dependencies across large codebases. Devin’s agentic capabilities are its primary strength, allowing it to function as an autonomous developer that can plan, implement, debug, and test code with minimal human intervention. What is different and a little strange about Devin is that you can interface with it only through Slack which means if you are a one-person company, you also need to get Slack.
2. Aider
Meant for more advanced users, Aider, a terminal based tool provides straightforward repository integration through command-line interfaces and Git, making it easy to incorporate into existing development workflows. Its codebase context capabilities focus on understanding local code structure and maintaining consistency with existing patterns. Aider’s agentic capabilities enable it to act as a pair programmer, implementing requested changes while maintaining awareness of the broader codebase context. Its UI modification capabilities are more limited, focusing primarily on functional components rather than design systems. Aider’s distinguishing feature is its conversation-driven development approach, where developers describe changes in natural language and Aider implements them while maintaining a conversational interface for clarifications and revisions.
3. Claude Code
Launched a few days before I started writing this article, Anthropic released Claude Code which is primarily a terminal-based tool. What is unique about Claude Code is that it first “reads and understands” the code base which is then used for the remainder of the session to chat and make changes. It also persists this “memory” in a markdown file that can be modified and used for future sessions.
Claude Code’s agentic capabilities focus on task automation and assistance rather than fully autonomous development. I should mention though that Claude Code is by far the most expensive tool and is a token guzzler. For a simple set of changes that I tested against I saw a token usage of about $5 in a couple of hours. Since this is an Anthropic released tool, I should also mention that it only supports Claude as a model for now.
Conclusion
In this article we saw the different categories of AI tools that can be used for “vibe coding” and each has its pros and cons. The reality is that as of today you cannot just rely on one tool to build and maintain your entire application. I also found most of the tools only geared for Day 0 (new app building) use cases and hopeful for tools like Sourcegraph, Claude Code and Continue to get better at doing Day 1+ coding tasks.
