เบื่อรอหลังบ้าน! นักพัฒนาสร้างบริการ mockly ทำ Fake REST API ฟรี
นักพัฒนาฝั่งเฟรนต์เอนด์ผู้มีประสบการณ์ 3 ปี พัฒนา mockly บริการสร้าง Fake REST API ฟรี เพื่อแก้ปัญหาการรอระบบหลังบ้าน รองรับการกรองข้อมูล การเรียงลำดับ และการจำลอง HTTP Status
ภาพประกอบจากคลังภาพสต็อก ไม่ใช่ภาพจากเหตุการณ์จริง
- นักพัฒนาฝั่งเฟรนต์เอนด์สร้าง mockly แก้ปัญหาการรอแบ็กเอนด์
- เป็นบริการโฮสต์ Fake REST API ฟรี รองรับคำขอทั้ง GET, POST, PATCH, PUT และ DELETE
- รองรับฟีเจอร์ขั้นสูง เช่น การกรอง, การแบ่งหน้า, ความสัมพันธ์ และจำลองสถานะ HTTP
- ใช้งานง่ายเพียงเข้าสู่ระบบด้วย GitHub วางข้อมูล JSON และนำ URL ไปใช้ได้ทันที
หลังจากทำงานฝั่งเฟรนต์เอนด์มาเป็นเวลา 3 ปี นักพัฒนาซอฟต์แวร์รายหนึ่งพบว่าเกือบทุกโปรเจกต์มักเริ่มต้นด้วยปัญหาเดิมคือ ดีไซน์พร้อม แบบจำลองข้อมูลคุยกันเรียบร้อย แต่ระบบแบ็กเอนด์ยังไม่พร้อมใช้งานและมักจะบอกว่าต้องรออีก "สองสัปดาห์" ซึ่งทำให้ต้องแก้ปัญหาเฉพาะหน้าด้วยการสร้างโฟลเดอร์ src/mocks/ ใส่ข้อมูล JSON และหน่วงเวลา 300 มิลลิวินาที เพื่อให้สามารถทดสอบหน้าโหลดข้อมูลได้ชั่วคราว
ทว่าเมื่อแบ็กเอนด์ตัวจริงเสร็จ ชื่อตัวแปรมักจะไม่ตรงกัน เช่น เป็น user_name แทนที่จะเป็น userName หรือโครงสร้างรายการถูกห่อหุ้มด้วย { items, meta } แทนที่จะเป็นอาร์เรย์เปล่าๆ ทำให้ต้องเสียเวลามานั่งเขียนชั้น API ใหม่ทั้งหมดที่เคยคิดว่าแยกส่วนไว้อย่างดีแล้ว และบริการตัวเลือกเดิมที่เคยใช้งานก็มักล่มบ่อยครั้งเมื่อเกิดปัญหาเซิร์ฟเวอร์ล่ม 502 โดยไม่มีการอัปเดตที่ดีพอ
จุดนี้เองจึงเป็นที่มาของการพัฒนา mockly บริการโฮสต์ Fake REST API ที่สร้างขึ้นเพื่อตอบโจทย์การทำงานของนักพัฒนาโดยเฉพาะ โดยขั้นตอนการใช้งานเริ่มต้นเพียงแค่สมัครสมาชิกด้วยบัญชี GitHub สร้างโปรเจกต์ เพิ่มคอลเลกชันเช่น products แล้ววางอาร์เรย์ JSON ลงไป ก็จะได้ Endpoint สำหรับเรียกใช้งานทันทีที่ https://api.m0ckly.site/m/<publicId>/products
ภาพประกอบจากคลังภาพสต็อก ไม่ใช่ภาพจากเหตุการณ์จริง
บริการดังกล่าวพฤติกรรมจำลองจะเหมือน API ของจริงทุกประการ โดยรองรับการดึงข้อมูลทั้งรายการและเรกคอร์ดเดี่ยว รวมถึงรับคำขอแบบ POST, PATCH, PUT และ DELETE โดยระบบเซิร์ฟเวอร์จะทำการกำหนดค่า id ให้โดยอัตโนมัติ ไม่มีคีย์ ไม่มีส่วนหัวที่ซับซ้อน และเปิด CORS ไว้เรียบร้อยเพื่อให้สามารถเรียกใช้งานได้โดยตรงจากเบราว์เซอร์ พร้อมมีโปรเจกต์ตัวสาธิตสาธารณะให้ทดลองใช้งานได้ทันที
การพัฒนา Fake REST API แบบเฉพาะกิจขึ้นมาใช้งานเอง ถือเป็นแนวทางที่ช่วยร่นระยะเวลาและเพิ่มความยืดหยุ่นให้กับนักพัฒนาฝั่งเฟรนต์เอนด์อย่างมากในทางปฏิบัติ เพราะช่วยให้กระบวนการพัฒนา UI, การจัดการสถานะคำขอ (react-query hooks) และการทดสอบฟอร์มสามารถดำเนินต่อไปได้ก่อนที่ระบบหลังบ้านจะพัฒนาเสร็จสมบูรณ์ ซึ่งช่วยลดความเสี่ยงในการแก้ไขโค้ดโครงสร้างเครือข่ายครั้งใหญ่ในภายหลัง
แนวคิดหลักในการออกแบบ mockly คือการจำลองพฤติกรรมให้เหมือนกับแบ็กเอนด์ที่มีคุณภาพ โดยมีฟีเจอร์การจัดการข้อมูลที่โดดเด่นดังนี้:
- การกรองข้อมูล: รองรับการค้นหาแบบไม่สนตัวพิมพ์เล็กใหญ่ด้วย ?title=mouse, การใช้ wildcard เช่น ?title=*mouse*, ช่วงตัวเลขเช่น ?price_gte=20&price_lte=90 และการค้นหาทุกฟิลด์พร้อมกันด้วย ?q=mouse
- การเรียงลำดับและการแบ่งหน้า: รองรับพารามิเตอร์ ?sortBy=price&order=desc โดยเปรียบเทียบตัวเลขตามค่าทางคณิตศาสตร์ และรองรับการแบ่งหน้าด้วย page หรือ limit
- ความสัมพันธ์ของข้อมูล: รองรับการดึงข้อมูลความสัมพันธ์ เช่น ?_relations=user เพื่อฝังออบเจกต์จากคอลเลกชันอื่นลงในผลลัพธ์ทันที
- การจำลองการตอบกลับ: สามารถกำหนดค่าสถานะ HTTP ตั้งแต่ 100 ถึง 599 ได้ตามต้องการ เพื่อทดสอบการจัดการข้อผิดพลาดและระบบลองใหม่ (retry) ของเฟรนต์เอนด์
- ความปลอดภัยและทรัพยากรส่วนตัว: สามารถล็อกคอลเลกชันเพื่อจำลองระบบล็อกอินโดยต้องใช้โทเคน หรือเลือกเปิด/ปิดวิธีการเรียกใช้งาน (Read, Create, Update, Delete) ได้ตามต้องการ
ภาพประกอบจากคลังภาพสต็อก ไม่ใช่ภาพจากเหตุการณ์จริง
สถาปัตยกรรมเบื้องหลังของบริการนี้พัฒนาขึ้นด้วย Fastify, TypeScript และ PostgreSQL ร่วมกับ JSONB บน VPS ส่วนตัว โดยมีเฟรนต์เอนด์สร้างด้วย Next.js ทั้งนี้ บริการดังกล่าวไม่มีทีมขาย ไม่มีระดับราคา หรือแผนงานระยะยาว แต่เป็นเครื่องมือที่สร้างขึ้นจากความต้องการใช้งานจริงเพื่อช่วยเหลือนักพัฒนาด้วยกันเอง
ที่มา: Dev.to
พบข้อมูลผิดพลาดในบทความนี้? แจ้งปัญหาบทความนี้
ความคิดเห็น
แสดงความคิดเห็น