Welcome to the Vibe Coding Kitchen: Your First Lesson

The following is an excerpt from the forthcoming book Vibe Coding: Building Production-Grade Software With GenAI, Chat, Agents, and Beyond by Gene Kim and Steve Yegge.

Now that we’ve explored the why behind vibe coding, it’s time to roll up our sleeves, step into the kitchen, and get our hands dirty. In this kitchen, you’ll not write code by hand, but as a new head chef, you’ll direct your AI sous chefs and assistants to do it for you. In this chapter, we’re going to equip you with the practical skills and mental models to write small programs, and then we’ll explore larger programs in the next chapter. 

As the person in charge, it’s important to remember that you remain firmly responsible for the menu, the quality control, and the overall vision for what your kitchen produces. You’ll learn that vibe coding is conversational and casual. You frame problems, provide the necessary context, generate solutions with your AI partners, and then rigorously test and refine the output. It’s a dynamic way of solving problems and is a key part of enabling FAAFO.

We’ll walk you through using AI chatbots, coding assistants, coding agents, and multiple concurrent coding agents. It’s fast, conversational, and dynamic, and you’ll get your first FAAFO experience.

Your First Vibe Coding Sessions

We’ve found that understanding vibe coding theory without experiencing it firsthand is like trying to learn cooking from a textbook without ever stepping into a kitchen. You need to feel the conversational flow with your AI collaborator, witness how it responds to your directions, and experience that magical moment when code appears from natural language. That’s why we’re starting Part 2 with hands-on practice rather than abstract concepts.

In this chapter, we’ll walk you through some simple vibe coding sessions using AI chatbots like ChatGPT, Claude, and Gemini, and then move to coding agents (e.g., Claude Code, Sourcegraph Amp, OpenAI Codex, Gemini CLI, etc.). These exercises require no coding knowledge—just the ability to have a conversation. After all, our goal isn’t to teach you coding—it’s to teach vibe coding.

By the end, you’ll have a visceral understanding of what vibe coding feels like, which will make all the theory and advanced techniques in subsequent chapters click into place. Think of it as your first shift in the kitchen with your AI sous chef, where you’ll see that it can turn your words into working code. If you’ve already used these tools extensively, you can skim this chapter (or skip it). But if you’re new to vibe coding, this chapter is a gentle introduction.

We encourage you to complete the exercises in this chapter for yourself, no matter your experience level. It’s just chatting with an AI. The exercises only take a minute or two, and if you use voice dictation, you won’t even need to type—after all, most people can talk faster than they can type, even when describing code.

Let’s Use Claude (or Another Chatbot)

The most accessible entry point to vibe coding is through your web browser—no complex software installation required. (Contrast this to installing Xcode on macOS, which takes an hour, or trying to run two different versions of Python, which can bring even grown-up developers to tears.) Platforms like ChatGPT or Claude offer immediate access to AI coding assistants with free usage tiers sufficient for exploring these exercises. And they provide integrated execution capabilities that can run the code they generate. For instance, ChatGPT offers Code Interpreter, Claude provides Artifacts, and Google Gemini features Canvas. Additionally, comprehensive tools like Replit, Lovable, and Bolt offer such streamlined interfaces that you can effectively code during a casual stroll using your smartphone.

These platforms place your AI-generated code into sandboxed environments where it not only executes but also provides visible output and error messages that the AI can assess. This represents a significant advancement, as it enables AI to address issues without requiring your intervention. The days of manually copying error messages back into chat interfaces are rapidly receding.

For our first vibe coding demonstration, access Claude and enter:

Please write a JavaScript app in an artifacts window that animates a bouncing red sphere. Leave a trail behind it. Add gravity and energy when it hits the floor.

You should see Claude generating the necessary CSS and JavaScript, followed by a bouncing red ball in the right panel. In our tests, Claude created a 3D-shaded sphere with interactive controls for pausing, resetting, and gravity adjustment—features we didn’t ask for but which fortunately turned out to be welcome additions. At the time of this writing, this exercise also worked in Gemini.

Congratulations—you’ve completed your first vibe coding session. While you haven’t executed the code yet, you’ve still taken a significant first step. You’ve gotten your AI assistant to generate code according to your spec, and it provided explanations tailored to your knowledge level. 

When vibe coding, memorizing programming syntax and arcane commands becomes unnecessary. Your AI assistant stands ready to clarify concepts throughout the process. The essential skill becomes mastering effective communication with your AI partner. 

