vibe coding คืออะไรจริง ๆ และลูปที่คุณกับ AI ทำงานด้วยกัน

คุณเคยนั่งพิมพ์บอก AI ว่าอยากได้หน้าเว็บแบบนี้ อยากได้ปุ่มแบบนั้น แล้วสักครู่ของจริงก็โผล่ขึ้นมาให้เปิดดูได้ คุณกดได้ ใช้ได้ มันเป็นของจริง ทั้งที่คุณไม่ได้พิมพ์โค้ดเองสักบรรทัด คุณนั่งมองสิ่งที่ตัวเองเพิ่งสร้างขึ้นมาแล้วรู้สึกทึ่ง แต่พร้อมกันนั้นก็มีคำถามค้างอยู่ในใจ ระหว่างตอนที่คุณพิมพ์ไปกับตอนที่ของโผล่ขึ้นมา เกิดอะไรขึ้นกันแน่ คุณสร้างของจริงได้ แต่อธิบายไม่ได้ว่าจริง ๆ แล้วมันทำงานยังไง

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

บทนี้คือบทแรกของทั้งภาค หน้าที่ของมันคือติดตั้งภาพนั้นให้คุณ ภาพจริง ๆ ว่า vibe coding คืออะไร เครื่องจักรเบื้องหลังหน้าตาเป็นยังไง และวงจรการทำงานระหว่างคุณกับ AI วนเป็นรอบยังไง เมื่อมีภาพนี้แล้ว ทุกบทที่เหลือในภาคจะมีที่ทาง และแนวคิดสำคัญของหนังสือเล่มนี้ ที่ว่าคุณจะโตจากคนสั่งมือใหม่ ไปเป็นคนคุมงาน ไปเป็นคนวางโครงสร้าง จะมีอะไรให้ยึด ถ้าไม่มีภาพนี้ ทุกอย่างที่ตามมาจะกลวง

ทำไมต้องเห็นภาพลูปนี้ก่อนทำอย่างอื่น

ขอปูให้ชัดก่อนว่าทำไมเรื่องนี้ต้องมาเป็นอันดับแรกสุด ก่อนเรื่องส่วนประกอบของเว็บ ก่อนเรื่อง git ก่อนทุกอย่าง

เวลาคุณ vibe code คุณคือคนสั่งงาน ไม่ใช่คนลงมือพิมพ์โค้ด และคนสั่งงานที่คุมงานได้จริง ต้องมีภาพในหัวว่าสิ่งที่ตัวเองสั่งมันทำงานยังไง ถ้าในหัวคุณ vibe coding คือกล่องดำที่พิมพ์เข้าไปแล้วของออกมา คุณจะทำได้แค่ภาวนา สั่งไปแล้วลุ้นว่าจะได้ของที่ดี พอไม่ได้ก็สั่งซ้ำมั่ว ๆ จนกว่าจะเข้าตาจน

แต่พอคุณเห็นว่ามันไม่ใช่กล่องดำ มันคือลูปที่มีขั้นตอนชัดเจน และคุณมีตำแหน่งของตัวเองอยู่ในลูปนั้น ทุกอย่างเปลี่ยน คุณรู้ว่าตรงไหนที่คุณควบคุมได้ ตรงไหนที่ AI รับผิดชอบ และเวลามันพัง คุณรู้ว่าจะถอยกลับไปดูที่ขั้นไหน นี่คือก้าวแรกที่เปลี่ยนคุณจากคนที่สั่งแล้วได้แต่ลุ้น ไปเป็นคนที่บังคับเครื่องจักรเป็น

vibe coding คืออะไรจริง ๆ

พูดให้สั้นที่สุดแบบที่คุณจำกลับไปเล่าให้คนอื่นฟังได้ vibe coding คือการสร้างซอฟต์แวร์ด้วยการอธิบายสิ่งที่คุณอยากได้เป็นภาษาคนให้ AI ที่เขียนโค้ดเป็น แล้ว AI ตัวนั้นเป็นคนเขียนและแก้ไฟล์โปรแกรมจริง ๆ ของคุณให้ คุณไม่ต้องพิมพ์โค้ดเองเลยสักบรรทัด หน้าที่ของคุณคือกำกับ ไม่ใช่ก่อสร้าง

คำว่า vibe มาจากการที่คุณบอกความรู้สึกหรือความตั้งใจ เป็นภาษาคนธรรมดา เช่น อยากได้หน้าแรกที่ดูสะอาด อยากได้ปุ่มสีเขียวตรงนี้ อยากให้กดแล้วเซฟได้ คุณไม่ต้องแปลความอยากนั้นเป็นโค้ด เพราะมีคนแปลให้

