0Pricing
Vibe Coding · บทเรียน

เครื่องมือแบบเอเจนต์: Claude Code และ Copilot

ผู้ช่วยที่อ่าน เขียน และเรียกใช้โค้ดแทนคุณ

เครื่องมือแบบเอเจนต์: Claude Code และ Copilot เป็นบทเรียน Vibe Coding ฟรีบน CoddyKit นี่คือบทเรียนที่ 2 จากทั้งหมด 4 บทเรียน คุณสามารถอ่านบทเรียนทั้งหมดด้านล่างฟรี — จากนั้นลองปฏิบัติด้วยตัวคุณเองในเบราว์เซอร์พร้อมตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7 บทเรียนนี้เป็นส่วนหนึ่งของเส้นทางการเรียน Vibe Coding และความก้าวหน้าของคุณจะซิงค์ข้ามเว็บและแอป CoddyKit คอร์ส Vibe Coding มีบทเรียนทั้งหมด 4 บทเรียน

บางส่วนของบทเรียนนี้ยังไม่ได้รับการแปล และแสดงเป็นภาษาอังกฤษ

Beyond Autocomplete

Some AI tools don't just suggest code — they act. They read your files, write new ones, run commands, and check the results, all from a single instruction.

These are agentic tools. The two you'll hear about most are Claude Code and GitHub Copilot. Think of them as a teammate you can delegate whole tasks to.

What 'Agentic' Means

A normal assistant answers a question. An agent takes a goal and works toward it in multiple steps — reading, writing, running, and adjusting.

Tell an agent 'add a contact form to my site' and it will find the right file, write the form, wire up the button, and tell you what it changed. You supervise; it does the legwork.

Claude Code: The Terminal Agent

Claude Code is Anthropic's agent that runs in your terminal (and inside editors too). You type a request in plain English, and it explores your project, edits files, and can run commands like installing packages or starting your app.

It's powerful because it works across many files at once and explains each step as it goes.

In Claude Code you might type:

"Add a dark mode toggle to my web app. Update the HTML, CSS and JavaScript so clicking it switches between light and dark themes."

Letting Claude Code Run Things

The magic of an agent is that it can run code and read the output. If your app errors, Claude Code can run it, see the error, and fix it — looping until it works.

For safety, it asks before doing anything important, like deleting files or running commands. You approve each risky step.

"Run my project, and if there are any errors in the console, fix them and run it again until it works."

GitHub Copilot

GitHub Copilot started as smart autocomplete — it suggests the next line as you type. It has since grown a chat and an agent mode that can make multi-file changes too.

It's built right into editors like VS Code, so the suggestions appear inline as faint 'ghost text' you accept with a key press.

Copilot's Ghost Text

As you type a comment or a function name, Copilot guesses the rest. You'll see grey suggested text — press Tab to accept it.

This is great for momentum: write a clear comment describing what you want, and let Copilot fill in the code below it.

// add two numbers and return the result
function add(a, b) {
  return a + b;
}

console.log(add(3, 4));

Comment-Driven Building

A neat trick with Copilot: write your intent as a comment first, then let the AI implement it. Your comments become a kind of prompt.

Clear comments lead to clear code — vague ones lead to guesses. The clearer you describe the goal, the better the suggestion.

// show a friendly greeting based on the time of day
function greeting(hour) {
  if (hour < 12) return "Good morning!";
  if (hour < 18) return "Good afternoon!";
  return "Good evening!";
}

console.log(greeting(9));

Claude Code vs Copilot

Both are agentic, but they shine in different moments:

  • Claude Code — best for big, multi-step tasks and running/fixing code end-to-end. Strong reasoning, terminal-native.
  • Copilot — best for fast inline suggestions while you're already typing in your editor.

Many builders use both: Copilot for flow, Claude Code for the heavy lifting.

The Supervise-and-Approve Loop

With agents you're the manager, not the typist. The healthy loop looks like this:

  • Describe the goal clearly.
  • Let the agent plan and act.
  • Read what it changed (the diff).
  • Approve, or ask for a fix.

You stay responsible for the result — the agent just moves fast.

Writing Good Instructions

Agents reward clear, complete instructions. Tell them the goal, any constraints, and how you'll know it worked.