Note that you also didn’t have to learn about JavaScript asynchronous programming models, how to set an interrupt timer, how to manage the HTML5 Canvas drawing context and its various rendering methods, how to calculate physics equations for realistic motion and collision detection, and all that other crap you don’t care about. You want to see a bouncing ball. This is why vibe coding is taking off—it spares you from all that underlying cruft.

To further explore these capabilities, try these progressive requests:

• “Make the ball green and make it 3x larger.”
• “Add another ball.”
• “Can we turn it into a game?”
• “Explain in simple terms how the app’s gravity works.” (Seriously, when Steve generated this program, he was surprised that it came up with such an elegant gravity model that didn’t involve multiplication. He had to ask it to explain how it was computing using only addition.)

If this feels too simple, try something like Steve’s story about graphics programming in Part 1.

Write a JavaScript program that shows a cube with a colored light source; create slider bars that can change orientation of the polygon.

This will take a bit longer (maybe two minutes), because your AI collaborator will generate hundreds of lines of JavaScript and CSS. But that is still a lot faster than the two weeks it took Steve and Gene to write a similar program by hand in the 1990s. In Gemini, in the right-hand window, it rendered the image below. (At the time of this writing, this also worked with Claude, but not ChatGPT.)

Let’s try a data visualization to explore a more analytical application. Let’s generate a graph using real data about the exponential growth of photographs taken per year, which we discussed in Part 1. Let’s use Claude 4, which can search the web for data by using this prompt, though you could also use Gemini or ChatGPT.

Please generate a bar chart visualization of the number of photographs taken (estimated) in 5-year intervals for the last 50 years.

You’ll receive a complete visualization (see image below) with all underlying code—transforming data into visual insights without writing a single line of code yourself. It will start generating right away, but it may take some time to complete the program, perhaps a few minutes. In the end, you have a working program that generates your chart. You might say, “Hey, that’s not vibe coding.” But this graph was rendered from Claude by finding all that data and then generating three hundred lines of JavaScript and CSS to render it. 

Interactive Programs: The Engaging Dimension of Vibe Coding

Now let’s explore something more interactive that demonstrates the system’s capabilities. Enter this prompt in Claude or Gemini:

Please create a simple Flappy Bird-like game that I can play in the browser. Make it look nice with some basic styling.

Your AI collaborator should generate a complete, playable implementation with all necessary HTML, CSS, and JavaScript. This shows how fast you can create sophisticated interactive applications without manual coding. And Flappy Bird is just a suggestion. We encourage you to experiment with various game concepts to test the boundaries of one-prompt generation.

We tried this exercise with Claude 4 and Gemini 2.5 Flash as we were going to print, and despite everything we’ve seen and learned, we were both still stunned by the game Claude cranked out, complete with title and ending screens, score displays, and a playable game.

As we’ll elaborate on later, these “one-shot wonders” succeed in part because AI training data contains numerous implementations of these classic games. It’s unintuitive, but AI can generate functional games from broad, ambiguous prompts like “create a WWII flight simulator,” yet sometimes struggles with what seem like technically simpler challenges. A good amount of this book is devoted to helping you develop the right intuitions. But when you’re getting started, it’s great fun and good practice to create your own apps with one-shot prompting.

If your generated game has any bugs or issues, you can describe what you’re seeing to your AI assistant, which will often fix it automatically. Mentioning a problem can often prompt an immediate fix from the AI. In later sections, we’ll explore techniques that allow AI to assess outputs independently, eliminating the need for you to serve as its visual interpreter.

For your amusement, you may try some of these follow-up prompts:

• “Make the game more playable by slowing it down.”
• “Add clouds.”
• For fun: “Make it better.” (This is not an especially specific prompt, and therefore not applicable to some engineering problems. But still, see what it does.)

You can create complete, functional applications within chatbot environments without writing code yourself. While your AI assistant manages implementation details, you get to focus on conceptual direction and creative decisions. If you experiment, you’ll discover the current constraints of one-prompt development—a topic we’ll address comprehensively in upcoming chapters.

When to Ask AI to Help

Besides assisting with code generation, here are some practical ways we’ve found to stay in flow—that magical state developers get into when things are going smoothly—when using vibe coding for real engineering work. You stay in flow by vibe coding everything you possibly can. For example:

• Starting a new task? Bounce your problem off your AI assistant. See if it can come up with a better plan than yours. This is how many vibe coding sessions start.
• Generated working code? Ask AI to spot edge cases. Take advantage of being in the flow state to make your code more robust.
• Need tests? Ask AI to create a test plan and write tests. Writing tests is easy, and your AI won’t get annoyed by all the edge cases you want it to cover.
• Fixed a bug? Have AI document why your fix works for the changelog.
• Reading docs? You can have AI read it for you and give you the summary by putting in the URL or attaching it.
• Reading or reviewing code? Use AI as a second pair of eyes and ask it to critique or explain the code. Feel free to ask lots of questions, because AI will never get frustrated or bored.
• Stuck on configuring software? Have you put off trying to get something fixed on your laptop? Much of modern development involves setting up the environment, which is not always easy to do. And it can take you out of flow. Have AI walk you through how to do it and stay in flow.

AI can help with a wide variety of tasks, and it will never be bothered by how many times you ask it the same question or how many times you ask “why” or “I still don’t understand. Can you please explain it again?” AI is infinitely patient.

Strangely enough, this is a new skill for many of us to learn. You can get AI to perform all the small details of nearly any task, but you have to learn how to ask properly—and then remember to ask. 

Once you’ve mastered this skill, you can start focusing on what you want to build and making sure AI builds it the way you want.

More Suggested Exercises

• Conduct a vibe coding session with someone else: Take two hours and build something real. You drive; they watch. Then write down anything cool you learned about vibe coding while pairing. Now do the same thing, except build something else, and this time, your pair partner drives the pairing session while you watch.
• Conduct a vibe session with more than two people: See who can build a given application the fastest without necessarily understanding any of the code. Or work on different things. 
• Install ChatGPT on your phone and try Gene’s favorite way of using it—Voice Mode: Click the black button on the right (next to the button with the microphone icon) and start asking it questions. For example: “Teach me about the various ways I could write a game in JavaScript that runs in the browser.” (You can even do this while walking your dog.)

We can’t emphasize enough the value of these “group learning sessions” with two humans and two AIs. This space is so new that you’ll learn things every time you watch someone. This has been the case for us, for trusted colleagues we’ve spoken with, and we’re sure it will be true for you too.

Conclusion

You’ve finished your first shift in the vibe coding kitchen, and hopefully you’ve experienced that magical moment when natural language transforms into working code. Through these simple exercises—from bouncing balls to flappy bird games—you’ve discovered that programming no longer requires memorizing syntax or wrestling with development environments. You’ve learned to direct your AI assistant through conversation, staying in flow while it handles the implementation details.

This taste of vibe coding sets the stage for mastering the full range of techniques you’ll need as a head chef in your own coding kitchen. In the following chapters, we’ll explore:

• Real-world vibe coding sessions with increasingly complex challenges.
• The art of conversational programming—how to communicate effectively with your AI partners.
• Context-management strategies for keeping your AI informed without overwhelming it.
• The head chef mindset that keeps you focused on vision and quality while delegating execution.
• Common pitfalls where AIs confidently serve up nonsense, and how to catch them before they ruin your dish.

Stay tuned for more exclusive excerpts from the upcoming book Vibe Coding: Building Production-Grade Software With GenAI, Chat, Agents, and Beyond by Gene Kim and Steve Yegge on this blog or by signing up for the IT Revolution newsletter.

- About The Authors

Gene Kim

Gene Kim has been studying high-performing technology organizations since 1999. He was the founder and CTO of Tripwire, Inc., an enterprise security software company, where he served for 13 years. His books have sold over 1 million copies—he is the WSJ bestselling author of Wiring the Winning Organization, The Unicorn Project, and co-author of The Phoenix Project, The DevOps Handbook, and the Shingo Publication Award-winning Accelerate. Since 2014, he has been the organizer of DevOps Enterprise Summit (now Enterprise Technology Leadership Summit), studying the technology transformations of large, complex organizations.

Follow Gene on Social Media

• 
• 

Steve Yegge

Steve Yegge is an American computer programmer and blogger known for writing about programming languages, productivity, and software culture for two decades. He has spent over thirty years in the industry, split evenly between dev and leadership roles, including nineteen years combined at Google and Amazon. Steve has written over a million lines of production code in a dozen languages, has helped build and launch many large production systems at big tech companies, has led multiple teams of up to 150 people, and has spent much of his career relentlessly focused on making himself and other developers faster and better. He is currently an Engineer at Sourcegraph working on AI coding assistants.

Follow Steve on Social Media

•