เริ่มต้น Grafana กันในฉบับ Internship

nnueys
KBTG Life
Published in
3 min readJun 28, 2022

“พี่จะให้เนยมาช่วยทำในส่วน Custom Dashboard ที่ทีมใช้มอนิเตอร์ Automation Result นะ”

ก่อนอื่นขอแนะนำตัวกันก่อน ชื่อเนยนะคะ นักศึกษาปี 2 ภาควิชาวิทยาการคอมพิวเตอร์ คณะวิทยาศาสตร์ มหาวิทยาลัยเกษตรศาสตร์ เราได้เข้ามาเป็นส่วนหนึ่งของโครงการ KBTG Internship Bootcamp 2022 โดยทีมที่เนยได้ร่วมงานด้วยก็คือ Test Automation Core Team นั่นเองงง 😄🎉

คนส่วนใหญ่อาจจะคิดว่าการมาอยู่ในทีมนี้คงได้ทำงานในด้านเขียน Automated Test Scripts อย่างเดียวใช่มั้ยล่ะคะ แต่ไม่เลย! เราได้รับมอบหมายงานที่หลากหลายมากกว่านั้นแน่นอน ซึ่งงานที่เนยได้รับมอบหมายกลายมาเป็นหัวข้อที่เนยจะมาเล่าให้ทุกคนอ่านในวันนี้นั่นเองค่ะ

แรกสุดเรามาทำความรู้จักกับเครื่องมือที่เราจะใช้กันดีกว่า นั่นคือเจ้า Grafana นั่นเองค่ะ 💻

What is Grafana?

Grafana คือ Dashboard Tools ที่แสดงผลข้อมูลให้ออกมาเป็นตัวเลขหรือกราฟในแบบต่างๆ แต่ถ้าบอกแค่นี้ก็คงจะดูธรรมดาไปหน่อย ความพิเศษมากกว่านั้นของมันคือเราสามารถแสดงผลข้อมูลออกมาแบบเรียลไทม์และยังสามารถฟิลเตอร์ให้ออกมาแค่ผลลัพธ์ที่เราต้องการจะดูได้อีกด้วย!

หน้าตา Dashboard ของ Grafana

โดย Grafana จะมีแผนภาพมากกว่า 30 แบบให้เราเลือกใช้ตามความเหมาะสมของข้อมูลที่เราต้องการจะนำเสนอ ยิ่งกว่านั้นเรายังสามารถตั้งค่า Threshold เพื่อกำหนดการใช้สีต่างๆ กับข้อมูลตัวเลขที่มีเงื่อนไข ซึ่งเราสามารถกำหนดเองได้ด้วย เช่น ถ้าหากเราต้องการตั้งค่าให้ข้อมูลที่มีค่ามากกว่า 80 เป็นสีเขียว และให้ข้อมูลที่มีค่าน้อยกว่า 20 เป็นสีแดง เราก็สามารถกำหนดได้ตามที่เราต้องการเลย ✨

รู้จัก Grafana กันไปคร่าวๆ แล้ว มาดูกันต่อว่าเด็กฝึกงานแบบเราต้องทำอะไรกับมัน 🙌🏻 หน้าที่ที่เนยได้รับมอบหมายมาคือการสร้าง Dashboard สำหรับมอนิเตอร์ Quality Index นั่นเอง แต่เอาจริงคือเขาก็มีอยู่แล้วนะ แต่ด้วยข้อกำจัดในการเข้าถึงข้อมูลของ User เราจึงต้องเปลี่ยนมาใช้ Grafana 😆💾

First step!

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

เรามาเข้าเรื่องกันเลยดีกว่า… หลังจากที่พี่ๆ ได้มอบหมายงานมา เนยก็มานั่งศึกษาเกี่ยวกับ Tool ที่จะใช้ในการทำ Database และการใช้งานของ Grafana ว่าใช้งานยังไงอีกหน่อย โดย Tool ที่เราจะใช้กันในงานนี้คือ phpMyAdmin ซึ่งก็เป็นตัวเดียวกับที่เนยเคยใช้เรียน เลยพอคุ้นเคยกับตัว Tool อยู่บ้าง

เริ่มแรกเลยพี่ๆ จะให้ Data ที่ต้องการใส่มาเป็นไฟล์ Excel เพื่อมาดู Raw Data กันคร่าวๆ จากนั้นพี่ๆ ก็จะออกแบบ ER Diagram มาว่าแต่ละ Table ต้องการอะไรบ้าง ตัวไหนเป็น Primary Key/ Foreign Key ส่วนเนยจะรับหน้าที่ในการนำ Diagram ที่พี่ๆ ออกแบบมาสร้างเป็น Table ใน phpMyAdmin ต่อนั่นเอง 🤩👏🏻

