Differences

This shows you the differences between two versions of the page.

--- ai:agentic-coding [2026/02/02 02:08] – created phong2018
+++ ai:agentic-coding [2026/02/22 23:42] (current) – removed phong2018
@@ Line 1: / Line 1: @@
-====== Agentic Coding: An Introductory Knowledge Map ======
-This document provides an introductory overview of Agentic Coding, presenting the current landscape of the field.
-So, what is this article about?
-The goal is to:
-Summarize core concepts of Agentic Coding
-Explain practical ways to work with and apply Agentic Coding in real projects
-Clarify several non-obvious or confusing topics that many people often wonder about
-Main sections:
-Conceptual foundations (things you must understand to practice effectively)
-The current chaos of Agentic AI tools
-Why there are so many Kits and Skills
-Achieving 5×–10× coding performance
-===== I. Conceptual Foundations =====
-(These are required to understand and practice Agentic Coding effectively)
-The following concepts are organized from beginner level upward to make them easier to approach.
-Most modern Agentic Coding tools are built around these ideas. The community has produced a large amount of documentation and tutorials—easy to find—but understanding what these concepts actually mean is the key.
-==== I.1 Commands — Telling AI What to Do ====
-Command /kəˈmɑːnd/
-→ lệnh, chỉ thị
-When you install an AI Agent IDE such as Cursor, Antigravity, or Claude, and type something like “create a new file”, that is a command.
-This is the most basic interaction model:
-One task → one instruction → AI executes it
-==== I.2 Plans — Planning Before Execution ====
-Plan /plæn/
-→ kế hoạch
-One drawback of simple command-based interaction is that you only see what the AI did after it finishes.
-In Plan mode, the AI first explains:
-What it intends to do
-How it will do it
-You can review, discuss, and modify the plan. Once the plan looks good, execution begins.
-Example:
-To store a light/dark theme setting, options include localStorage, sessionStorage, cookies, or backend storage.
-Without a plan, the AI may choose an approach that seems reasonable to it—but not to you.
-==== I.3 Rules — Always / Never ====
-Rule /ruːl/
-→ quy tắc
-When coding with AI, you often repeat the same constraints.
-For example:
-Your team agrees on CamelCase naming
-But code style conventions suggest snake_case
-You keep reminding the AI: “Use CamelCase”
-Instead, define this once as a rule, and the AI will consistently follow it.
-Examples:
-“Always use Tailwind CSS for styling”
-“Never install new libraries without approval”
-==== I.4 Skills — AI’s Expertise Pack ====
-Skill /skɪl/
-→ kỹ năng
-If you keep repeating the same instructions across similar tasks, you may want to package them into a reusable skill.
-Rules define what is allowed or forbidden.
-Skills define how to solve a specific type of problem, in your preferred style.
-Example:
-Instead of repeatedly saying:
-“Write REST APIs”
-“Include try/catch”
-“Log errors and retry if needed”
-You define a skill called API_Standard, and simply invoke it.
-==== I.5 MCP (Model Context Protocol) — AI’s Eyes ====
-Protocol /ˈproʊtəkɒl/
-→ giao thức
-If you have ever had to describe UI designs to an AI step by step, MCP removes that friction.
-MCP allows AI to:
-Connect directly to Figma and read designs
-Fetch up-to-date documents automatically
-Instead of guessing, the AI can see and read external sources.
-==== I.6 Sub-agents — Divide and Conquer ====
-Sub-agent /sʌb ˈeɪdʒənt/
-→ tác nhân phụ
-AI agents have limited context windows (e.g., 200k tokens).
-Large tasks with many sub-tasks can degrade performance over long conversations.
-Sub-agents act like specialized assistants, each responsible for a specific domain or task.
-==== I.7 Hooks — Final Checkpoints ====
-Hook /hʊk/
-→ móc nối, điểm chặn
-If certain actions should always happen after the AI finishes a task—without requiring reasoning—you can use hooks.
-Examples:
-Automatically run Prettier after code generation
-Run security scans after AI changes code
-==== I.8 Workflow — The Working Process ====
-Workflow /ˈwɜːrkfloʊ/
-→ quy trình làm việc
-Many people apply Agentic Coding by mimicking real-world software development:
-Requirement → Design → Planning → Coding → Review → Testing → Deployment → Monitoring
-Workflow connects all concepts into a logical sequence, defining when and how each concept should be used.
-With good prompts + solid workflows, output quality improves dramatically.
-==== I.9 Kit — Don’t Reinvent the Wheel ====
-Kit /kɪt/
-→ bộ công cụ
-You may understand Rules, Skills, Plans—but still struggle to write effective prompts.
-That’s where kits come in.
-Instead of:
-Writing React rules from scratch
-Configuring MCP for PostgreSQL manually
-Others have already bundled best practices into standardized kits.
-=== Summary of Section I ===
-Concepts (Rules, Skills, MCP, …): Tools
-Workflow: How to use tools effectively
-Kit: A standardized bundle of tools + workflow
-===== II. The Chaos of Agentic AI Tools ======
-There are many Agentic AI tools today: Cursor, Antigravity, Claude Code, OpenCode, Augment, etc.
-This abundance can feel overwhelming.
-However, discussions with practitioners reveal:
-For ~90% of tasks and users, these tools are not fundamentally different.
-If you are a typical developer working on company tasks, most tools will work just fine.
-==== II.1 CLI vs GUI Agentic Tools ====
-CLI (Command Line Interface) /ˌsiː el ˈaɪ/
-→ giao diện dòng lệnh
-GUI (Graphical User Interface) /ˌdʒiː juː ˈaɪ/
-→ giao diện đồ họa
-GUI tools: Friendly UI, easy onboarding, strong UI preview
-CLI tools: Terminal-first, highly customizable
-Choose based on preference.
-==== II.2 Why the Claude Code FOMO? ====
-FOMO /ˈfoʊmoʊ/
-→ sợ bị bỏ lỡ
-Common reasons:
-Strong trend-setting (skills, workflows, kits)
-Perceived higher intelligence
-Better performance on long, heavy coding tasks
-High code output with relatively low cost
-For typical users: differences remain marginal.
-==== II.3 Generating Large Code Volumes Cheaply ====
-A practical trick:
-Use Claude Code as a proxy
-Connect it to cheaper third-party model subscriptions
-Switch accounts when quotas are exhausted
-This setup is ideal for:
-Solo builders
-Freelancers
-Experts with frequent new projects
-==== II.4 Tool Comparison ====
-Cursor: Smooth UX, editor-first AI integration
-Claude Code: Fast, terminal-based, strong agent behavior
-Antigravity: Thought-flow and context control
-OpenCode: Open-source and transparent
-Augment: Optimized for large codebases
-=== Summary of Section II ===
-Don’t over-FOMO for most use cases
-Special needs require special setups
-===== III. Why Are There So Many Kits and Skills? ======
-Every day, new Kits and Skills appear:
-AI Dev Kits
-Claude Kits
-Workflow frameworks
-Specialized UI/UX or React skills
-These packages are powerful because:
-They reduce setup overhead
-They are tested and refined by their creators
-If it feels overwhelming, remember:
-Kits are meant to increase productivity, not create confusion.
-Pick a few that match your workflow and update occasionally.
-===== IV. 5×–10× Coding Performance ======
-Performance /pərˈfɔːrməns/
-→ hiệu năng
-Claims of “5×–10× performance” should be compared against:
-No AI usage
-Or very basic command-only AI usage
-Agentic Coding shines when concepts, workflows, and kits work together—not when AI is used as a simple autocomplete.