AI เข้าถึง Code บน VS Code หรือบน Git หรือเฉพาะ localhost แบบไหนดี

???? เคล็ดลับก่อนเริ่มอ่านบทความ

เสียง "กุ๊กๆๆๆ" บน VS Code หลังนำ AI ใช้งาน เป็นเสียงแจ้งเตือนเฉพาะของ Extension ที่ใช้ในการเชื่อมต่อกับ Gemini ซึ่งถูกออกแบบมาเพื่อส่งสัญญาณให้คุณทราบถึงความเคลื่อนไหวของ AI (เช่น มีการเสนอโค้ดใหม่, มีการยืนยันการดำเนินการ) ซึ่งเป็นเรื่องดีครับที่คุณรู้สึกสบายใจกับมัน

 

บทความนี้จะกล่าวถึง ขั้นตอนการใช้งาน และคำแนะนำที่สำคัญ จากประสบการณ์จริงที่ดี ต่อนักพัฒนาแน่นอน

• 1. ตั้งแต่กระบวนการ ที่ aI เข้า localhost และ เหมาะสมไหมครับ 
• 2. ผมควร load ไฟล์ขึ้น  Git หรือไม่ ข้อดี ข้อระวัง รหัสต่างๆ ไม่ได้อยู่ใน folder ส่วนใหญ่ผม เอาขึ้น Server และก็แยก รหัสออกเป็นส่วนๆ ไม่ผสมกัน จนกว่าจะเรียกใช้งานครับ 
• 3. แต่ API ที่ผมใส่ไม่รวม URL ถูกต้องหรือไม่ แต่สถานะการณ์ เมื่อใส่ API ที่ผ่านการได้มา จากการ GCP เพื่อทำ project web อัจฉริยะ มันจะถูกวัตถุประสงค์ไหม หรือใช้ด้วยกันได้ 
• 4. ai gemini จะเชื่อมโยงแนวคิดมาที่คุณ หรือไม่ เพราะเราวิเคราะห์แนวทาง สร้างระบบ ผมกังวนว่า จะ ต้องสนทนาหลายทาง 
• 5. จากภาพที่แนบ ผมยังไม่เข้าใจครับ Yes / Cancle ซึ่งสถานะการณ์น่าจะยังไม่แก้ไข code แต่เหมือนจะ comment ไว้
• 6. กรณียังไม่พร้อมให้ AI แก้ไข เช่น กำลังจัดระเบียบไฟล์ระบบ ลบขยะ บนพื้นที่ทำงาน

 

1. การที่ AI เข้าถึง localhost และความเหมาะสม

การที่ AI เข้าถึง localhost เป็นไปตามวัตถุประสงค์ของการใช้ AI Agent ใน VS Code และเป็นสิ่งที่เหมาะสมสำหรับ Agent ที่ต้องทำงานกับโค้ดจริง