ตัว AI ที่ทำหน้าที่นี้ มีชื่อเรียกว่า AI coder หรือ coding agent คือ AI ที่เขียนโค้ดได้ และที่สำคัญกว่านั้นคือ ลงมือทำกับไฟล์จริงในเครื่องคุณได้ ไม่ใช่แค่พิมพ์โค้ดมาให้คุณอ่านเฉย ๆ คำว่า agent ตรงนี้คือหัวใจ มันแปลว่า ตัวแทนที่ลงมือทำแทนคุณ ไม่ใช่แค่ที่ปรึกษาที่พูดอย่างเดียว เดี๋ยวเราจะแยกสองอย่างนี้ให้ชัดข้างล่าง

เครื่องจักรเบื้องหลัง ซอฟต์แวร์คือไฟล์ในเครื่อง ไม่ใช่ของในแชต

มีเรื่องหนึ่งที่ต้องปักไว้ในใจก่อนจะไปดูลูป ตอนคุณ vibe code สิ่งที่ AI coder ลงมือทำจริงคือไปอ่านและแก้ไฟล์โปรแกรมจริงที่อยู่บนเครื่องคุณ ซอฟต์แวร์ของคุณคือไฟล์พวกนั้น ไม่ได้ลอยอยู่ในหน้าต่างแชต แชตเป็นแค่ที่ที่คุณคุยกับ AI เพื่อสั่งงาน แต่ของจริงที่ถูกสร้างและถูกเปลี่ยน คือไฟล์บนเครื่อง

ไฟล์พวกนี้อยู่ตรงไหนและจัดระเบียบยังไง เป็นเรื่องของบทถัดไป ตอนนี้ขอแค่ให้คุณยึดไว้ก่อนว่า AI แก้ไฟล์จริง แล้วคุณรันหรือเปิดพรีวิวดูผล นี่คือพื้นของลูปที่กำลังจะดูกัน

ลูปสร้างของ ห้าขั้นที่คุณกับ AI วนด้วยกัน

นี่คือใจความของบท เมื่อรู้แล้วว่าซอฟต์แวร์คือไฟล์ และ AI coder อ่านกับเขียนไฟล์พวกนั้น ทีนี้เรามาดูว่าคุณกับ AI ทำงานต่อกันยังไง ทั้งหมดนี้คือวงจรเดียวที่วนซ้ำ ห้าขั้น สั้น ๆ แต่คุณจะวนมันนับร้อยรอบตอนสร้างของจริง

1. คุณบอกเป้าหมายเล็ก ๆ เป็นคำพูด คุณพูดสิ่งที่อยากได้เป็นภาษาคน หนึ่งอย่างเล็ก ๆ ไม่ใช่ทั้งเว็บรวด เช่น ขอเพิ่มปุ่มบันทึกที่หน้านี้ที ยิ่งเป้าเล็กและชัด ผลยิ่งดีและยิ่งตรวจง่าย
2. AI แก้ไฟล์ที่เจาะจง AI coder อ่านไฟล์ที่เกี่ยวข้อง แล้วเขียนการแก้ไขกลับลงไปในไฟล์จริงบนเครื่องคุณ มันบอกคุณด้วยว่าไปแตะไฟล์ไหนบ้าง แก้อะไรไป
3. การเปลี่ยนแปลงโผล่ให้เห็นตอนคุณรันหรือเปิดพรีวิว ไฟล์ถูกแก้แล้ว แต่คุณยังไม่เห็นอะไรจนกว่าจะรันหรือเปิดพรีวิวมันขึ้นมา ตอนนั้นแหละผลของการแก้ถึงปรากฏบนหน้าจอให้คุณดู
4. คุณตรวจด้วยตาคุณเอง คุณดูว่าได้ของที่ขอไหม ปุ่มมาจริงไหม กดแล้วทำงานไหม ของเดิมพังไปด้วยหรือเปล่า ขั้นนี้สำคัญที่สุดและเป็นของคุณคนเดียว เพราะ AI ไม่รู้ว่าในใจคุณ ถูก หน้าตาเป็นยังไง คุณรู้
5. เก็บไว้ หรือทิ้งไป แล้ววนใหม่ ถ้าดี คุณเก็บไว้แล้วไปเป้าหมายต่อไป ถ้าไม่ดี คุณบอกให้แก้ หรือทิ้งของรอบนี้แล้วลองใหม่ จากนั้นวนกลับไปข้อ 1 ด้วยเป้าถัดไป

