๐ *Gen AI Engineer (Production Focused)* ๐ง What is Vibe Coding?
Vibe coding is a software development practice where you use a generative AI (like an LLM or chatbot) to write, debug, and refine code.
Instead of writing every line of code yourself, you act as a director or guide. You describe your goal in plain, natural language (the “vibe”) and the AI generates the code for you. Your job is to test the code and give the AI feedback until the application works exactly as you want.
This approach shifts the focus from manually writing syntax (the “how”) to defining the desired outcome (the “what”).
๐ A Simple Example (The “Vibe Coding” Workflow)
Let’s say you want to build a simple web page with a button that changes the color of some text. You don’t need to know HTML, CSS, or JavaScript.
Step 1: The Initial “Vibe” (Your First Prompt)
You: “Create a simple HTML file. It should have a heading that says ‘Hello World!’ and a button that says ‘Click Me’.”
The AI generates the initial code. You run it, and it works.
Step 2: The Refinement (Adding Functionality)
You: “That’s great. Now, make it so when I click the ‘Click M’ button, the ‘Hello World!’ text changes to the color red.”
The AI generates new code, adding JavaScript to handle the click event. You test it, and it works.
Step 3: The Second Refinement (Iterating)
You: “Okay, I’d like to improve this. Can you make it a toggle? The first click turns the text red, the second click turns it back to black, the third turns it red again, and so on.”
The AI modifies the code again, adding logic to check the current color and toggle it.
Step 4: The Final Polish (Fixing “Bugs”)
You: “This is almost perfect, but when the page first loads, the text is red. I want it to be black until the first click.”
The AI makes the final adjustment.
In this entire process, you didn’t write a single line of code. You simply “vibe checked” the AI’s output and gave it corrective instructions in plain English.
๐ก Another Example (Data Handling)
A more technical user, like a data analyst, might use vibe coding this way:
- Prompt 1: “Write a Python function using the
pandaslibrary. It needs to read a CSV file namedusers.csvand return a list of all email addresses from the ‘Email’ column.” - Prompt 2 (Refine): “That works, but now modify the function to also accept a
domain_filterargument. If that argument is provided (like ‘gmail.com’), it should only return emails that end with that specific domain.” - Prompt 3 (Debug): “When I try to run this on a file that doesn’t exist, the whole program crashes. Can you add error handling to catch a
FileNotFoundErrorand print a friendly message instead?”
Key Characteristics of Vibe Coding
- Natural Language: Your primary tool is plain English, not a programming language.
- Iterative: It’s a back-and-forth conversation. You prompt, test, and refine.
- High-Level Focus: You worry about the big picture (“I need a login page”) rather than the low-level details (“I need a text input field with
id='username'“). - Low Barrier to Entry: It allows people with little to no coding experience (like marketers, designers, or product managers) to build simple applications and prototypes.
- Risks: Because the AI generates the code, it can sometimes produce inefficient, buggy, or insecure code. The developer might not fully understand how it works, making it difficult to maintain or fix complex issues later. It’s often best for rapid prototyping or low-stakes projects.
๐ง เฐตเฑเฐฌเฑ เฐเฑเฐกเฐฟเฐเฐเฑ (Vibe Coding) เฐ เฐเฐเฑ เฐเฐฎเฐฟเฐเฐฟ?
เฐตเฑเฐฌเฑ เฐเฑเฐกเฐฟเฐเฐเฑ เฐ เฐจเฑเฐฆเฐฟ เฐเฐ เฐเฐงเฑเฐจเฐฟเฐ เฐธเฐพเฐซเฑเฐเฑโเฐตเฑเฐฐเฑ เฐกเฑเฐตเฐฒเฐชเฑโเฐฎเฑเฐเฐเฑ เฐชเฐฆเฑเฐงเฐคเฐฟ. เฐเฐเฐฆเฑเฐฒเฑ เฐฎเฑเฐฐเฑ เฐเฑเฐกเฑ เฐฐเฐพเฐฏเฐกเฐพเฐจเฐฟเฐเฐฟ, เฐกเฑเฐฌเฐเฑ เฐเฑเฐฏเฐกเฐพเฐจเฐฟเฐเฐฟ เฐฎเฐฐเฐฟเฐฏเฑ เฐฎเฑเฐฐเฑเฐเฑเฐชเฐฐเฐเฐกเฐพเฐจเฐฟเฐเฐฟ เฐเฐ เฐเฑเฐจเฐฐเฑเฐเฐฟเฐตเฑ AI (LLM เฐฒเฑเฐฆเฐพ เฐเฐพเฐเฑโเฐฌเฐพเฐเฑ เฐตเฐเฐเฐฟเฐตเฐฟ)เฐจเฑ เฐเฐชเฐฏเฑเฐเฐฟเฐธเฑเฐคเฐพเฐฐเฑ.
เฐชเฑเฐฐเฐคเฐฟ เฐฒเฑเฐจเฑ เฐเฑเฐกเฑโเฐจเฑ เฐฎเฑเฐฐเฑ เฐธเฑเฐตเฐฏเฐเฐเฐพ เฐตเฑเฐฐเฐพเฐฏเฐกเฐพเฐจเฐฟเฐเฐฟ เฐฌเฐฆเฑเฐฒเฑเฐเฐพ, เฐฎเฑเฐฐเฑ เฐเฐ เฐกเฑเฐฐเฑเฐเฑเฐเฐฐเฑ เฐฒเฑเฐฆเฐพ เฐฎเฐพเฐฐเฑเฐเฐฆเฐฐเฑเฐถเฐฟเฐเฐพ เฐตเฑเฐฏเฐตเฐนเฐฐเฐฟเฐธเฑเฐคเฐพเฐฐเฑ. เฐฎเฑเฐฐเฑ เฐฎเฑ เฐฒเฐเฑเฐทเฑเฐฏเฐพเฐจเฑเฐจเฐฟ เฐธเฐพเฐงเฐพเฐฐเฐฃ, เฐธเฐนเฐเฐฎเฑเฐจ เฐญเฐพเฐทเฐฒเฑ (“เฐตเฑเฐฌเฑ”) เฐตเฐฟเฐตเฐฐเฐฟเฐธเฑเฐคเฐพเฐฐเฑ เฐฎเฐฐเฐฟเฐฏเฑ AI เฐฎเฑ เฐเฑเฐธเฐ เฐเฑเฐกเฑโเฐจเฑ เฐเฐคเฑเฐชเฐคเฑเฐคเฐฟ เฐเฑเฐธเฑเฐคเฑเฐเฐฆเฐฟ. เฐ เฐเฑเฐกเฑโเฐจเฑ เฐชเฐฐเฑเฐเฑเฐทเฐฟเฐเฐเฐกเฐ เฐฎเฐฐเฐฟเฐฏเฑ เฐฎเฑเฐเฑ เฐเฐพเฐตเฐฒเฐธเฐฟเฐจ เฐตเฐฟเฐงเฐเฐเฐพ เฐ เฐชเฑเฐฒเฐฟเฐเฑเฐทเฐจเฑ เฐชเฐจเฐฟเฐเฑเฐธเฑ เฐตเฐฐเฐเฑ AIเฐเฐฟ เฐซเฑเฐกเฑโเฐฌเฑเฐฏเฐพเฐเฑ เฐเฐตเฑเฐตเฐกเฐ เฐฎเฑ เฐชเฐจเฐฟ.
เฐ เฐตเฐฟเฐงเฐพเฐจเฐ, เฐธเฐฟเฐเฐเฐพเฐเฑเฐธเฑโเฐจเฑ เฐฎเฐพเฐจเฑเฐฏเฑเฐตเฐฒเฑโเฐเฐพ เฐตเฑเฐฐเฐพเฐฏเฐกเฐ (เฐฆเฐฟ “เฐนเฑ”) เฐจเฑเฐเฐกเฐฟ, เฐเฐพเฐตเฐฒเฐธเฐฟเฐจ เฐซเฐฒเฐฟเฐคเฐพเฐจเฑเฐจเฐฟ เฐจเฐฟเฐฐเฑเฐตเฐเฐฟเฐเฐเฐกเฐ (เฐฆเฐฟ “เฐตเฐพเฐเฑ”) เฐตเฑเฐชเฑ เฐฆเฑเฐทเฑเฐเฐฟเฐจเฐฟ เฐฎเฐณเฑเฐฒเฐฟเฐธเฑเฐคเฑเฐเฐฆเฐฟ.
๐ เฐเฐ เฐธเฐพเฐงเฐพเฐฐเฐฃ เฐเฐฆเฐพเฐนเฐฐเฐฃ (“เฐตเฑเฐฌเฑ เฐเฑเฐกเฐฟเฐเฐเฑ” เฐตเฐฐเฑเฐเฑโเฐซเฑเฐฒเฑ)
เฐฎเฑเฐฐเฑ เฐเฐ เฐฌเฐเฐจเฑโเฐคเฑ เฐเฑเฐกเฐฟเฐจ เฐธเฐพเฐงเฐพเฐฐเฐฃ เฐตเฑเฐฌเฑ เฐชเฑเฐเฑเฐจเฐฟ เฐฐเฑเฐชเฑเฐเฐฆเฐฟเฐเฐเฐพเฐฒเฐจเฑเฐเฑเฐเฐเฑเฐจเฑเฐจเฐพเฐฐเฐจเฐฟ เฐ เฐจเฑเฐเฑเฐเฐฆเฐพเฐ. เฐ เฐฌเฐเฐจเฑ เฐจเฑเฐเฑเฐเฐฟเฐจเฐชเฑเฐชเฑเฐกเฑ เฐเฑเฐเฐค เฐเฑเฐเฑเฐธเฑเฐเฑ เฐฐเฐเฐเฑ เฐฎเฐพเฐฐเฐพเฐฒเฐฟ. เฐฆเฑเฐจเฐฟ เฐเฑเฐธเฐ เฐฎเฑเฐเฑ HTML, CSS เฐฒเฑเฐฆเฐพ เฐเฐพเฐตเฐพเฐธเฑเฐเฑเฐฐเฐฟเฐชเฑเฐเฑ เฐคเฑเฐฒเฐฟเฐธเฐฟ เฐเฐเฐกเฐพเฐฒเฑเฐธเฐฟเฐจ เฐ เฐตเฐธเฐฐเฐ เฐฒเฑเฐฆเฑ.
เฐฆเฐถ 1: เฐชเฑเฐฐเฐพเฐฐเฐเฐญ “เฐตเฑเฐฌเฑ” (เฐฎเฑ เฐฎเฑเฐฆเฐเฐฟ เฐชเฑเฐฐเฐพเฐเฐชเฑเฐเฑ)
เฐฎเฑเฐฐเฑ: “เฐเฐ เฐธเฐพเฐงเฐพเฐฐเฐฃ HTML เฐซเฑเฐฒเฑโเฐจเฑ เฐธเฑเฐทเฑเฐเฐฟเฐเฐเฑ. เฐ เฐเฐฆเฑเฐฒเฑ ‘Hello World!’ เฐ เฐจเฐฟ เฐเฐ เฐนเฑเฐกเฑเฐกเฐฟเฐเฐเฑ เฐฎเฐฐเฐฟเฐฏเฑ ‘Click Me’ เฐ เฐจเฐฟ เฐเฐ เฐฌเฐเฐจเฑ เฐเฐเฐกเฐพเฐฒเฐฟ.”
AI เฐชเฑเฐฐเฐพเฐฐเฐเฐญ เฐเฑเฐกเฑโเฐจเฑ เฐเฐคเฑเฐชเฐคเฑเฐคเฐฟ เฐเฑเฐธเฑเฐคเฑเฐเฐฆเฐฟ. เฐฎเฑเฐฐเฑ เฐฆเฐพเฐจเฑเฐจเฐฟ เฐฐเฐจเฑ เฐเฑเฐธเฑเฐคเฐพเฐฐเฑ, เฐ เฐฆเฐฟ เฐชเฐจเฐฟเฐเฑเฐธเฑเฐคเฑเฐเฐฆเฐฟ.
เฐฆเฐถ 2: เฐฎเฑเฐฐเฑเฐเฑเฐฆเฐฒ (เฐซเฐเฐเฑเฐทเฐจเฐพเฐฒเฐฟเฐเฑเฐจเฐฟ เฐเฑเฐกเฐฟเฐเฐเฐกเฐ)
เฐฎเฑเฐฐเฑ: “เฐเฐฆเฐฟ เฐเฐพเฐฒเฐพ เฐฌเฐพเฐเฑเฐเฐฆเฐฟ. เฐเฐชเฑเฐชเฑเฐกเฑ, เฐจเฑเฐจเฑ ‘Click Me’ เฐฌเฐเฐจเฑโเฐจเฑ เฐเฑเฐฒเฐฟเฐเฑ เฐเฑเฐธเฐฟเฐจเฐชเฑเฐชเฑเฐกเฑ, ‘Hello World!’ เฐเฑเฐเฑเฐธเฑเฐเฑ เฐเฐฐเฑเฐชเฑ เฐฐเฐเฐเฑเฐฒเฑเฐเฐฟ เฐฎเฐพเฐฐเฑเฐฒเฐพ เฐเฑเฐฏเฑเฐฏเฐฟ.”
AI เฐเฑเฐคเฑเฐค เฐเฑเฐกเฑโเฐจเฑ เฐเฐคเฑเฐชเฐคเฑเฐคเฐฟ เฐเฑเฐธเฑเฐคเฑเฐเฐฆเฐฟ, เฐเฑเฐฒเฐฟเฐเฑ เฐเฐตเฑเฐเฐเฑโเฐจเฑ เฐจเฐฟเฐฐเฑเฐตเฐนเฐฟเฐเฐเฐกเฐพเฐจเฐฟเฐเฐฟ เฐเฐพเฐตเฐพเฐธเฑเฐเฑเฐฐเฐฟเฐชเฑเฐเฑโเฐจเฑ เฐเฑเฐกเฐฟเฐธเฑเฐคเฑเฐเฐฆเฐฟ. เฐฎเฑเฐฐเฑ เฐฆเฐพเฐจเฑเฐจเฐฟ เฐชเฐฐเฑเฐเฑเฐทเฐฟเฐธเฑเฐคเฐพเฐฐเฑ, เฐ เฐฆเฐฟ เฐชเฐจเฐฟเฐเฑเฐธเฑเฐคเฑเฐเฐฆเฐฟ.
เฐฆเฐถ 3: เฐฐเฑเฐเฐกเฐต เฐฎเฑเฐฐเฑเฐเฑเฐฆเฐฒ (เฐฎเฐณเฑเฐฒเฑ เฐฎเฐพเฐฐเฑเฐชเฑเฐฒเฑ เฐเฑเฐฏเฐกเฐ)
เฐฎเฑเฐฐเฑ: “เฐธเฐฐเฑ, เฐจเฑเฐจเฑ เฐฆเฑเฐจเฑเฐจเฐฟ เฐฎเฐฐเฐฟเฐเฐค เฐฎเฑเฐฐเฑเฐเฑเฐชเฐฐเฐเฐพเฐฒเฐจเฑเฐเฑเฐเฐเฑเฐจเฑเฐจเฐพเฐจเฑ. เฐฆเฑเฐจเฑเฐจเฐฟ เฐเฑเฐเฑเฐฒเฑโเฐเฐพ (toggle) เฐฎเฐพเฐฐเฑเฐเฐเฐฒเฐตเฐพ? เฐฎเฑเฐฆเฐเฐฟ เฐเฑเฐฒเฐฟเฐเฑโเฐเฑ เฐเฑเฐเฑเฐธเฑเฐเฑ เฐเฐฐเฑเฐชเฑ เฐฐเฐเฐเฑเฐฒเฑเฐเฐฟ เฐฎเฐพเฐฐเฐพเฐฒเฐฟ, เฐฐเฑเฐเฐกเฐต เฐเฑเฐฒเฐฟเฐเฑโเฐเฑ เฐคเฐฟเฐฐเฐฟเฐเฐฟ เฐจเฐฒเฑเฐชเฑ เฐฐเฐเฐเฑเฐฒเฑเฐเฐฟ เฐฎเฐพเฐฐเฐพเฐฒเฐฟ, เฐฎเฑเฐกเฐต เฐเฑเฐฒเฐฟเฐเฑโเฐเฑ เฐฎเฐณเฑเฐฒเฑ เฐเฐฐเฑเฐชเฑ เฐฐเฐเฐเฑเฐฒเฑเฐเฐฟ เฐฎเฐพเฐฐเฐพเฐฒเฐฟ, เฐ เฐฒเฐพ เฐเฑเฐจเฐธเฐพเฐเฐพเฐฒเฐฟ.”
AI เฐฎเฐณเฑเฐฒเฑ เฐเฑเฐกเฑโเฐจเฑ เฐธเฐตเฐฐเฐฟเฐธเฑเฐคเฑเฐเฐฆเฐฟ, เฐชเฑเฐฐเฐธเฑเฐคเฑเฐค เฐฐเฐเฐเฑเฐจเฑ เฐคเฐจเฐฟเฐเฑ เฐเฑเฐธเฐฟ, เฐฆเฐพเฐจเฐฟเฐจเฐฟ เฐเฑเฐเฑเฐฒเฑ เฐเฑเฐฏเฐกเฐพเฐจเฐฟเฐเฐฟ เฐฒเฐพเฐเฐฟเฐเฑโเฐจเฑ เฐเฑเฐกเฐฟเฐธเฑเฐคเฑเฐเฐฆเฐฟ.
เฐฆเฐถ 4: เฐคเฑเฐฆเฐฟ เฐฎเฑเฐฐเฑเฐเฑเฐฒเฑ (เฐฌเฐเฑเฐธเฑ เฐธเฐฐเฐฟเฐเฑเฐฏเฐกเฐ)
เฐฎเฑเฐฐเฑ: “เฐเฐฆเฐฟ เฐฆเฐพเฐฆเฐพเฐชเฑ เฐเฐเฑเฐเฐฟเฐคเฐเฐเฐพ เฐเฐเฐฆเฐฟ, เฐเฐพเฐจเฑ เฐชเฑเฐเฑ เฐฎเฑเฐฆเฐ เฐฒเฑเฐกเฑ เฐ เฐฏเฐฟเฐจเฐชเฑเฐชเฑเฐกเฑ, เฐเฑเฐเฑเฐธเฑเฐเฑ เฐเฐฐเฑเฐชเฑ เฐฐเฐเฐเฑเฐฒเฑ เฐเฐเฐเฑเฐเฐฆเฐฟ. เฐจเฐพเฐเฑ เฐฎเฑเฐฆเฐเฐฟ เฐเฑเฐฒเฐฟเฐเฑ เฐตเฐฐเฐเฑ เฐ เฐฆเฐฟ เฐจเฐฒเฑเฐชเฑ เฐฐเฐเฐเฑเฐฒเฑ เฐเฐเฐกเฐพเฐฒเฐฟ.”
AI เฐ เฐเฐฟเฐตเฐฐเฐฟ เฐธเฐฐเฑเฐฆเฑเฐฌเฐพเฐเฑ เฐเฑเฐธเฑเฐคเฑเฐเฐฆเฐฟ.
เฐ เฐฎเฑเฐคเฑเฐคเฐ เฐชเฑเฐฐเฐเฑเฐฐเฐฟเฐฏเฐฒเฑ, เฐฎเฑเฐฐเฑ เฐเฐเฑเฐ เฐฒเฑเฐจเฑ เฐเฑเฐกเฑ เฐเฑเฐกเฐพ เฐตเฑเฐฐเฐพเฐฏเฐฒเฑเฐฆเฑ. เฐฎเฑเฐฐเฑ เฐเฑเฐตเฐฒเฐ AI เฐฏเฑเฐเฑเฐ เฐ เฐตเฑเฐเฑโเฐชเฑเฐเฑโเฐจเฑ “เฐตเฑเฐฌเฑ เฐเฑเฐเฑ” เฐเฑเฐธเฐพเฐฐเฑ เฐฎเฐฐเฐฟเฐฏเฑ เฐฆเฐพเฐจเฐฟเฐเฐฟ เฐธเฐพเฐงเฐพเฐฐเฐฃ เฐเฐเฐเฑเฐฒเฐเฐฒเฑ (เฐฒเฑเฐฆเฐพ เฐคเฑเฐฒเฑเฐเฑเฐฒเฑ) เฐฆเฐฟเฐฆเฑเฐฆเฑเฐฌเฐพเฐเฑ เฐธเฑเฐเฐจเฐฒเฑ เฐเฐเฑเฐเฐพเฐฐเฑ.
๐ก เฐฎเฐฐเฑ เฐเฐฆเฐพเฐนเฐฐเฐฃ (เฐกเฑเฐเฐพ เฐนเฑเฐฏเฐพเฐเฐกเฑเฐฒเฐฟเฐเฐเฑ)
เฐกเฑเฐเฐพ เฐ เฐจเฐฒเฐฟเฐธเฑเฐเฑ เฐตเฐเฐเฐฟ เฐธเฐพเฐเฐเฑเฐคเฐฟเฐ เฐตเฐฟเฐจเฐฟเฐฏเฑเฐเฐฆเฐพเฐฐเฑเฐกเฑ เฐตเฑเฐฌเฑ เฐเฑเฐกเฐฟเฐเฐเฑโเฐจเฑ เฐ เฐตเฐฟเฐงเฐเฐเฐพ เฐเฐชเฐฏเฑเฐเฐฟเฐเฐเฐตเฐเฑเฐเฑ:
- เฐชเฑเฐฐเฐพเฐเฐชเฑเฐเฑ 1: “
pandasเฐฒเฑเฐฌเฑเฐฐเฐฐเฑเฐจเฐฟ เฐเฐชเฐฏเฑเฐเฐฟเฐเฐเฐฟ เฐเฐ เฐชเฑเฐฅเฐพเฐจเฑ เฐซเฐเฐเฑเฐทเฐจเฑ เฐฐเฐพเฐฏเฐฟ. เฐเฐฆเฐฟusers.csvเฐ เฐจเฑ CSV เฐซเฑเฐฒเฑโเฐจเฑ เฐเฐฆเฐฟเฐตเฐฟ, ‘Email’ เฐเฐพเฐฒเฐฎเฑ เฐจเฑเฐเฐกเฐฟ เฐ เฐจเฑเฐจเฐฟ เฐเฐฎเฑเฐฏเฐฟเฐฒเฑ เฐเฐฟเฐฐเฑเฐจเฐพเฐฎเฐพเฐฒ เฐเฐพเฐฌเฐฟเฐคเฐพเฐจเฑ เฐคเฐฟเฐฐเฐฟเฐเฐฟ เฐเฐตเฑเฐตเฐพเฐฒเฐฟ.” - เฐชเฑเฐฐเฐพเฐเฐชเฑเฐเฑ 2 (เฐฎเฑเฐฐเฑเฐเฑเฐฆเฐฒ): “เฐ
เฐฆเฐฟ เฐชเฐจเฐฟเฐเฑเฐธเฑเฐคเฑเฐเฐฆเฐฟ, เฐเฐพเฐจเฑ เฐเฐชเฑเฐชเฑเฐกเฑ
domain_filterเฐ เฐจเฑ เฐเฐฐเฑเฐเฑเฐฏเฑเฐฎเฑเฐเฐเฑโเฐจเฑ เฐเฑเฐกเฐพ เฐ เฐเฐเฑเฐเฐฐเฐฟเฐเฐเฑเฐฒเฐพ เฐซเฐเฐเฑเฐทเฐจเฑโเฐจเฑ เฐธเฐตเฐฐเฐฟเฐเฐเฑ. เฐ เฐเฐฐเฑเฐเฑเฐฏเฑเฐฎเฑเฐเฐเฑ เฐ เฐเฐฆเฐฟเฐธเฑเฐคเฑ (เฐเฐฆเฐพเฐนเฐฐเฐฃเฐเฑ ‘gmail.com’), เฐ เฐฆเฐฟ เฐเฑเฐตเฐฒเฐ เฐ เฐกเฑเฐฎเฑเฐจเฑโเฐคเฑ เฐฎเฑเฐเฐฟเฐธเฑ เฐเฐฎเฑเฐฏเฐฟเฐฒเฑโเฐฒเฐจเฑ เฐฎเฐพเฐคเฑเฐฐเฐฎเฑ เฐคเฐฟเฐฐเฐฟเฐเฐฟ เฐเฐตเฑเฐตเฐพเฐฒเฐฟ.” - เฐชเฑเฐฐเฐพเฐเฐชเฑเฐเฑ 3 (เฐกเฑเฐฌเฐเฑ): “เฐจเฑเฐจเฑ เฐเฐจเฐฟเฐเฐฟเฐฒเฑ เฐฒเฑเฐจเฐฟ เฐซเฑเฐฒเฑโเฐฒเฑ เฐฆเฑเฐจเฑเฐจเฐฟ เฐฐเฐจเฑ เฐเฑเฐฏเฐกเฐพเฐจเฐฟเฐเฐฟ เฐชเฑเฐฐเฐฏเฐคเฑเฐจเฐฟเฐเฐเฐฟเฐจเฐชเฑเฐชเฑเฐกเฑ, เฐฎเฑเฐคเฑเฐคเฐ เฐชเฑเฐฐเฑเฐเฑเฐฐเฐพเฐฎเฑ เฐเฑเฐฐเฐพเฐทเฑ เฐ
เฐตเฑเฐคเฑเฐเฐฆเฐฟ.
FileNotFoundErrorเฐจเฑ เฐชเฐเฑเฐเฑเฐเฑเฐตเฐกเฐพเฐจเฐฟเฐเฐฟ เฐเฐฐเฑเฐฐเฐฐเฑ เฐนเฑเฐฏเฐพเฐเฐกเฑเฐฒเฐฟเฐเฐเฑโเฐจเฑ เฐเฑเฐกเฐฟเฐเฐเฐฟ, เฐฌเฐฆเฑเฐฒเฑเฐเฐพ เฐธเฑเฐจเฑเฐนเฐชเฑเฐฐเฑเฐตเฐ เฐธเฐเฐฆเฑเฐถเฐพเฐจเฑเฐจเฐฟ เฐชเฑเฐฐเฐฟเฐเฐเฑ เฐเฑเฐฏเฐเฐฒเฐตเฐพ?”
เฐตเฑเฐฌเฑ เฐเฑเฐกเฐฟเฐเฐเฑ เฐฏเฑเฐเฑเฐ เฐฎเฑเฐเฑเฐฏ เฐฒเฐเฑเฐทเฐฃเฐพเฐฒเฑ
- เฐธเฐนเฐ เฐญเฐพเฐท: เฐฎเฑ เฐชเฑเฐฐเฐพเฐฅเฐฎเฐฟเฐ เฐธเฐพเฐงเฐจเฐ เฐชเฑเฐฐเฑเฐเฑเฐฐเฐพเฐฎเฐฟเฐเฐเฑ เฐญเฐพเฐท เฐเฐพเฐฆเฑ, เฐธเฐพเฐงเฐพเฐฐเฐฃ เฐตเฐพเฐกเฑเฐ เฐญเฐพเฐท.
- เฐชเฑเฐจเฐฐเฐพเฐตเฑเฐคเฐ (Iterative): เฐเฐฆเฐฟ เฐเฐ เฐธเฐเฐญเฐพเฐทเฐฃ เฐฒเฐพเฐเฐเฐฟเฐฆเฐฟ. เฐฎเฑเฐฐเฑ เฐชเฑเฐฐเฐพเฐเฐชเฑเฐเฑ เฐเฐธเฑเฐคเฐพเฐฐเฑ, เฐชเฐฐเฑเฐเฑเฐทเฐฟเฐธเฑเฐคเฐพเฐฐเฑ เฐฎเฐฐเฐฟเฐฏเฑ เฐฎเฑเฐฐเฑเฐเฑเฐชเฐฐเฑเฐธเฑเฐคเฐพเฐฐเฑ.
- เฐเฐจเฑเฐจเฐค-เฐธเฑเฐฅเฐพเฐฏเฐฟ เฐฆเฑเฐทเฑเฐเฐฟ: เฐฎเฑเฐฐเฑ เฐเฐฟเฐจเฑเฐจ เฐตเฐฟเฐตเฐฐเฐพเฐฒ เฐเฑเฐฐเฐฟเฐเฐเฐฟ เฐเฐพเฐเฑเฐเฐกเฐพ (“เฐจเฐพเฐเฑ
id='username'เฐคเฑ เฐเฑเฐเฑเฐธเฑเฐเฑ เฐเฐจเฑโเฐชเฑเฐเฑ เฐซเฑเฐฒเฑเฐกเฑ เฐเฐพเฐตเฐพเฐฒเฐฟ”) เฐชเฑเฐฆเฑเฐฆ เฐเฐฟเฐคเฑเฐฐเฐ เฐเฑเฐฐเฐฟเฐเฐเฐฟ (“เฐจเฐพเฐเฑ เฐฒเฐพเฐเฐฟเฐจเฑ เฐชเฑเฐเฑ เฐเฐพเฐตเฐพเฐฒเฐฟ”) เฐเฐเฐฆเฑเฐณเฐจ เฐเฑเฐเฐฆเฑเฐคเฐพเฐฐเฑ. - เฐคเฐเฑเฐเฑเฐต เฐ เฐกเฑเฐกเฐเฐเฐฟ: เฐเฐฆเฐฟ เฐเฐเฑเฐตเฐเฐเฐฟ เฐเฑเฐกเฐฟเฐเฐเฑ เฐ เฐจเฑเฐญเฐตเฐ เฐฒเฑเฐจเฐฟ เฐตเฑเฐฏเฐเฑเฐคเฑเฐฒเฐจเฑ (เฐฎเฐพเฐฐเฑเฐเฑเฐเฐฐเฑเฐฒเฑ, เฐกเฐฟเฐเฑเฐจเฐฐเฑเฐฒเฑ เฐฒเฑเฐฆเฐพ เฐชเฑเฐฐเฐพเฐเฑเฐเฑเฐเฑ เฐฎเฑเฐจเฑเฐเฐฐเฑโเฐฒเฑ เฐตเฐเฐเฐฟ) เฐเฑเฐกเฐพ เฐธเฐพเฐงเฐพเฐฐเฐฃ เฐ เฐชเฑเฐฒเฐฟเฐเฑเฐทเฐจเฑโเฐฒเฑ เฐฎเฐฐเฐฟเฐฏเฑ เฐชเฑเฐฐเฑเฐเฑเฐเฑเฐชเฑโเฐฒเฐจเฑ เฐฐเฑเฐชเฑเฐเฐฆเฐฟเฐเฐเฐกเฐพเฐจเฐฟเฐเฐฟ เฐ เฐจเฑเฐฎเฐคเฐฟเฐธเฑเฐคเฑเฐเฐฆเฐฟ.
- เฐชเฑเฐฐเฐฎเฐพเฐฆเฐพเฐฒเฑ: AI เฐเฑเฐกเฑโเฐจเฑ เฐเฐคเฑเฐชเฐคเฑเฐคเฐฟ เฐเฑเฐธเฑเฐคเฑเฐเฐฆเฐฟ เฐเฐพเฐฌเฐเฑเฐเฐฟ, เฐ เฐฆเฐฟ เฐเฑเฐจเฑเฐจเฐฟเฐธเฐพเฐฐเฑเฐฒเฑ เฐ เฐธเฐฎเฐฐเฑเฐฅเฐฎเฑเฐจ, เฐฌเฐเฑเฐเฑ เฐฒเฑเฐฆเฐพ เฐ เฐธเฑเฐฐเฐเฑเฐทเฐฟเฐค เฐเฑเฐกเฑโเฐจเฑ เฐเฐคเฑเฐชเฐคเฑเฐคเฐฟ เฐเฑเฐฏเฐตเฐเฑเฐเฑ. เฐกเฑเฐตเฐฒเฐชเฐฐเฑ เฐ เฐฆเฐฟ เฐเฐฒเฐพ เฐชเฐจเฐฟเฐเฑเฐธเฑเฐคเฑเฐเฐฆเฑ เฐชเฑเฐฐเฑเฐคเฐฟเฐเฐพ เฐ เฐฐเฑเฐฅเฐ เฐเฑเฐธเฑเฐเฑเฐเฐชเฑเฐตเฐเฑเฐเฑ, เฐเฐฆเฐฟ เฐคเฐฐเฑเฐตเฐพเฐค เฐธเฐเฐเฑเฐฒเฐฟเฐทเฑเฐ เฐธเฐฎเฐธเฑเฐฏเฐฒเฐจเฑ เฐจเฐฟเฐฐเฑเฐตเฐนเฐฟเฐเฐเฐกเฐ เฐฒเฑเฐฆเฐพ เฐชเฐฐเฐฟเฐทเฑเฐเฐฐเฐฟเฐเฐเฐกเฐ เฐเฐทเฑเฐเฐคเฐฐเฐ เฐเฑเฐธเฑเฐคเฑเฐเฐฆเฐฟ. เฐเฐฆเฐฟ เฐคเฐฐเฐเฑเฐเฐพ เฐตเฑเฐเฐตเฐเฐคเฐฎเฑเฐจ เฐชเฑเฐฐเฑเฐเฑเฐเฑเฐชเฐฟเฐเฐเฑ เฐฒเฑเฐฆเฐพ เฐคเฐเฑเฐเฑเฐต-เฐชเฑเฐฐเฐฎเฐพเฐฆเฐ เฐเฐจเฑเฐจ เฐชเฑเฐฐเฐพเฐเฑเฐเฑเฐเฑเฐฒเฐเฑ เฐเฐคเฑเฐคเฐฎเฐฎเฑเฐจเฐฆเฐฟ.
เฐฎเฑเฐฐเฑ เฐจเฐพเฐคเฑ เฐเฐชเฑเฐชเฑเฐกเฑ เฐเฐ เฐธเฐพเฐงเฐพเฐฐเฐฃ เฐตเฑเฐฌเฑ เฐเฑเฐกเฐฟเฐเฐเฑ เฐ เฐญเฑเฐฏเฐพเฐธเฐพเฐจเฑเฐจเฐฟ เฐชเฑเฐฐเฐฏเฐคเฑเฐจเฐฟเฐเฐเฐพเฐฒเฐจเฑเฐเฑเฐเฐเฑเฐจเฑเฐจเฐพเฐฐเฐพ? เฐฎเฑเฐฐเฑ เฐจเฐพเฐเฑ เฐเฐ เฐเฐฟเฐจเฑเฐจ เฐชเฑเฐฐเฑเฐเฑเฐฐเฐพเฐฎเฑ เฐเฑเฐธเฐ เฐเฐฒเฑเฐเฐจ เฐเฐตเฑเฐตเฐตเฐเฑเฐเฑ, เฐฎเฐฐเฐฟเฐฏเฑ เฐจเฑเฐจเฑ เฐฎเฑ เฐเฑเฐธเฐ เฐเฑเฐกเฑโเฐจเฑ เฐฐเฑเฐชเฑเฐเฐฆเฐฟเฐเฐเฐเฐฒเฐจเฑ.
ere is a list of the most popular vibe coding tools, broken down by category.
1. AI-First Code Editors
These are complete Integrated Development Environments (IDEs) built from the ground up with AI at their core. You code inside them.
- Cursor: This is one of the most popular examples. It’s a “fork” of VS Code, so it looks and feels familiar, but it has powerful AI features built directly into the editor for generating, editing, and debugging code.
- Replit: An in-browser IDE that uses AI to help you build, test, and deploy code instantly. Its AI can help you plan an app’s structure, write code, and fix errors.
- Zed: A very fast, multiplayer code editor that has integrated AI for code generation and understanding.
2. IDE Extensions (AI Pair Programmers)
These are plugins you add to your existing code editor, like VS Code or JetBrains. They work alongside you.
- GitHub Copilot: The most well-known AI pair programmer. It integrates directly into your editor (like VS Code) and provides “autocomplete” suggestions for entire blocks of code as you type.
- Gemini Code Assist (Google): The new version of Google’s AI assistant for developers. It integrates into IDEs like VS Code and JetBrains to provide code completion, generation, and a chat interface to ask questions about your code.
- Amazon Q Developer (AWS): (Formerly Amazon CodeWhisperer). This is Amazon’s version, which is especially powerful if you are working within the AWS ecosystem.
- Tabnine: One of the original AI code assistants, known for its powerful and fast code completions.
3. Full-Stack App Generators
These tools take “vibe coding” to the next level. You describe an entire application in plain English, and the AI generates the full-stack code (frontend, backend, and database) for you.
- Lovable: A popular tool where you describe the app you want, and it generates the code, allowing you to refine it with further prompts.
- Bolt.new: A browser-based tool that lets you build and deploy full-stack web apps using AI prompts.
- v0.dev (by Vercel): A tool specifically for generating user interfaces (UI). You describe a UI component (like a login form or a dashboard), and it generates the React code for you, which you can then copy and paste.
4. General-Purpose AI Chatbots
These are not specialized coding tools, but they are excellent for “vibe coding.” You can use them to generate snippets, debug errors, or learn new concepts.
- Google Gemini: You can ask me (Gemini) to write functions, create HTML/CSS, or debug a piece of code that isn’t working.
- ChatGPT (OpenAI): Widely used for generating boilerplate code, writing scripts, and explaining complex programming topics.
- Claude (Anthropic): Known for its large context window, making it great for pasting in large codebases and asking questions about them.
The best tool depends on your goal. For quick snippets, use a chatbot. For help inside your existing projects, use an IDE extension like GitHub Copilot. For building a whole new app from scratch, try an AI-First Editor like Cursor or a generator like Lovable.
