Vibe Coding
Lộ trình phát triển toàn diện Vibe Coding theo tiêu chuẩn quốc tế nilbuild/developer-roadmap
Hướng dẫn từng bước từ nền tảng đến chuyên sâu giúp bạn làm chủ Vibe Coding. Tích hợp tài liệu lý thuyết, bài viết thực chiến, video tham khảo và bài tập lập trình trực tiếp trên IDE.
Nền Tảng & Khái Niệm Cốt Lõi
Giai đoạn 1 tập trung hoàn thiện 15 chủ đề then chốt.
Ask AI to handle your Git and GitHub CLI tasks
You don't need to memorize Git commands. Ask AI to write commit messages, create branches, push code, and manage your repository for you. This removes one of the biggest barriers beginners face with version control and keeps the workflow moving smoothly.
Ask AI to keep the code modular and aim for smaller modules/files
From the start, tell AI to split the code into small, focused files rather than putting everything in one place. Smaller files are easier to read, easier to fix, and easier for AI to work with in future sessions without getting confused.
Use subagents
Subagents are specialized agents that handle specific tasks in their own isolated context. Using them keeps each part of the work focused, reduces token usage, and produces cleaner results than trying to do everything inside one long conversation.
Ask AI to write tests
Every time AI builds a feature, ask it to write tests for that feature right away. End-to-end tests are especially useful because they simulate a real user going through your app and catch bugs that affect the experience before they reach real users.
Ask for one task at a time
Keep your prompts focused. Ask AI to do one thing, review the result, and then move on to the next. When you stack multiple requests into one prompt, the AI loses focus and mistakes pile up across all of them at once.
Tell AI what NOT to do
Articles ========
Be specific about what you want
Describe exactly what you want — layout, behavior, content, constraints. The more detail you give, the less the AI has to guess. Vague prompts produce vague results, and you end up spending more time correcting than if you had been specific from the start.
ChatGPT
ChatGPT is a large language model chatbot developed by OpenAI. You can give it a prompt, and it'll generate text that attempts to answer or continue the conversation. Think of it as a super-smart auto-complete that can understand context and hold a conversation. It's been used for things like writing code, answering questions, and even creative writing.
Claude Code
Claude Code is a terminal-based AI tool built by Anthropic. It is designed to reason through complex code problems, explain unfamiliar codebases, and help with debugging. It works best when you need to understand what a piece of code is doing before modifying it; give it a specific problem and it will walk through it step by step.
Codex
Codex is an AI model developed by OpenAI that translates natural language instructions into functional code. It acts as the engine behind many modern programming assistants, allowing developers to describe what they want to build in plain English and receive the corresponding code snippets in return.
ChatGPT
ChatGPT is a large language model chatbot developed by OpenAI. You can give it a prompt, and it'll generate text that attempts to answer or continue the conversation. Think of it as a super-smart auto-complete that can understand context and hold a conversation. It's been used for things like writing code, answering questions, and even creative writing.
Consider Test-driven development (TDD)
With TDD, you write the test before the code. Ask AI to first write a test that describes the expected behavior, then write the code that makes it pass. This forces clarity about what you are building and results in cleaner, more reliable code.
Context
Context is everything when working with AI. The AI only knows what you tell it; it has no memory of your project, your past decisions, or your preferences unless you provide that information in the current session. Keep sessions focused, start fresh for unrelated tasks, and use subagents when possible to keep context clean and costs low.
Copilot
GitHub Copilot is an AI-powered coding assistant that helps you write code faster. It suggests lines of code and even entire functions as you type, learning from your style and comments to provide relevant suggestions. It's like having a coding partner that understands your intentions and helps you bring them to life.
Cursor
Cursor is a code editor built on top of VS Code with AI assistance integrated throughout. It is particularly useful for navigating and editing large codebases you did not write yourself, which makes it well suited for working with AI-generated code. You can select any part of the code and ask it to explain, fix, or rewrite it without having to read every line around it.
Kỹ Năng Trọng Tâm & Thực Hành
Giai đoạn 2 tập trung hoàn thiện 15 chủ đề then chốt.
Debugging
AI is very good at fixing errors when you give it the right information. Paste the error message directly, let it diagnose the problem, and if it keeps failing after a few attempts, ask it to list all possible causes instead of guessing. Use logs to trace exactly where things go wrong, and when available, use MCP tools to give AI direct visibility into what is happening inside your app in real time.
Explicitly ask AI to perform a security audit of the application
Before launching anything publicly, ask AI to go through the code and look for security issues — unprotected routes, missing input validation, exposed data, and anything else that could be exploited. Treat this as a mandatory step, not an optional one.
Explicitly tell AI to "think" or "brainstorm"
For tricky problems, don't ask AI to jump straight to a solution. Tell it to think through the options first and explain its reasoning before writing any code. This simple instruction often leads to much better results on complex tasks.
For unrelated tasks, clean and start new sessions
When switching to a different task, start a new chat. Carrying over context from an unrelated session confuses the AI, reduces the quality of responses, and wastes tokens on information that is no longer relevant.
Gemini
Gemini CLI is Google's command-line AI tool for developers. It assists with code generation, explanation, and refactoring directly in the terminal. It is a practical option if you are already working within Google's ecosystem or want a powerful AI assistant without switching away from your existing terminal workflow.
Give AI mockups, reference files, and material
Articles ========
If AI fails after 3 prompts, stop
As a rule of thumb, if the AI keeps getting something wrong after three attempts, it's better to stop and try something different. Start a fresh session and rephrase the request from scratch. A clean slate almost always works better than trying to fix a conversation that has gone off the track.
Ask Al to create a list of possible causes
If a bug keeps coming back after fixes, ask AI to step back and list all the possible reasons it could be happening. This forces a more systematic approach and often surfaces the real root cause instead of just patching symptoms.
If you have style/coding preferences, document them for AI
Write down your preferences - folder structure, naming conventions, coding patterns - in a dedicated file (e.g., a [CLAUDE.md](http://CLAUDE.md)) and share it with AI at the start of each session. This stops you from correcting the same things over and over and keeps the code consistent throughout the project.
Revert with Git
Git gives you precise, reliable control over your code history. AI's built-in undo features are not always trustworthy, especially when changes span multiple files. A proper Git revert takes you back to an exact saved state with no surprises.
Illustrate AI with Examples
Always give AI something to look at, not just something to read. Paste in existing files, attach screenshots, or link to references. The more relevant material you provide, the less it has to guess and the better the output will be.
Implement Spec-Driven Development (SDD)
Spec-driven development means writing a clear document that describes what you want to build before you start prompting. Instead of jumping straight into asking AI to write code, you first describe the features, the user flows, the data structure, and any important rules. You then give this document to the AI at the start of each session so it always has the full picture.
Install and ask AI to use MCP
MCP tools let AI interact directly with your app — for example, using Playwright to test it in a real browser. This gives AI actual visibility into what is happening rather than guessing from the code alone, which makes debugging much faster and more accurate.
Leverage long context windows
Some AI tools allow you to paste in a lot of information at once. When working on something complex, prompt AI with all the relevant files, notes, and context at once. The more the AI understands about your project upfront, the better decisions it will make throughout the session.
Lovable
Lovable generates a working front-end application from a text description. It is one of the fastest ways to go from idea to something clickable. The output is good enough for early user testing but may need refinement with a code editor before it is ready for production.
Kiến Trúc Nâng Cao & Tối Ưu
Giai đoạn 3 tập trung hoàn thiện 15 chủ đề then chốt.
Master Version Control
Version control is the system you use to track changes to your code over time. Version control tools like Git are especially important for vibe coders because AI can sometimes make sweeping changes that break things unexpectedly, and having a recent save point means you never lose too much progress.
Always use env variables
API keys, passwords, and tokens should never appear directly in your code. Store them in a `.env` file using environment variables, and make sure that file is listed in `.gitignore` so it never gets pushed to GitHub accidentally.
Once tests are in place, refactor regularly
Good tests give you the freedom to clean up and reorganize the code without fear of breaking things. Once your test suite is in place, make refactoring a regular habit and let the tests tell you immediately if anything goes wrong.
Pick a popular tech stack rather than new/niche ones
Use popular tech stacks like React, Next.js, Tailwind, and Supabase. AI has been trained on a lot of code using these tools, so it gives better results. For mobile, desktop, or hardware projects, the same rule applies: stick to established tools. If you use something niche or very new, AI will make more mistakes, and you will spend more time fixing things. Popular stacks also have more tutorials and community support, which helps when you get stuck.
Plan before you Code
Before you start coding with AI, have a plan. Define your MVP and break the project into phases. Don't try to build everything at once; work step by step. Give AI examples like mockups, screenshots, or code samples so it understands what you want. You can even use AI itself to help you plan. Tell it your idea, let it help you refine it, and break it into phases. Little planning at the start saves many hours of fixing later.
Plan what you need to develop
Don't try to build everything at once. Start with your MVP, the simplest version that works. If you are building a task manager, that might just be adding, viewing, and deleting tasks. Nothing else. Then break the rest into phases. Maybe phase two is user accounts, phase three is notifications. This way, you always have something working, and the AI gives better results when you give it smaller, focused tasks instead of asking it to build a whole app in one go.
Prompt the error message and let AI do the rest
When something breaks, copy the full error message and paste it directly into your prompt along with a short description of what you were doing. In most cases, this is enough for AI to find the problem and suggest a fix without any back and forth.
Prompt the error message and let AI do the rest
When something breaks, copy the full error message and paste it directly into your prompt along with a short description of what you were doing. In most cases, this is enough for AI to find the problem and suggest a fix without any back and forth.
Prompting Best Practices
How you talk to AI determines the quality of what you get back. Ask for one thing at a time, be specific, show examples, tell it what to avoid, and use a context document so you don't repeat yourself every session.
Regularly ask the AI to review and refactor the codebase
Every few sessions, pause new feature work and ask AI to clean up the existing code. Over time, code gets messy, and a regular cleanup keeps the project healthy and makes it easier to keep building without things breaking unexpectedly.
Regularly update your context document
Every time you make an important decision about your project, add it to your context document, like your [CLAUDE.md](http://CLAUDE.md). This keeps sessions shorter, reduces repeated explanations, and saves tokens, which saves money, especially when working with agents that consume tokens fast.
Copilot
GitHub Copilot is an AI-powered coding assistant that helps you write code faster. It suggests lines of code and even entire functions as you type, learning from your style and comments to provide relevant suggestions. It's like having a coding partner that understands your intentions and helps you bring them to life.
Security Best Practices
Security is easy to overlook when you are focused on building, but the consequences of ignoring it can be serious. Always use environment variables for sensitive information like API keys and passwords, and before going live, explicitly ask AI to audit your app for vulnerabilities.
Start each new feature with a clean Git slate
Before asking AI to build something new, make sure all your current changes are committed. This gives you a clean checkpoint so that if the new feature causes problems, you can discard the changes and start again without any risk to what you already have.
Tech Stack and Coding
AI works better with popular tech stacks like React, Next.js, Python, and Tailwind. If you use something niche, expect more errors. Go with what's popular. Write down your coding preferences and give them to AI before you start, otherwise it will make its own choices. Always tell AI to keep code small and modular. It will try to put everything in one file if you let it. And do refactoring sessions regularly, ask AI to review the codebase, and clean up the mess. If you skip this, things get out of control fast.
Hệ Sinh Thái & Triển Khai Thực Tế
Giai đoạn 4 tập trung hoàn thiện 12 chủ đề then chốt.
Tell AI to add logs
Keep track of the mistakes AI keeps repeating and include them in your prompts. Telling AI what to avoid is just as important as telling it what to do. A simple line like "do not add placeholder data" can prevent a lot of unnecessary back and forth.
Tell AI to add logs
Keep track of the mistakes AI keeps repeating and include them in your prompts. Telling AI what to avoid is just as important as telling it what to do. A simple line like "do not add placeholder data" can prevent a lot of unnecessary back and forth.
Testing
Testing is how you make sure your app actually works the way it's supposed to. Ask AI to write tests as it builds, not after. Use E2E tests to catch real user-facing bugs, write a breaking test before fixing any bug, and refactor freely once your tests are in place.
The Vibe Coder Mindset
AI is more like a junior developer working next to you. You don't ask one question and leave. You have a conversation with it. You give context, check what it gives back, tell it when something is wrong, and guide it to what you need. If you explain your idea clearly, it works better. This is very different from traditional programming, where you must know exact syntax and write everything yourself. With AI, your role changes; you become the person who directs, not the person who writes the code. You set the vision, review output, and keep the project going in the right direction. You still need to understand the basics of programming, but you don't need to memorize syntax or figure out every small detail on your own anymore.
Use "act as" framing when helpful
When you want a specific type of thinking, tell AI to take on a role. "Act as a senior developer" or "act as a UX researcher" shifts how it approaches your question and gives you more relevant, role-specific advice than a generic prompt would.
Use git commit
Every time AI completes a task, and the result looks good, make a commit. This locks in your progress so that if the next task breaks something, you can go back to the last working version without losing any of your previous work.
Use skills created by others
There is a growing ecosystem of skills — pre-built AI capabilities developed as an open standard — that you can plug into your AI tool to extend its capabilities. Before building something from scratch, check if a skill already exists for it. It saves time and often gives better results than starting from zero.
v0
v0 is Vercel's UI generation tool. You describe a component or screen in plain language, and it produces clean React code ready to drop into your project. It is best for generating individual UI components rather than full applications; use it when you need a specific interface element quickly without writing it from scratch.
Vibe Coding
"Vibe coding" is a software development method in which you use AI and LLMs to generate code via natural-language prompts rather than writing it by hand. The idea is you describe what you want the application to do, and AI builds it. Good for fast prototyping. You don't need to review every line of code. Makes development faster and more accessible for people who are not traditional programmers.
Use breaking tests
Before fixing a bug, ask AI to write a test that reproduces it, that is, a test that currently fails because of the broken behavior. Then ask it to fix the code so the test passes. This confirms the fix is real and prevents the same bug from coming back silently.
Devin
Devin is an autonomous software engineer powered by AI that can handle entire development projects from start to finish. It functions as a virtual teammate capable of writing code, debugging errors, and deploying applications independently. Formerly known as Windsurf, the platform integrates deeply into the development workflow to execute complex tasks based on natural language prompts. It manages the full lifecycle of a task by navigating terminal commands, reading documentation, and testing its own work in real time.
Work step by step rather than trying to build all at once
Build one feature at a time. Ask the AI to do it, test it, make sure it works, then move to the next one. If you ask AI to build too many things at once, things will break, and you won't know why. Small steps make debugging easy because you only changed one thing, so you know exactly where the problem is.