สังเกตว่าวงจรนี้ไม่ใช่การพิมพ์ครั้งเดียวแล้วได้เว็บทั้งเว็บ แต่เป็นการขยับทีละก้าวเล็ก ๆ สั่ง แก้ ดู ตัดสิน วนซ้ำ ของใหญ่ ๆ ถูกสร้างขึ้นจากการวนลูปเล็ก ๆ นี้หลายร้อยรอบต่อกัน นี่คือจังหวะการทำงานจริงของการ vibe code

ใครทำอะไร คุณกำกับ AI พิมพ์

เมื่อเห็นลูปแล้ว เส้นแบ่งหน้าที่ก็ชัดขึ้นเอง และเส้นนี้คือหัวใจของทั้งหนังสือ

สิ่งที่ AI เป็นเจ้าของ คือการแปลความอยากของคุณให้เป็นโค้ด การพิมพ์โค้ดจริง ๆ การรู้ว่าต้องเขียนภาษาอะไร แก้ไฟล์ไหน วางโครงสร้างยังไง ทั้งหมดนี้เป็นงานของ AI คุณไม่ต้องแตะ และไม่ต้องรู้วิธีพิมพ์มันด้วยซ้ำ

สิ่งที่คุณเป็นเจ้าของ มีสามอย่าง และนี่คือเมล็ดพันธุ์ของสามขั้นที่คุณจะโตขึ้นไปตลอดเล่ม

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

จำสามคำนี้ไว้ คุณ ตัดสินใจ ตัดสิน และจำ ส่วน AI พิมพ์ ตลอดทั้งภาคนี้และภาคต่อไป เราจะค่อย ๆ ทำให้คุณเก่งขึ้นในสามหน้าที่นี้ จนคุณขยับจากคนสั่งมือใหม่ ไปเป็นคนคุมงาน ไปเป็นคนวางโครงสร้างของทั้งระบบ

ในทางปฏิบัติ AI coder ที่คนใช้กันจริงมีอะไรบ้าง

ทีนี้มาดูของจริง เพราะ AI coder ไม่ได้มีตัวเดียว และมันมีหลายรูปแบบที่หน้าตาต่างกันมาก แต่ทุกตัวทำลูปห้าขั้นเดียวกันที่เพิ่งเรียนไป รู้จักไว้จะได้เลือกถูกและไม่งงเวลาคนพูดถึง

แบบที่หนึ่ง ทำงานผ่านเทอร์มินอล ตัวเด่นคือ Claude Code ซึ่งเป็น AI coder ที่รันอยู่บนหน้าต่างคำสั่งของเครื่อง บน Mac คุณเปิดโปรแกรมที่ชื่อ Terminal แล้วคุยกับมันที่นั่น มันอ่านและแก้ไฟล์ในโปรเจกต์ให้ตรง ๆ หน้าตาดูดิบ แต่ทรงพลังและตรงไปตรงมา

แบบที่สอง ทำงานในโปรแกรมแก้โค้ด หรือ IDE IDE คือโปรแกรมที่คนเขียนโค้ดใช้เปิดและแก้ไฟล์โปรเจกต์ ตัวที่นิยมที่สุดคือ VS Code และมี Cursor ซึ่งคือ VS Code ที่ฝัง AI coder เข้าไปในตัว แบบนี้คุณเห็นไฟล์ทั้งหมดเรียงอยู่ข้าง ๆ เห็น AI แก้ไฟล์ต่อหน้าต่อตา เหมาะกับคนที่อยากเห็นภาพรวมของโปรเจกต์มากขึ้น

แบบที่สาม เครื่องมือแบบกดปุ่ม หรือ GUI เช่น Lovable, Bolt, v0 และ Replit เครื่องมือกลุ่มนี้เป็นเว็บที่คุณพิมพ์บอกสิ่งที่อยากได้ แล้วมันสร้างให้ พร้อมพรีวิวให้ดูในตัว กดปุ่มเอาเป็นหลัก ไม่ต้องแตะเทอร์มินอลหรือไฟล์ตรง ๆ เหมาะกับคนที่อยากเริ่มเร็วที่สุดและยังไม่อยากเห็นความซับซ้อนข้างใน

ทั้งสามแบบรูปร่างต่างกันคนละโลก แต่ข้างในคือลูปเดียวกันเป๊ะ คุณบอกเป้าหมายเป็นคำพูด มันแก้ไฟล์จริง มันพรีวิวผลให้ดู คุณตรวจ แล้วเก็บหรือทิ้ง หนังสือเล่มนี้จะใช้ Claude Code กับ VS Code เป็นตัวอ้างอิงเวลายกตัวอย่าง เพราะมันเห็นกลไกจริงชัดที่สุด แต่หลักการทุกอย่างที่สอน ไม่ผูกกับเครื่องมือตัวไหน ถ้าคุณใช้ Lovable หรือ Replit อยู่ สิ่งที่เรียนก็ใช้ได้เหมือนกัน แค่ปุ่มอยู่คนละที่

