วันนี้ได้พูดคุยเรื่อง GraphQL กันนิดหน่อย
ซึ่งเป็นความรู้ใหม่ ๆ ที่ได้รับกลับมา
จึงกลับมานั่งสรุปในเรื่องพื้นฐานที่สำคัญประกอบไปด้วย
- GraphQL คืออะไรกันแน่ ?
- ทำไมเราต้องให้ความสนใจด้วยล่ะ ?
- มันจะทำให้ชีวิตนักพัฒนาดีขึ้นอย่างไร ?
มาเริ่มกันเลย
ปล. เริ่มด้วยการไปค้นหาข้อมูล จะเจอ link ที่ต้องอ่านคือ GraphQL Introduction
GraphQL คืออะไรกันแน่ ?
คือ query language หรือการเข้าถึงข้อมูลจาก API ของระบบ
query ต่าง ๆ จะถูกประมวลผลที่ฝั่ง server
และจะทำการตรวจสอบโครงสร้างของ query กับโครงสร้างข้อมูลที่ได้กำหนดไว้
นั่นหมายความว่า ผู้ให้บริการ API จะต้องทำการกำหนดโครงสร้างของข้อมูลไว้ก่อนเสมอ
ซึ่งเป็นหนึ่งปัญหาหลักของ REST API
ดังนั้น GraphQL จึงเป็นอีกหนึ่งทางเลือกในการสร้าง API ที่ดีกว่า REST
อีกทั้งไม่ได้ผูกติดกับ database และ ที่จัดเก็บข้อมูลใด ๆ ทั้งนั้น
ที่สำคัญมันไม่ใช่ query language สำหรับการดึงข้อมูลจาก database เหมือน SQL นะ
แต่มันเป็นภาษาสำหรับการดึงข้อมูลในระดับ application
ซึ่งสามารถทำงานร่วมกับระบบ backend ใด ๆ ก็ได้ เช่น
- SQL
- RDBMS
- NoSQL
- File system
- Existing system ใด ๆ ก็ได้
โดยรวมแล้ว มันคือ query language ที่มีโครงสร้างชัดเจน (Schema)
คุ้น ๆ กันไหมว่ามันคล้ายอะไร ?
เพื่อความเข้าใจมากยิ่งขึ้น มาสร้าง GraphQL server กันดีกว่า
ซึ่งใน community นั้นมีหลายภาษามาก ๆ
ในบทความนี้จะลองสร้างภาษา JavaScript
โดยตัวอย่าง source code อยู่ที่ Github::Hello GraphQL
สิ่งที่ต้องการสร้างแบบง่าย คือ
สร้าง API สำหรับดึงข้อมูลคะแนนสูงสุด ด้วย query ดังนี้
query getHighestScore {score}
ดังนั้นสิ่งที่เราต้องทำก่อนคือ กำหนด schema ของการ query กันก่อน ประกอบไปด้วย
- ชื่อของ query คือ getHighestScore
- โดย field ที่ต้องการคือ score
สามารถเขียน code ได้ดังนี้
จากนั้นทำการ start server และทดสอบ query ข้อมูลผ่าน curl ดังนี้
มีคำถามว่า ถ้าเราต้องการอยากรู้ว่า schema มีโครงสร้างอย่างไรบ้าง ? จะดูอย่างไร ?
โดยที่ GraphQL มีคำตอบให้คือ Introspection
ดังตัวอย่าง
ตัวอย่างนี้มันดูง่ายไป ดังนั้น ลองมาดูตัวอย่างยาก ๆ ขึ้นมานิดหน่อย
เป็นการดึงข้อมูลผู้ใช้งานทั้งหมดในระบบออกมา
โดยผู้ใช้งานแต่ละคนมีข้อมูลดังต่อไปนี้
- รหัส
- ชื่อ
- นามสกุล
- อายุ
query allUser {
id,
firstname,
lastname,
age
}
ผลลัพธ์ที่ต้องการเป็นดังนี้
ดังนั้นมาเริ่มสร้าง API กันดีกว่า
ขั้นตอนที่ 1 สร้าง UserType ขึ้นมาก่อน เพื่อกำหนดว่าผู้ใช้งานแต่ละคนมีโครงสร้างอย่างไร ดังนี้
ขั้นตอนที่ 2 สร้าง query ชื่อว่า allUser ขึ้นมาในส่วนของ query ดังนี้
ขั้นตอนที่ 3 ทำการ restart server และทดสอบผ่าน curl ได้ผลดังนี้
ตัวอย่างผู้ใช้งานสามารถเลือก field ที่ต้องการได้อีกด้วย
โดยจะให้แสดงผลข้อมูลเฉพาะ id และ firstname เท่านั้น
ตัวอย่างที่ผ่านมาคือ API ที่อ่านข้อมูลเพียงอย่างเดียวเท่านั้น
แต่ถ้าเราต้องการแก้ไข เพิ่มเติม และ ลบข้อมูลล่ะ จะทำอย่างไร ?
ซึ่งทาง GraphQL จะเรียกการทำงานเหล่านี้ว่า Mutations
เช่นต้องการทำ API สำหรับเพิ่มข้อมูลผู้ใช้งานขึ้นมา
จะต้องทำอย่างไร มาดูกัน
mutation addUser {
id: 4,
first name: “first name 04”,
last name: “last name 04”,
age: 40
}
สังเกตุว่าในการสร้าง addUser นั้น
จะต้องทำการกำหนด argument ด้วย
เหมือนกับการประกาศ function/method นั่นเอง
โดยหลังจากที่เพิ่มผู้ใช้งานใหม่ไปแล้ว
จะส่งข้อมูลผู้ใช้งานทั้งหมดกลับมาก
สามารถเขียน code ได้ดังนี้
จากนั้นทำการ run ผ่าน curl ได้ผลลัพธ์ดังนี้
เพียงเท่านี้ก็สามารถสร้าง GraphQL APIs แบบง่าย ๆ ได้แล้ว
และน่าจะพอทำให้เห็นภาพของ GraphQL มากขึ้นนะครับ
และยังมีรายละเอียดอีกมากมายให้ศึกษายกตัวอย่างเช่น