A strong agent instruction reads almost like a small task ticket — specific enough that there's only one reasonable way to do it.

"Create a new file called todo.html with a simple to-do list: an input box, an 'Add' button, and a list below it. Adding an item should clear the input. Use only plain HTML, CSS and JavaScript in one file."

When to Reach for an Agent

Use an agent when a task is bigger than a single line:

  • Building a feature that spans several files.
  • Fixing an error you can't figure out.
  • Setting up or running a project.
  • Refactoring or renaming across the codebase.

For tiny inline tweaks, plain autocomplete is often enough.

Quick Check

What makes a tool like Claude Code 'agentic' rather than just an autocomplete?

Recap: Delegating to Agents

Agentic tools turn you into a manager of code:

  • Claude Code runs in the terminal, handles multi-step tasks, and can run/fix code.
  • Copilot gives fast inline suggestions and has an agent mode too.
  • Write clear instructions; review every diff; approve risky steps.

Next: browser-based app builders like v0, Bolt and Lovable that go from prompt to running app instantly.

คำถามที่พบบ่อย

บทเรียน “เครื่องมือแบบเอเจนต์: Claude Code และ Copilot” ฟรีหรือไม่

ใช่ — ข้อความเต็มของ “เครื่องมือแบบเอเจนต์: Claude Code และ Copilot” ฟรีให้อ่านที่นี่บนเว็บ เพื่อปฏิบัติแบบโต้ตอบ (ตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7) และปลดล็อคส่วนที่เหลือของคอร์ส Vibe Coding ให้อัปเกรดเป็น CoddyKit PRO คอร์ส Vibe Coding มีบทเรียนทั้งหมด 4 บทเรียน

คุณจะเรียนรู้อะไรในบทเรียน “เครื่องมือแบบเอเจนต์: Claude Code และ Copilot”

ผู้ช่วยที่อ่าน เขียน และเรียกใช้โค้ดแทนคุณ คุณปฏิบัติ Vibe Coding ด้วยโค้ดที่ใช้งานได้จริงที่คุณเรียกใช้โดยตรงในเบราว์เซอร์ และติวเตอร์ AI ตลอด 24/7 ตอบคำถามของคุณขณะที่คุณไปผ่านบทเรียน

คุณต้องมีประสบการณ์ก่อนที่จะเริ่มเรียน Vibe Coding หรือไม่

ไม่จำเป็นต้องมีประสบการณ์มาก่อน Vibe Coding บน CoddyKit ออกแบบมาสำหรับผู้เริ่มต้นไปจนถึงผู้เรียนขั้นสูง คุณสามารถเริ่มต้นที่นี่หรือเริ่มจากตัวแรกและเรียนด้วยความเร็วของคุณเอง นี่คือบทเรียนที่ 2 จากทั้งหมด 4 บทเรียน

บทเรียน “เครื่องมือแบบเอเจนต์: Claude Code และ Copilot” ใช้เวลานานแค่ไหน

บทเรียน CoddyKit ส่วนใหญ่ใช้เวลาประมาณ 5–10 นาที แต่ละบทเรียนจึงสั้นและเป็นแบบโต้ตอบ คุณสามารถก้าวหน้าอย่างต่อเนื่องและกลับมาเรียนต่อจากตรงที่เพิ่งหยุดบนเว็บและแอปได้เลย

ฉันเขียนและรันโค้ดในบทเรียน Vibe Coding นี้ได้ไหม

ได้ บทเรียน Vibe Coding ทุกบทมีตัวแก้ไขโค้ดในตัว คุณจึงเขียนและรันโค้ดจริงได้เลยในเบราว์เซอร์ และได้รับข้อเสนอแนะจาก AI ในทันที — ไม่ต้องติดตั้งในเครื่องของคุณ

บทเรียนทั้งหมดในหลักสูตรนี้

  1. เครื่องมือแก้ไขโค้ดปัญญาประดิษฐ์: Cursor และ Windsurf
  2. เครื่องมือแบบเอเจนต์: Claude Code และ Copilot
  3. เครื่องมือสร้างแอป: v0, Bolt และ Lovable
  4. การเลือกเครื่องมือที่เหมาะสม
← กลับไปที่ Vibe Coding