แชตที่พูดอย่างเดียว ต่างจาก agent ที่ลงมือทำ

มีเส้นแบ่งสำคัญอีกอันที่ต้องเข้าใจ ไม่งั้นจะสับสนว่าทำไมบางทีคุยกับ AI แล้วของไม่เปลี่ยนสักที

ChatGPT หรือ Claude แบบที่คุณเปิดในเว็บแล้วคุยเล่น คือแชตที่พูดอย่างเดียว คุณถามให้มันเขียนโค้ด มันพิมพ์โค้ดมาให้คุณอ่านในกล่องข้อความ แต่มันไม่ได้แตะไฟล์ในเครื่องคุณ มันแค่บอก ถ้าอยากเอาโค้ดนั้นไปใช้ คุณต้องก๊อปแล้วเอาไปวางในไฟล์เอง

AI coder อย่าง Claude Code คือ agent ที่ลงมือทำกับไฟล์จริง ความต่างคือ agent ไม่ได้พิมพ์โค้ดมาให้คุณอ่านเฉย ๆ แต่มันลงไปแก้ไฟล์ในโปรเจกต์ของคุณให้เลย คุณไม่ต้องก๊อปไปวางเอง นี่คือเหตุผลที่ลูปห้าขั้นถึงทำงานได้ลื่น เพราะตัวที่คุณคุยด้วย เป็นตัวเดียวกับที่ลงมือแก้ของจริง

จำเส้นแบ่งนี้ไว้ แชตพูด agent ทำ การ vibe code ที่แท้จริงต้องใช้ agent ที่แตะไฟล์จริงได้ ไม่ใช่แค่แชตที่พิมพ์โค้ดมาให้อ่าน

เริ่มสร้างของชิ้นแรกของเรา ปุ่มบันทึก

ตลอดทั้งภาคนี้ เราจะสร้างของเล็ก ๆ ชิ้นเดียวไปด้วยกัน เพื่อให้ทุกบทมีของจริงให้จับ ของชิ้นนั้นคือ ปุ่มบันทึกหนึ่งปุ่มบนหน้าเว็บหน้าเดียว มันเล็กมาก แต่พอเดินไปจนจบภาค มันจะพาเราแตะทุกเรื่องสำคัญของการสร้างซอฟต์แวร์

จุดเริ่มต้นคือลูปที่เพิ่งเรียนไปเป๊ะ ๆ คุณพิมพ์บอก AI coder ว่า ขอเพิ่มปุ่มบันทึกที่หน้านี้ที จากนั้นคุณจะได้เห็นกับตา ว่า AI ไปเปิดอ่านไฟล์ของหน้านั้น แล้วเขียนการแก้ไขกลับลงไปในไฟล์จริงบนเครื่องคุณ มันจะบอกด้วยว่าแก้ไฟล์ไหนไปบ้าง พอคุณเปิดพรีวิว ปุ่มก็โผล่ขึ้นมา คุณตรวจด้วยตา แล้วเก็บไว้ ปุ่มเดียวนี้แหละ คือของที่จะเดินทางไปกับเราทั้งภาค A ในบทถัด ๆ ไปเราจะค่อย ๆ ทำให้มันปลอดภัยขึ้น เซฟประวัติได้ ขึ้นเว็บจริงได้ ทีละเรื่อง

ตัวอย่างนี้สะท้อนของจริง เพราะเว็บ AI ภาษาคน เว็บที่เจ้าของสร้างด้วยการ vibe code ทั้งเว็บ ก็มีฟีเจอร์เซฟบุ๊กมาร์กที่เริ่มต้นมาจากปุ่มเล็ก ๆ แบบนี้เหมือนกัน

ภาพช่วยจำ

ตอนนี้คุณเข้าใจกลไกจริงแล้ว ขอเติมภาพหนึ่งไว้ช่วยจำ การ vibe code เหมือนการกำกับช่างก่อสร้างฝีมือดี ที่สื่อสารกับคุณได้แค่ผ่านกำแพงที่สร้างเสร็จแล้ว คุณบอกว่าอยากได้หน้าต่างตรงนี้ ช่างไปก่อขึ้นมาให้ คุณเดินไปดูว่าใช่ไหม คุณไม่เคยก่ออิฐเองสักก้อน แต่ถ้าคุณบอกไม่ได้ว่าหน้าต่างควรอยู่ตรงไหน หรือมองไม่ออกว่าช่างก่อผิด คุณก็จะได้บ้านที่ไม่ใช่บ้านที่คุณอยากได้ ฝีมือช่างไม่ช่วยอะไร ถ้าคนกำกับกำกับไม่เป็น นี่คือเหตุผลว่าทำไมหน้าที่ตัดสินใจ ตัดสิน และจำ ถึงอยู่ที่คุณ ไม่ใช่ที่ AI

