PugBase x Claude MCP

BlockNote image

Model Context Protocol (MCP) และการผสานรวมกับ PugBase: ปลดล็อกศักยภาพของ AI Coding Agent

ในยุคที่ AI เข้ามามีบทบาทสำคัญในการพัฒนาซอฟต์แวร์มากขึ้นเรื่อยๆ AI Coding Agent ได้กลายเป็นเครื่องมืออันทรงพลังที่ช่วยให้นักพัฒนาสามารถสร้างสรรค์และแก้ไขโค้ดได้อย่างรวดเร็วและมีประสิทธิภาพ อย่างไรก็ตาม ความท้าทายสำคัญประการหนึ่งคือการที่ AI Agent เหล่านี้จะสามารถเข้าถึงและโต้ตอบกับข้อมูลบริบทจากเครื่องมือภายนอกได้อย่างไร Model Context Protocol (MCP) จึงถือกำเนิดขึ้นเพื่อตอบโจทย์นี้ และ PugBase ก็ได้นำ MCP มาผสานรวมเพื่อยกระดับการทำงานร่วมกันระหว่างมนุษย์และ AI ไปอีกขั้น

Model Context Protocol (MCP) คืออะไร?

MCP ย่อมาจาก Model Context Protocol ซึ่งเป็นโปรโตคอลแบบเปิดที่ออกแบบมาเพื่อให้ AI Coding Agent สามารถเชื่อมต่อและสื่อสารกับเครื่องมือภายนอกได้ ไม่ว่าจะเป็นระบบไฟล์, ระบบควบคุมเวอร์ชัน (เช่น GitHub), หรือแม้แต่แอปพลิเคชันจดบันทึกอย่าง PugBase

ลองนึกภาพว่า AI Agent ของคุณเป็นนักพัฒนาที่ต้องการข้อมูลจากแหล่งต่างๆ เช่น เอกสารประกอบ, แผนงาน, หรือรายงานผลการทดสอบ หากไม่มี MCP AI Agent ก็จะถูกจำกัดอยู่แค่ข้อมูลที่ถูกป้อนเข้าไปโดยตรงเท่านั้น แต่ด้วย MCP AI Agent จะสามารถ "เรียกใช้เครื่องมือ" (call tools) เพื่อดึงข้อมูลที่ต้องการจากระบบภายนอกได้แบบเรียลไทม์ ทำให้ AI มีบริบทที่สมบูรณ์และสามารถทำงานได้อย่างชาญฉลาดยิ่งขึ้น

ทำไม MCP ถึงสำคัญ?

MCP มีความสำคัญอย่างยิ่งต่อการพัฒนา AI Agent ที่มีความสามารถสูงและใช้งานได้จริง ด้วยเหตุผลดังนี้:

เพิ่มขีดความสามารถของ AI Agent: AI Agent สามารถเข้าถึงข้อมูลที่หลากหลายและเป็นปัจจุบันจากเครื่องมือต่างๆ ทำให้สามารถเข้าใจบริบทของงานได้ลึกซึ้งยิ่งขึ้น และสร้างผลลัพธ์ที่แม่นยำและมีคุณภาพ
ลดข้อจำกัดด้านบริบท: แทนที่จะต้องป้อนข้อมูลทั้งหมดเข้าไปใน prompt เดียว AI Agent สามารถดึงข้อมูลที่จำเป็นเมื่อต้องการได้ ลดปัญหาเรื่อง context window ของโมเดล
ส่งเสริมการทำงานร่วมกัน: AI Agent สามารถทำงานร่วมกับระบบและเครื่องมือที่มีอยู่ได้อย่างราบรื่น กลายเป็นส่วนหนึ่งของ workflow การพัฒนาซอฟต์แวร์ของทีม
เปิดกว้างและยืดหยุ่น: ในฐานะโปรโตคอลแบบเปิด นักพัฒนาสามารถสร้าง MCP Server ของตนเองเพื่อเชื่อมต่อ AI Agent กับเครื่องมือหรือระบบใดๆ ก็ได้

PugBase กับการผสานรวม MCP: ยกระดับการทำงานร่วมกันของ AI

PugBase ในฐานะแอปพลิเคชันจดบันทึกและวางแผนการทำงานร่วมกันด้วย AI ได้นำ MCP มาใช้เพื่อสร้างสะพานเชื่อมระหว่างแผนงานของทีมกับ AI Coding Agent อย่าง Claude Code

PugBase ในฐานะ MCP Server

PugBase มาพร้อมกับ MCP Server ในตัว ซึ่งหมายความว่า PugBase สามารถทำหน้าที่เป็น "แหล่งข้อมูล" และ "ปลายทาง" สำหรับ AI Agent ได้โดยตรง โดยไม่จำเป็นต้องติดตั้งซอฟต์แวร์เพิ่มเติมใดๆ บนฝั่ง PugBase เลย

การเชื่อมต่อ Claude Code กับ PugBase