Column ที่เราใส่ใน Table

พอสร้างครบทุก Table ที่ต้องการแล้ว เราก็นำข้อมูล Raw Data จาก Excel เข้ามาใน Table ค่ะ ปกติแล้วที่เคยเรียนมาเราจะนำเข้าโดยการพิมพ์ข้อมูลใส่ไปใช้มั้ยคะ แต่ในงานนี้พี่ๆ ได้สอนทริคใหม่ที่สามารถ Insert จากใน Excel แล้วให้ Excel ไล่ข้อมูลให้ เรามีหน้าที่แค่ Copy ตัวนั้นมาใส่เท่านั้นเอง 😆 เคล็ดลับนี้ทำให้เรา Insert ข้อมูลได้ไวขึ้นมากๆ เลย ✨ ถ้าเราติดตรงไหน เราก็สามารถถามพี่ๆ ได้ และพี่ๆ ก็จะเข้ามาดูให้ว่าเราทำตรงไหนผิดไปค่ะ

ข้อมูลที่ใส่ใน Table

หลังจากที่เราใส่ข้อมูลต่างๆใน Table ครบแล้ว ต่อจากนี้จะเป็นการนำข้อมูลที่มีมาแสดงผลใน Grafana

เราต้อง Select ข้อมูลที่ต้องการมาใส่ โดยที่ต้องใส่เงื่อนไขต่างๆ ให้โค้ดเราดึงข้อมูลตามที่เราฟิลเตอร์มาให้ตรง นำโค้ดนี้ไปใส่ใน Grafana จนได้มาเป็น Quality Index Dashboard นั่นเอง

ส่วนข้อมูลที่ต้องการแสดงแบบกราฟก็วางใจตัว Grafana ได้ เพราะเขาเองก็มีกราฟหลากหลายแบบให้เราเลือกใช้ 📈📉

รูปแบบต่างๆ ของการทำ Visualization

ในงานนี้เนยจะเลือก Gauge ข้อมูลที่ต้องการแสดงเป็นค่าตัวเลข และเลือก Bar Chart เพื่อแสดงกราฟแท่งค่ะ 💪🏻 โดยข้อมูลที่ต้องการแสดงเป็นตัวเลขหรือเปอร์เซ็นต์ เราสามารถตั้งค่าสีให้เปลี่ยนตามเงื่อนไขที่เราตั้งไว้ที่ Threshold ได้อีกด้วย

หลังจากที่เราได้นำโค้ด SQL ใส่แล้ว ข้อมูลที่เราต้องการจะปรากฎที่หน้า Panel ทันที ทำให้เราสามารถเช็คความถูกต้องของข้อมูลที่เราต้องการอีกด้วย 👩🏻‍💻 และนี่ก็คือหน้า Dashboard ที่เนยสร้างขึ้นมาค่ะ

ซึ่งที่ทำทั้งหมดนี้ก็เป็นเพียงเฟสแรก เพื่อเป็น POC ว่าการย้ายข้อมูลมาใช้ Grafana จะเวิร์คกว่าแบบเก่ารึเปล่า 🤨 จากที่ทุกคนได้อ่านกันไปก็เห็นได้ชัดเลยว่าเจ้า Grafana เนี่ยใช้งานแสนง่ายขนาดไหน ขนาด Intern อย่างเราที่เริ่มต้นจากศูนย์ยังทำออกมาเป็นหน้า Dashboard ได้เลย เป็น Tool ที่ไม่ซับซ้อนและใช้งานสะดวกสุดๆ และที่สำคัญ Grafana เป็น Open Source 100%! เพียงแค่นี้ Dashboard ของเราก็สามารถใช้งานได้จริงแล้ว ไม่ยากเลยใช่มั้ยคะ 🤪

สุดท้ายนี้เนยก็ขอฝากบทความนี้ไว้ในอ้อมอกอ้อมใจของทุกคนด้วยนะคะ นี่เป็นการเขียนบทความครั้งแรกของเนยเลย หวังว่าทุกคนจะได้ประโยชน์และ Enjoy ไปกับบทความนี้ค่ะ 💖🙆🏻‍♀️

สำหรับชาวเทคคนไหนที่สนใจเรื่องราวดีๆแบบนี้ หรืออยากเรียนรู้เกี่ยวกับ Product ใหม่ๆ ของ KBTG สามารถติดตามรายละเอียดกันได้ที่เว็บไซต์ www.kbtg.tech

--

--