จุดที่การเปรียบเทียบนี้ใช้ไม่ได้ และเป็นจุดที่สำคัญมาก คือช่างก่อสร้างที่เป็นคนจริง จำแผนเมื่อวานได้ พรุ่งนี้มาทำต่อก็รู้ว่าเมื่อวานคุยอะไรไว้ แต่ AI coder ไม่ได้จำแบบนั้น มันไม่ได้อุ้มทั้งโปรเจกต์และทุกบทสนทนาไว้ในหัวตลอดเวลา มันมีขีดจำกัดว่ารับข้อมูลไว้พิจารณาได้แค่ครั้งละเท่าไร เรื่องนี้คือเหตุผลที่หน้าที่ จำว่าทำไม ถึงต้องเป็นของคุณ และเรามีบทเต็ม ๆ เรื่องขีดจำกัดความจำของ AI กับวิธีรับมือ อยู่ในภาคต่อไป ตอนนี้ขอแค่ให้คุณรู้ว่าช่องว่างนี้มีอยู่จริง

ถึงตรงนี้ ต่อให้ลืมภาพช่างก่อสร้างไป คุณก็ยังอธิบายได้ว่า vibe coding คือการสั่ง AI ด้วยภาษาคนให้แก้ไฟล์โปรแกรมจริงของคุณ แล้ววนลูป สั่ง แก้ ดู ตัดสิน เก็บ ไปเรื่อย ๆ โดยคุณกำกับ AI พิมพ์ ภาพช่างก่อสร้างเป็นแค่หมุดช่วยจำ ไม่ใช่ตัวคำอธิบาย

ความเข้าใจผิดที่ต้องเคลียร์

หลายคนคิดว่า vibe coding แปลว่า AI ทำทุกอย่างให้ ส่วนคุณแค่นั่งดูเฉย ๆ จริง ๆ ไม่ใช่เลย AI เป็นเจ้าของแค่การพิมพ์โค้ด ส่วนทุกขั้นของลูป เป้าหมายมาจากคุณ การตัดสินว่าถูกไหมมาจากคุณ การตัดสินใจว่าจะเก็บหรือทิ้งมาจากคุณ ถ้าคุณนั่งดูเฉย ๆ โดยไม่กำกับ คุณจะได้ของที่ AI เดาว่าคุณอยากได้ ซึ่งมักไม่ใช่ของที่คุณอยากได้จริง คุณกำกับทุกก้าว ไม่ใช่นั่งดู

💡 ใจความสำคัญ: vibe coding ไม่ใช่กล่องดำที่สั่งแล้วลุ้น มันคือลูปที่ชัดเจน คุณบอกเป้าหมายเล็ก ๆ เป็นคำพูด AI coder แก้ไฟล์จริงในเครื่องคุณ คุณรันดู ตรวจด้วยตา แล้วเก็บหรือทิ้ง วนซ้ำ ของจริงคือไฟล์บนเครื่อง ไม่ใช่ของในแชต และเส้นแบ่งคือ AI พิมพ์ ส่วนคุณตัดสินใจ ตัดสิน และจำ พอเห็นลูปนี้ คุณเลิกขอพร แล้วเริ่มกำกับเครื่องจักรได้จริง

จากนี้ไป บทที่เหลือของภาค A จะพาคุณไปดูชิ้นส่วนของเครื่องจักรนี้ทีละชิ้น เว็บแอปทำมาจากอะไร ไฟล์กับโปรเจกต์อยู่ตรงไหนในเครื่อง git เซฟประวัติยังไง เทอร์มินอลคืออะไร แล้วของขึ้นเว็บจริงได้ยังไง พอจบภาค A คุณจะเห็นเครื่องจักรครบทุกชิ้น ส่วนภาค B จะสอนเรื่องที่ยากกว่า คือทำยังไงให้สิ่งที่คุณสร้างอยู่รอด ไม่พังกลางทาง และโตได้โดยไม่กลายเป็นกองที่คุมไม่ได้

แหล่งอ้างอิง

• https://docs.anthropic.com/en/docs/claude-code/overview
• https://code.visualstudio.com/docs/editor/whatis