Hooks — ทำงานอัตโนมัติทุก Action

Hooks คืออะไร? ทำไมต้องใช้?

ลองจินตนาการว่าคุณมีเลขาส่วนตัวที่ฉลาดมาก ๆ ชื่อ Claude เลขาคนนี้ไม่เพียงแค่ทำงานที่คุณสั่ง แต่ยังรู้ว่าหลังจากทำงานชิ้นหนึ่งเสร็จแล้ว ควรจะทำอะไรต่อโดยอัตโนมัติ นี่แหละครับคือหลักการทำงานของ Hooks (ฮุกส์) ใน Claude Code

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

รู้จักประเภทของ Hooks ใน Claude

ใน Claude Code มี Hooks หลัก ๆ อยู่ 3 ประเภท ที่จะทำงานในจังหวะที่แตกต่างกัน ลองนึกภาพว่าเป็นจุดเช็กพอยต์ในกระบวนการทำงานของ Claude นะครับ

1. PreToolUse (ก่อนใช้เครื่องมือ): Hook ประเภทนี้จะทำงาน 'ก่อน' ที่ Claude จะใช้เครื่องมือบางอย่าง เช่น ก่อนที่ Claude จะเริ่มแก้ไขไฟล์ คุณอาจจะใช้ Hook นี้เพื่อตรวจสอบว่าไฟล์นั้นล็อกอยู่หรือไม่ หรือมีสิทธิ์แก้ไขได้หรือเปล่า เหมือนกับการที่เลขาตรวจสอบเอกสารก่อนส่งให้เจ้านายเซ็น เพื่อให้แน่ใจว่าทุกอย่างถูกต้อง

2. PostToolUse (หลังใช้เครื่องมือ): Hook นี้จะทำงาน 'หลังจาก' ที่ Claude ใช้เครื่องมือเสร็จแล้ว เช่น หลังจากที่ Claude แก้ไขไฟล์โค้ดเสร็จเรียบร้อย นี่เป็นประเภทที่นิยมใช้มากที่สุด เพราะเรามักจะอยากทำอะไรบางอย่างต่อจากงานที่เพิ่งเสร็จ เช่น รันการทดสอบโค้ด หรือจัดรูปแบบโค้ดให้สวยงาม

3. Stop (เมื่อหยุดทำงาน): Hook ประเภทนี้จะทำงาน 'เมื่อ' Claude ทำงานทั้งหมดที่ได้รับมอบหมายเสร็จสิ้นแล้ว ไม่ว่าจะเป็นงานเล็กหรืองานใหญ่ เหมือนกับการที่เลขาแจ้งคุณว่างานทั้งหมดที่สั่งไว้เสร็จเรียบร้อยแล้ว คุณอาจจะใช้ Hook นี้เพื่อส่งข้อความแจ้งเตือนตัวเองว่างานเสร็จแล้ว หรือสั่งให้ Claude ทำการ Deploy (นำโค้ดขึ้นระบบจริง) เป็นต้น

การตั้งค่า Hooks: ไฟล์ settings.json คือหัวใจ

การจะบอก Claude ว่าต้องทำอะไรเมื่อไหร่ เราจะต้องไปเขียนคำสั่งในไฟล์พิเศษที่ชื่อว่า settings.json ครับ ไฟล์นี้เปรียบเสมือน 'คู่มือการทำงานส่วนตัว' ของ Claude ที่เราสามารถปรับแต่งได้เอง

ไฟล์ settings.json เป็นไฟล์รูปแบบ JSON ซึ่งเป็นวิธีจัดเก็บข้อมูลที่อ่านง่ายสำหรับทั้งคนและคอมพิวเตอร์ คุณจะต้องระบุว่าคุณต้องการให้ Hook ทำงานในประเภทไหน (เช่น PostToolUse) และเมื่อเกิดเหตุการณ์อะไรขึ้น (เช่น แก้ไขไฟล์) แล้วจะให้รันคำสั่งอะไร

ตัวอย่างแรก: รัน Test อัตโนมัติหลังแก้โค้ด

มาดูตัวอย่างยอดนิยมกันครับ สมมติว่าคุณอยากให้ Claude รันคำสั่ง npm test (ซึ่งเป็นคำสั่งสำหรับรันการทดสอบโค้ด) ทุกครั้งที่ Claude แก้ไขหรือเขียนไฟล์เสร็จแล้ว คุณจะต้องเพิ่มส่วนนี้เข้าไปในไฟล์ settings.json ของคุณ:

ในโค้ดนี้ "hooks" คือส่วนที่เราจะกำหนด Hook ทั้งหมด "PostToolUse" บอกว่า Hook นี้จะทำงานหลังใช้เครื่องมือเสร็จ "matcher": "Edit|Write" คือเงื่อนไขที่บอกว่าให้ทำงานเมื่อ Claude 'Edit' (แก้ไข) หรือ 'Write' (เขียน) ไฟล์ และ "hooks": [{"type":"command","command":"npm test"}] คือคำสั่งที่เราต้องการให้รัน ซึ่งในที่นี้คือรันคำสั่ง npm test นั่นเองครับ

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

1. เปิดไฟล์ settings.json โดยปกติแล้วไฟล์นี้จะอยู่ในโฟลเดอร์โปรเจกต์ของคุณ
2. เพิ่มโค้ด Hooks นี้เข้าไปในไฟล์ settings.json ของคุณ (ถ้ามีส่วน "hooks" อยู่แล้ว ให้เพิ่มเข้าไปในส่วนนั้น)
3. บันทึกไฟล์ settings.json
4. ลองให้ Claude แก้ไขไฟล์โค้ดอะไรก็ได้ในโปรเจกต์ของคุณ แล้วสังเกตว่า Claude จะรัน npm test ให้โดยอัตโนมัติ

ลองให้ Claude ช่วยตั้งค่า Hooks เอง

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

เพียงแค่คุณบอก Claude อย่างชัดเจนว่าคุณต้องการให้ Hook ทำอะไร เมื่อไหร่ และรันคำสั่งอะไร Claude ก็จะสร้างโค้ดที่ถูกต้องให้คุณนำไปใส่ในไฟล์ settings.json ได้เลย วิธีนี้ช่วยให้คุณไม่ต้องกังวลเรื่องไวยากรณ์ของ JSON มากนัก

1. คัดลอก Prompt ตัวอย่างนี้

   พิมพ์ Prompt นี้

   'ช่วยตั้งค่า hook ใน settings.json ให้หน่อย: ทุกครั้งที่แก้ไฟล์ .ts (ไฟล์ TypeScript) ให้รันคำสั่ง prettier และ eslint อัตโนมัติ'คัดลอก
2. วาง Prompt ที่คัดลอกมาลงในช่องแชทของ Claude แล้วกด Enter
3. Claude จะสร้างโค้ด JSON สำหรับ Hook ที่คุณต้องการ คุณสามารถคัดลอกโค้ดนั้นไปวางในไฟล์ settings.json ของคุณได้เลย แต่ควรตรวจสอบโค้ดที่ Claude สร้างให้ก่อนเสมอ

เคล็ดลับ Hooks ยอดนิยมและสรุป

Hooks มีประโยชน์มากในหลายสถานการณ์ นี่คือ Hooks ยอดนิยมที่คุณอาจจะเจอ:

1. Auto-format โค้ด: หลังแก้ไฟล์ ให้รันคำสั่งจัดรูปแบบโค้ด (เช่น Prettier) เพื่อให้โค้ดสวยงามและเป็นระเบียบเสมอ

2. รัน Test หลังเขียนโค้ด: หลังเขียนหรือแก้ไขโค้ด ให้รันการทดสอบอัตโนมัติ เพื่อเช็กว่าโค้ดใหม่ไม่ทำให้ส่วนอื่น ๆ เสียหาย

3. แจ้งเตือนเมื่อเสร็จงานยาว ๆ: เมื่อ Claude ทำงานที่ใช้เวลานานเสร็จ ให้ส่งข้อความแจ้งเตือนคุณผ่านช่องทางที่คุณตั้งค่าไว้

สรุปแล้ว Hooks คือพลังวิเศษที่ทำให้ Claude Code เป็นผู้ช่วยที่ทำงานแบบอัตโนมัติได้อย่างแท้จริง คุณสามารถกำหนดให้ Claude ทำอะไรบางอย่างโดยอัตโนมัติในจังหวะต่าง ๆ ของการทำงาน ไม่ว่าจะเป็นก่อนใช้เครื่องมือ หลังใช้เครื่องมือ หรือเมื่อทำงานเสร็จสิ้น การตั้งค่าทั้งหมดนี้ทำได้ง่าย ๆ ในไฟล์ settings.json และคุณยังสามารถให้ Claude ช่วยสร้างโค้ดสำหรับ Hooks ให้ได้อีกด้วย!