• วัตถุประสงค์: เครื่องมือที่คุณเปิดใช้งาน (เช่น #builtin-edit, #runcommands) ถูกออกแบบมาเพื่อให้ AI สามารถอ่าน, เข้าใจ, และแก้ไขโค้ดที่อยู่ใน Workspace (โฟลเดอร์โปรเจกต์) ของคุณบนเครื่อง ได้อย่างแท้จริง

• Agent Mode: ในโหมด Agent, AI จะอ่านไฟล์ต่างๆ เพื่อสร้าง "Big Picture Architecture" (ตามที่ปรากฏในเอกสาร) ซึ่งจำเป็นต้องเข้าถึงไฟล์ทั้งหมดที่กำลังทำงานอยู่

• ความเหมาะสม: ถ้าคุณตั้งใจจะใช้ AI ในการ refactor, แก้ไข, หรือเพิ่มฟีเจอร์ โหมดนี้คือสิ่งที่ถูกต้อง แต่ถ้าคุณยังไม่พร้อมให้มัน "แก้ไข" คุณควรจำกัดเครื่องมือที่ AI ใช้ หรือปิดการทำงานของโหมดแก้ไขไว้ก่อนครับ (ดูข้อ 6)

 

ภาพ แสดงคำสั่งจากการนำเสนอการแก้ไข หรือ ชุดคำสั่งที่คุณต้องพิจารณา (ขวามือด้านล่าง Keep / Undo)

 

 

---

2. ควร Load ไฟล์ขึ้น Git หรือไม่ และข้อควรระวัง

ควรครับ ควรใช้ Git (และ GitHub) ตลอดเวลา แม้ในขณะที่คุณกำลังจัดระเบียบไฟล์

ประเด็น	คำแนะนำ	ข้อดี/ข้อควรระวัง
การใช้ Git (Version Control)	ควรทำอย่างยิ่ง ควร Commit การเปลี่ยนแปลงของคุณอย่างสม่ำเสมอ	ข้อดี: เป็น "ประกันชีวิต" ของโค้ดเบส คุณสามารถย้อนกลับไปยังสถานะใดๆ ก็ได้หาก AI ทำการแก้ไขผิดพลาด (แม้จะมีฟีเจอร์ Undo ของ Copilot แต่ Git ก็ยังสำคัญที่สุด)
การใช้ GitHub/GitLab (Remote Repo)	ควร Load ขึ้น เพื่อให้ Agent สามารถเข้าใจบริบทโค้ดได้ดีขึ้น (หากมีการตั้งค่า @githubrepo) และใช้เป็นที่สำรองข้อมูล	ข้อควรระวัง: ต้องไม่ Commit หรือ Push ข้อมูลสำคัญ เช่น API Key, Database Credentials, หรือไฟล์ .env ที่มีรหัสต่างๆ ขึ้นไปบน Repository สาธารณะ (Public Repo) ควรใช้ไฟล์ .gitignore เพื่อยกเว้นไฟล์เหล่านี้
การจัดการรหัส	รักษาวิธีการแยก Configuration และ Credentials ออกจากโค้ดไว้เหมือนเดิม	สำคัญ: AI Agent ควรเข้าถึงโค้ดเพื่อแก้ไขตรรกะ (Logic) ไม่ใช่เพื่อดึงรหัสผ่าน รหัสควรอยู่ในไฟล์ .env หรือไฟล์ Config ที่ถูก .gitignore

 

---

3. การใช้ Gemini API Key จาก Project Web อัจฉริยะ

สามารถใช้ด้วยกันได้และถูกวัตถุประสงค์ หากเป็นคีย์สำหรับ Gemini API

• API Key (ไม่มี URL): ถูกต้องแล้วครับ โดยทั่วไป API Key (เช่น AIzaSy...) จะเป็นเพียงรหัสเฉพาะสำหรับระบุตัวตนผู้ใช้งาน ไม่ได้รวม URL ไว้ในตัว Key นั้น

• การใช้งานร่วมกัน: ถ้า API Key ที่คุณได้มาจาก GCP เป็นคีย์ที่เปิดใช้งานสำหรับบริการ Gemini API แล้ว คุณสามารถนำมาใช้กับ Extension ใน VS Code ได้เลย เพราะวัตถุประสงค์หลักคือการเรียกใช้โมเดลภาษาของ Google ไม่ว่าจะเรียกจาก Project เว็บ หรือจาก VS Code Agent ก็ตาม

 

---

4. AI Gemini จะเชื่อมโยงแนวคิดมาที่คุณหรือไม่ (การสนทนาหลายทาง)

โดยหลักการแล้ว AI Agent จะตอบสนองต่อคำสั่งของคุณเท่านั้น แต่ความสามารถของมันจะช่วย "เชื่อมโยงแนวคิด" และทำให้คุณไม่ต้องสนทนาหลายทาง

• AI Agent (Gemini) ทำอะไร: Agent นี้ถูกฝึกมาให้เข้าใจ บริบท (Context) ทั้งหมดของโปรเจกต์คุณ (โครงสร้าง MVC, ไฟล์ Config, API Endpoints) ตามที่มันวิเคราะห์

• การเชื่อมโยงแนวคิด: เมื่อคุณสั่งงาน Agent (เช่น "Refactor the login logic in Auth.php to use the new database connection class"), Agent จะไม่จำเป็นต้องถามคุณย้อนกลับว่า "ไฟล์ Auth.php อยู่ที่ไหน" หรือ "คลาส Database คืออะไร" เพราะมันรู้ทั้งหมดจากเอกสารที่มันสร้างขึ้นมาแล้ว

• ความกังวลเรื่องหลายทาง: คุณอาจจะกังวลน้อยลง เพราะ Agent สามารถทำงานซับซ้อนได้ในคำสั่งเดียว แต่ถ้าคุณต้องการเปลี่ยนแปลงทิศทางของงาน (เช่น สั่งให้ทำ A ไปแล้วเปลี่ยนใจอยากให้ทำ B) คุณอาจจะต้อง "Undo" คำสั่ง A ก่อน (ตามที่เห็นในข้อ 5)

 

---

5. ความหมายของ Yes / Cancel ใน Pop-up

ป๊อปอัพนี้เป็นกลไกป้องกันความผิดพลาดของ AI Agent เพื่อให้คุณสามารถย้อนกลับไปสถานะก่อนหน้าได้ครับ

ตัวเลือก	สถานะการณ์ที่เกิด	ผลลัพธ์เมื่อเลือก
Yes	คุณได้ ลบ (Delete) หรือ แก้ไข (Edit) คำสั่งล่าสุดที่คุณส่งไปในช่อง Chat	ระบบจะ Undo คำขอแชทและ Undo การแก้ไขโค้ดที่เกิดขึ้นกับไฟล์ (เช่น copilot-instruct.md)
Cancel	คุณได้ลบหรือแก้ไขคำสั่งใน Chat แต่คุณไม่ต้องการย้อนกลับการแก้ไขโค้ด	คงไว้ ซึ่งการแก้ไขโค้ดล่าสุดที่ AI ได้ทำไปในไฟล์ และอนุญาตให้คุณแก้ไข/ส่งคำสั่งใหม่ใน Chat ได้

 

 

6. การป้องกันไม่ให้ AI แก้ไขโค้ด (เมื่อคุณยังไม่พร้อม)

กรณีที่ คุณกำลังจัดระเบียบไฟล์และไม่พร้อมให้ AI แก้ไขโค้ด คุณสามารถ จำกัดความสามารถในการแก้ไข ของ AI ได้ดังนี้

1. ใช้โหมด "Ask" เป็นหลัก: เมื่อคุณเปิด VS Code Chat ให้เลือกโหมด "Ask" แทนโหมด "Edit" หรือ "Agent"

   • ในโหมด "Ask" AI จะตอบคำถามและให้โค้ดเป็นบล็อก (code block) ที่คุณต้องคัดลอกไปใส่เอง มันจะไม่แก้ไขไฟล์ของคุณโดยอัตโนมัติ

2. ปิดเครื่องมือ #builtin-edit: เมื่อคุณใช้โหมด Agent/Edit และป้อนคำสั่ง Chat ให้คลิกที่ไอคอนเครื่องมือ (Tools) เหนือช่อง Chat และ ยกเลิกการเลือก (Uncheck) เครื่องมือที่ชื่อว่า #builtin-edit

   • สิ่งนี้จะบังคับให้ AI ทำได้แค่เสนอโค้ดแต่ไม่สามารถนำไปใช้กับไฟล์ของคุณได้โดยตรง

3. ใช้ git stash หรือ git branch: ก่อนให้ AI ทำงานใหญ่ๆ ให้ทำการ git stash หรือสร้าง git branch ใหม่ การทำเช่นนี้ทำให้คุณสามารถยกเลิกการแก้ไขทั้งหมดที่ทำโดย AI ได้อย่างรวดเร็วและปลอดภัยหากไม่เป็นที่พอใจ

 

 

---

 

จากภาพหน้าจอที่คุณเปิดใช้งานเครื่องมือ AI Agent ใน VS Code แสดงการตั้งค่า

 

การตั้งค่าเป็นการใช้งาน Google Gemini AI ในรูปแบบที่ปรับแต่งมาสำหรับ Code Database ของคุณโดยเฉพาะ ซึ่งแตกต่างจากการใช้ GitHub Copilot Chat ทั่วไป

 

---

1. การเปิดใช้งาน AI ดังภาพเป็น API แบบชำระเงินหรือไม่?

การใช้งาน API แบบชำระเงิน หรือ ฟรี ขึ้นอยู่กันวัตถุประสงค์การใช้งาน Contaxt ที่มีขนาดใหญ่จะช่วยให้ AI เข้าใจ Code และคุณได้มากยิ่งขึ้น

ตัวอย่างต่อไปนี้ คือ คำแนะนำการเลือกโมเดล Google แบบชำระเงิน เนื่องจาก มีแจ้งเตือนให้ใส่ API Key นั่นหมายความว่าโค้ดเบสของคุณมีการเชื่อมต่อโดยตรงกับบริการ Google Gemini API (ผ่าน Google AI Studio หรือ Google Cloud Vertex AI) โครตฉลาด 

• Gemini API เป็นบริการที่มีค่าใช้จ่ายตามปริมาณการใช้งาน (Usage-based pricing)

• คุณจะต้องใช้ Gemini API Key ที่ได้จากการสร้างในแพลตฟอร์มของ Google เพื่อให้การเชื่อมต่อทำงานได้

 

2. สามารถใช้ Gemini ในระบบนี้ได้ไหม และ AI ที่เปิดเป็นเวอร์ชันอะไร?

ใช้ได้แน่นอนครับ และเวอร์ชันคือ Gemini 2.5 Flash หรือตามความเหมาะสม (ควรศึกษาคุณสมบัติของ AI ก่อนเลือกใช้มีความแตกต่างกัน อย่างชัดเจน)

• ยืนยันการใช้ Gemini: เอกสารที่คุณแนบมามีข้อความยืนยันชัดเจนว่า: "Google Gemini AI Integration: The codebase integrates with Google Gemini AI..."

• เวอร์ชัน AI: จากภาพหน้าจอที่ส่วนขวาบน (ในช่องคอมเมนต์หรือเอกสารแนะนำ) มีการระบุรุ่นที่ใช้ไว้แล้วคือ "A. Gemini 2.5 Flash." (ซึ่งเป็นโมเดลที่รวดเร็วและมีประสิทธิภาพสูง)

 

3. API Key ที่ต้องใช้คือตัวไหน?

คุณต้องใช้ Gemini API Key ดังขั้นตอนต่อไปนี้

1. เข้าไปที่ Google AI Studio หรือ Google Cloud Vertex AI (แล้วแต่แพลตฟอร์มที่คุณใช้สร้างคีย์)

2. สร้าง API Key สำหรับโมเดล Gemini

3. นำคีย์นั้นไปใส่ในส่วนที่ VS Code หรือ Extension นั้นร้องขอ หรือใส่ในไฟล์ Config ที่เกี่ยวข้องในโปรเจกต์ของคุณ (ตามที่เอกสาร AI Suggestion ระบุไว้ในไฟล์ที่เกี่ยวข้องกับ API/Gemini)

 

4. สังเกตอย่างไรว่าทำงานในโหมดใด และ Chat ตอนไหน?

การทำงานในโหมด AI Agent

AI ที่สร้างเอกสาร "AI Agent Guidelines for Booking Agency Codebase" นั้นทำงานใน Agent Mode ซึ่งเป็นโหมดที่ AI ได้รับมอบหมายให้:

1. วิเคราะห์ (Analyze) โค้ดเบสทั้งหมดของคุณ (Big Picture Architecture)

2. ทำความเข้าใจ (Understand) โครงสร้าง (Entry Point, MVC-like Structure, Database, API Endpoints)

3. สร้างคู่มือ (Generate Guidelines) สำหรับ AI Coding Agent อื่น ๆ (หรือสำหรับตัวมันเอง) เพื่อให้ทำงานกับโปรเจกต์นี้ได้อย่างมีประสิทธิภาพ

 

การ Chat / สั่งงานเกิดขึ้นเมื่อใด?

การ Chat หรือสั่งงานได้เกิดขึ้นเมื่อคุณป้อนคำสั่งระดับสูง (High-level Prompt) ในช่อง VS Code Chat (อาจจะผ่านช่อง Ctrl+Alt+I หรือช่องที่มีสัญลักษณ์แชท) เช่น:

• "Analyze this codebase to generate or update @githubcopilot-instruct.md for guiding AI coding agents."

• "Generate comprehensive documentation for this booking agency codebase."

** เมื่อคุณสั่งงานไป โมเดล Gemini (ผ่าน Agent) ก็จะทำการวิเคราะห์ Code Database บน PHP (ที่รันอยู่บน localhost ซึ่ง AI เข้าถึงได้ตามที่คุณตั้งค่าไว้) และสร้างเอกสารสรุปสถาปัตยกรรมออกมาเป็นผลลัพธ์

 

เปิดตัวอย่าง ผลผลัพธ์จากการใช้งานได้ที่นี้