About

Connecting GraphCMS Webhooks to Netlify's Build Hooks

Jun 15th, 2022

1 min read

ในโพสต์ที่แล้วได้เล่าถึงวิธี Deploy แบบ manual ผ่านทาง GraphQL กันไปแล้วนะคะ โพสต์นี้ก็จะเล่าถึงวิธีการ Automate Build & Deploy กันบ้าง โดยเราจะใช้สิ่งที่เรียกว่า Webhook ค่ะ

Webhooks เป็นวิธีการคอยจับตาดูการเปลี่ยนแปลงของเนื้อหาว่ามีการอัพเดทอยู่หรือไม่ เราสามารถใช้ Webhooks นี้มาช่วย Trigger ให้ Deploy static website ให้เราอัตโนมัติค่ะ

เริ่มกันเลย 🙂

ที่ Netlify ให้ไปที่เมนู Build & deploy แล้วไปที่หัวข้อ Build hooks ใน section นี้ Build hooks จะให้ url สำหรับการ trigger Build & deploy มา ให้เรา copy url นี้แล้วไปที่ GraphCMS ค่ะ

Copy build hook url

Build hooks จะให้ url สำหรับการ trigger Build & deploy

ใน GraphCMS ให้ไปที่เมนู Webhooks จากนั้นคลิกที่ Create เพื่อสร้าง Webhook ค่ะ

เมนู Webhooks ใน GraphCMS

เมนู Webhooks ใน GraphCMS

เราจะนำ Build hook url ที่เรา copy มาจาก Netlify มาใช้ในการสร้าง Webhook นี้ค่ะ ในการสร้างนี้ เราสามารถกำหนดได้ว่าจะให้ Trigger deploy ในการอัพเดท model ไหนได้บ้าง ในรูปข้างล่างนี้ จะ Trigger เมื่อมีการแก้ไข เพิ่ม ลบ หรืออัพเดท post, page, gallery, category และ User

Screen Shot 2565-06-15 at 23.10.13.png

ตัวอย่างการสร้าง Webhooks

หลังจากนี้เมื่อมีการแก้ไข เพิ่ม ลบ หรืออัพเดท ใน model ที่เราเพิ่ม webhook ไว้ เช่น  อัพเดทโพสต์ ตัว Build hook ของ Netlify ก็จะไปสั่งให้ Deploy เว็บไซต์ของเราอัตโนมัติค่ะ


Related Posts