การเชื่อมต่อ Claude Code (ไม่ว่าจะเป็น CLI หรือ VS Code extension) กับ PugBase นั้นทำได้ง่ายดายผ่าน API Key:

สร้าง API Key: ไปที่ /settings -> Developer ใน PugBase เพื่อสร้าง API Key ซึ่งจะถูกจำกัดขอบเขตการเข้าถึงเฉพาะ Workspace ที่กำหนด

เชื่อมต่อ Claude Code:
- ผ่านไฟล์โปรเจกต์ (.mcp.json): สร้างไฟล์ .mcp.json ใน root ของโปรเจกต์ของคุณ โดยระบุ URL ของ PugBase MCP Server (<origin>/api/mcp) และ API Key ใน Header ตัวอย่างเช่น:

{
  "servers": [
    {
      "name": "pugbase",
      "transport": "http",
      "url": "https://your-workspace.pugbase.io/api/mcp",
      "headers": {
        "Authorization": "Bearer pgb_YOUR_API_KEY"
      }
    }
  ]
}

หลังจากสร้างไฟล์แล้ว ให้โหลด Editor ใหม่และอนุมัติ pugbase

ผ่านคำสั่ง CLI: ใช้คำสั่ง claude mcp add เพื่อเพิ่ม PugBase MCP Server:

claude mcp add --transport http pugbase https://your-workspace.pugbase.io/api/mcp --header "Authorization: Bearer pgb_YOUR_API_KEY"

เมื่อเชื่อมต่อแล้ว Claude Code ก็พร้อมที่จะโต้ตอบกับโน้ตและแผนงานของคุณใน PugBase

เครื่องมือ MCP ที่ Claude Code สามารถเรียกใช้ใน PugBase

PugBase ได้เปิดเผยชุดเครื่องมือ MCP ที่ Claude Code สามารถเรียกใช้ได้ เพื่อให้ AI Agent สามารถทำงานได้อย่างมีประสิทธิภาพ:

get_plan_spec: อ่านแผนงานทั้งหมดใน "Planning" session ของ Workspace ที่กำหนด โดยจะถูกจัดรูปแบบเป็น XML-tagged เพื่อให้ AI Agent เข้าใจโครงสร้างได้ง่าย
list_plan_notes / get_note_spec: ใช้สำหรับแสดงรายการหรืออ่านโน้ตแต่ละรายการภายในแผนงาน
push_result: เขียนผลลัพธ์ที่ได้จากการทำงานของ AI Agent (เช่น รายงาน QA, สรุปการ build) กลับเข้าไปในโน้ตของ PugBase ในรูปแบบของ Result Block ที่ทีมสามารถอ่านและแสดงความคิดเห็นได้
create_note: สร้างโน้ตใหม่จาก Markdown (สามารถระบุ Session และ Folder ได้) เช่น การสร้างเอกสาร API Spec หรือชุดเอกสารประกอบ
upload_image / upload_file: อัปโหลดภาพหน้าจอหรือไฟล์อื่นๆ ที่สามารถแสดงผลเป็น iframe แบบโต้ตอบในโน้ตได้

"Plan with AI" ใน PugBase: แผนงานที่ AI เข้าใจ

PugBase มีฟีเจอร์ "Plan with AI" ที่ช่วยให้ผู้ใช้สามารถเปลี่ยนคำขอหรือเนื้อหาในโน้ตให้กลายเป็นเซสชันการวางแผนที่มีโครงสร้างชัดเจน ซึ่งประกอบด้วยโฟลเดอร์ต่างๆ เช่น Requirements, Diagrams, Agents และ Other โดยแต่ละโฟลเดอร์จะเก็บโน้ตย่อยๆ เช่น Overview, Constraints, แผนภาพ Mermaid และรายการงาน (task lists) พร้อมช่องทำเครื่องหมาย

แผนงานที่สร้างขึ้นด้วย "Plan with AI" นี้ถูกออกแบบมาโดยเฉพาะเพื่อให้ AI Coding Agent สามารถอ่าน ทำความเข้าใจ และนำไปปฏิบัติได้ทันที ด้วยการระบุทางเลือกทางเทคนิคที่ชัดเจนและเกณฑ์การยอมรับที่แม่นยำ ทำให้ Claude Code สามารถทำงานตามแผนได้อย่างมีประสิทธิภาพ

ประโยชน์ของการผสานรวม PugBase x Claude Code (MCP)

การผสานรวมนี้มอบประโยชน์มากมายให้กับทีมพัฒนา:

AI เข้าใจบริบทได้ลึกซึ้ง: Claude Code สามารถอ่านแผนงาน, ข้อกำหนด, และเอกสารประกอบทั้งหมดที่อยู่ใน PugBase ทำให้เข้าใจโปรเจกต์ได้อย่างถ่องแท้
ลดภาระงานซ้ำซ้อน: AI Agent สามารถทำงานที่ซ้ำซ้อนหรืองานที่ต้องใช้ความละเอียดสูงได้ เช่น การสร้างโค้ด boilerplate, การเขียนเอกสารประกอบ, หรือการสร้างรายงาน
การทำงานร่วมกันแบบไร้รอยต่อ: Claude Code ไม่เพียงแต่รับข้อมูลจาก PugBase เท่านั้น แต่ยังสามารถเขียนผลลัพธ์กลับเข้าไปในโน้ตได้โดยตรง ทำให้ทีมสามารถติดตามความคืบหน้าและให้ข้อเสนอแนะได้ง่าย
เพิ่มความเร็วในการพัฒนา: ด้วยการที่ AI Agent สามารถทำงานบางส่วนได้เอง นักพัฒนาจึงมีเวลามากขึ้นในการมุ่งเน้นไปที่งานที่ซับซ้อนและต้องใช้ความคิดสร้างสรรค์

sequenceDiagram
    participant User as ผู้ใช้
    participant PB as PugBase (MCP Server)
    participant CC as Claude Code (CLI/VS Code Extension)
    participant ClaudeAI as Claude AI Model

    User->>PB: 1. สร้าง API Key ใน PugBase Settings
    User->>CC: 2. กำหนดค่า PugBase MCP Server ใน .mcp.json หรือ CLI
    CC->>PB: 3. Claude Code เชื่อมต่อกับ PugBase MCP Server (ผ่าน API Key)

    User->>CC: 4. ผู้ใช้สั่งให้ Claude Code ทำงาน (เช่น "อ่านแผนงานจาก PugBase")
    CC->>ClaudeAI: 5. Claude Code ส่งคำสั่งและบริบทไปยัง Claude AI Model
    ClaudeAI->>CC: 6. Claude AI Model ตัดสินใจเรียกใช้ Tool (เช่น get_plan_spec)

    CC->>PB: 7. Claude Code เรียกใช้ Tool "get_plan_spec" (HTTP GET /api/mcp/get_plan_spec)
    PB-->>CC: 8. PugBase ส่งข้อมูลแผนงาน (XML-tagged) กลับไปให้ Claude Code

    CC->>ClaudeAI: 9. Claude Code ส่งข้อมูลแผนงานให้ Claude AI Model เพื่อประมวลผล
    ClaudeAI->>CC: 10. Claude AI Model สร้างผลลัพธ์ (เช่น โค้ด, รายงาน QA)

    CC->>PB: 11. Claude Code เรียกใช้ Tool "push_result" (HTTP POST /api/mcp/push_result)
    PB-->>CC: 12. PugBase ยืนยันการบันทึกผลลัพธ์
    PB->>User: 13. ผลลัพธ์ปรากฏในโน้ต PugBase (Result Block)

Public API ของ PugBase (Public REST API)

นอกเหนือจาก MCP Server สำหรับ Claude Code แล้ว PugBase ยังมี Public REST API ที่สามารถใช้งานได้ด้วย API Key เดียวกัน นักพัฒนาสามารถใช้ API นี้เพื่อ:

การดำเนินการ	Endpoint	รายละเอียด
อ่านข้อมูลโน้ต	`GET /notes/{workspaceId}/{noteId}`	อ่านข้อมูลโน้ตที่เผยแพร่แล้ว ซึ่งประกอบด้วย `title` และ `specMarkdown`
ส่งผลลัพธ์กลับเข้าโน้ต	`POST /notes/{workspaceId}/{noteId}/results`	ส่งผลลัพธ์ในรูปแบบ Markdown (พร้อม `title` ที่ไม่บังคับ) กลับเข้าไปในโน้ต

ข้อจำกัดของ API Key:

Free Plan: 2 API Keys
Pro Plan: 10 API Keys
Max Plan: 50 API Keys

หมายเหตุ: การเชื่อมต่อ MCP Server สำหรับ Claude Code นั้นฟรีสำหรับทุกแผนการใช้งาน โดยค่าใช้จ่ายในการประมวลผลของ Claude จะขึ้นอยู่กับการสมัครสมาชิก Claude ของผู้ใช้เอง

ดูคู่มือฉบับเต็มได้ที่ /docs/claude-code

สรุป

Model Context Protocol (MCP) เป็นก้าวสำคัญในการทำให้ AI Coding Agent สามารถทำงานร่วมกับเครื่องมือภายนอกได้อย่างมีประสิทธิภาพ และ PugBase ได้นำโปรโตคอลนี้มาผสานรวมอย่างชาญฉลาด เพื่อสร้างแพลตฟอร์มที่ช่วยให้ทีมพัฒนาสามารถวางแผน, ทำงาน, และสื่อสารกับ AI Agent ได้อย่างราบรื่น การผสานรวม PugBase x Claude Code (MCP) ไม่เพียงแต่เพิ่มขีดความสามารถของ AI เท่านั้น แต่ยังช่วยปฏิวัติวิธีการทำงานของทีมพัฒนาซอฟต์แวร์ ทำให้กระบวนการทั้งหมดรวดเร็วขึ้น มีประสิทธิภาพมากขึ้น และส่งเสริมการทำงานร่วมกันอย่างแท้จริง

By GolfX