DEV Community

Cover image for Bruno Request First Design First Tool
Thanawat Wongchai
Thanawat Wongchai

Posted on • Originally published at apidog.com

Bruno Request First Design First Tool

Bruno เป็นเครื่องมือแบบ request-first: คุณสร้างคอลเลกชัน เพิ่มคำขอ HTTP เก็บเป็นไฟล์ .bru รันคำขอ และจัดการเวอร์ชันผ่าน Git ได้สะดวก เหมาะมากเมื่อคุณต้องสำรวจหรือทดสอบ API ที่มีอยู่แล้ว แต่ถ้าทีมกำลังออกแบบ API ใหม่ หรือ API ที่หลายทีมต้องใช้ร่วมกัน คุณจะต้องตอบคำถามอีกแบบหนึ่ง: endpoint นี้ควรมีสัญญาอย่างไรก่อนเริ่มเขียนโค้ด?

ลองใช้ Apidog วันนี้

บทความนี้สรุปวิธีเลือกเวิร์กโฟลว์ระหว่าง Bruno แบบ request-first กับแนวทาง design-first ที่อิง OpenAPI พร้อมตัวอย่างขั้นตอนที่นำไปใช้ได้จริงเมื่อทีมต้องการออกแบบ ตรวจสอบ และดูแล API contract ตั้งแต่ต้น

Request-first เทียบกับ Design-first แบบรวดเร็ว

ทั้งสองแนวทางไม่ได้แทนที่กันโดยตรง แต่เหมาะกับจุดเริ่มต้นคนละแบบ:

มิติ Request-first (Bruno) Design-first (OpenAPI-native)
สิ่งเริ่มต้น คำขอที่ส่งได้จริง สัญญา API หรือ OpenAPI spec
เหมาะกับ สำรวจและทดสอบ API ที่มีอยู่แล้ว ออกแบบ API ใหม่/API ที่ใช้ร่วมกันก่อนเขียนโค้ด
แหล่งข้อมูลหลัก คอลเลกชันของคำขอ ไฟล์ spec
การรีวิวข้ามทีม มักเกิดหลัง endpoint มีอยู่แล้ว ทำได้ก่อนเขียน server implementation
การออกแบบด้วยภาพ ไม่มีโดยค่าเริ่มต้น มีเครื่องมือออกแบบ endpoint, schema, response
ความเสี่ยง contract drift คอลเลกชันอาจตาม API จริงไม่ทัน Spec เป็นสัญญากลางที่ทีมตรวจสอบร่วมกัน
Git workflow แข็งแกร่งด้วยไฟล์ .bru แข็งแกร่งเมื่อ sync OpenAPI spec กับ Git

หลักการตัดสินใจแบบเร็ว:

  • ถ้าคุณ เรียกใช้ API ที่มีอยู่แล้ว → request-first มักเร็วกว่า
  • ถ้าคุณ กำลังนิยาม API ที่คนอื่นต้องพึ่งพา → design-first จะลดการแก้กลับภายหลัง
  • ถ้าคุณต้องการ รีวิวผ่าน PR ก่อน backend พร้อมใช้งาน → ใช้ OpenAPI spec เป็น contract กลาง

โมเดล request-first ของ Bruno

Bruno เก็บคำขอเป็นไฟล์ข้อความธรรมดาในรูปแบบ .bru ภายในโฟลเดอร์ที่คุณควบคุมเอง จุดเด่นคือ local-first, Git-friendly และไม่บังคับใช้ cloud sync หรือระบบ proprietary sync เหมาะกับทีมที่ต้องการให้ API client ทำงานเหมือนส่วนหนึ่งของ codebase อ่านเพิ่มเติมเกี่ยวกับแนวคิดนี้ได้ใน เวิร์กโฟลว์ API ที่เป็นแบบ Git-native

งานที่ Bruno ทำได้ดี:

  • สำรวจ API ที่มีอยู่: ใส่ URL, ส่ง request, ดู response, ปรับ payload แล้วรันซ้ำ
  • เก็บ request ใน Git: diff อ่านได้, review ผ่าน PR ได้, merge กับ codebase ได้
  • ทดสอบ request ระดับทีม: ใช้ pre-request script, post-response script, assertions และ environment variables
  • ลด vendor lock-in: ไฟล์อยู่ใน repo ของคุณ และใช้รูปแบบข้อความธรรมดา

ตัวอย่างสถานการณ์ที่ request-first เหมาะ:

1. Backend มี endpoint /users อยู่แล้ว
2. Developer สร้าง request GET /users ใน Bruno
3. เพิ่ม environment เช่น local, staging, production
4. เขียน assertion ตรวจ status code และ response body
5. commit ไฟล์ .bru เข้า repo
Enter fullscreen mode Exit fullscreen mode

ถ้างานหลักคือการ บริโภค และ ตรวจสอบ API ที่มีอยู่แล้ว Bruno เป็นทางเลือกที่ตรงไปตรงมา บทวิเคราะห์เพิ่มเติมอยู่ใน การวิเคราะห์ทางเลือกของ Bruno นี้

ต้นทุนของการไม่มีชั้นการออกแบบหรือสัญญา

ปัญหาจะเริ่มชัดเมื่อ API ยังไม่มีอยู่จริง หรือเมื่อหลายทีมต้องตกลงเรื่อง contract ร่วมกันก่อนเขียนโค้ด

1. ไม่มีพื้นที่ออกแบบ contract ตั้งแต่ต้น

เครื่องมือ request-first มอง endpoint เป็นตัวอย่าง request/response ไม่ใช่โมเดลทรัพยากร สคีมา และข้อกำหนดของ API แบบเต็มรูปแบบ

ตัวอย่างเช่น ถ้าทีมกำลังออกแบบ POST /orders สิ่งที่ต้องตกลงกันไม่ใช่แค่ body ตัวอย่าง แต่รวมถึง:

paths:
  /orders:
    post:
      summary: Create order
      requestBody:
        required: true
      responses:
        "201":
          description: Order created
        "400":
          description: Invalid request
Enter fullscreen mode Exit fullscreen mode

ถ้าไม่มี contract กลาง ทีมอาจเข้าใจไม่ตรงกันว่า:

  • field ไหน required
  • error response หน้าตาอย่างไร
  • status code ใดควรใช้
  • schema ใด reuse ได้
  • breaking change คืออะไร

2. เกิด contract drift ได้ง่าย

ถ้าคอลเลกชัน request เป็นแหล่งข้อมูลหลัก มันจะสะท้อนเฉพาะ request ที่เคยถูกสร้างหรือรันไว้ แต่ API จริงอาจเปลี่ยนไปแล้ว เช่น:

  • backend เพิ่ม required field ใหม่
  • เปลี่ยน validation rule
  • deprecate query parameter
  • เปลี่ยน response schema

ผลลัพธ์คือ request collection อาจล้าหลัง API จริง จนกว่าการทดสอบจะล้มเหลว

ใน workflow แบบ spec-first/design-first แนวคิดจะกลับกัน:

OpenAPI spec → review → mock/docs/code generation → implementation → validation
Enter fullscreen mode Exit fullscreen mode

Spec จึงเป็นสัญญากลาง ไม่ใช่เอกสารที่สร้างตามหลังจาก implementation

3. รีวิวข้ามทีมทำได้ยากก่อนเขียนโค้ด

การรีวิวโฟลเดอร์ request ช่วยให้เห็นว่า endpoint ถูกเรียกอย่างไร แต่ไม่ได้บังคับให้ทีมตกลงเรื่อง API contract อย่างเป็นระบบก่อนเริ่ม implementation

ถ้าทีม frontend ต้องเริ่มงานก่อน backend พร้อมใช้งาน สิ่งที่ต้องการคือ:

  • OpenAPI spec ที่ชัดเจน
  • mock server จาก contract
  • เอกสารที่ generate ได้
  • schema ที่ตรวจสอบได้
  • PR review สำหรับการเปลี่ยน contract

นี่คือจุดที่ design-first ให้ประโยชน์มากกว่า request-first

เมื่อ design-first ได้เปรียบ

Design-first เหมาะเป็นพิเศษในสามกรณีนี้

1. Greenfield API

เมื่อยังไม่มี API จริง ให้เริ่มจาก contract ก่อน:

1. นิยาม resource และ endpoint
2. กำหนด request schema
3. กำหนด response schema
4. ระบุ error format
5. review spec กับทีมที่เกี่ยวข้อง
6. generate mock/docs/stub จาก spec
7. เริ่ม implementation
Enter fullscreen mode Exit fullscreen mode

ตัวอย่าง OpenAPI schema แบบย่อ:

components:
  schemas:
    User:
      type: object
      required:
        - id
        - email
      properties:
        id:
          type: string
        email:
          type: string
          format: email
Enter fullscreen mode Exit fullscreen mode

เมื่อ schema นี้เป็น contract กลาง ทุกทีมจะอ้างอิงโครงสร้างเดียวกัน

2. API ที่หลายทีมใช้ร่วมกัน

ถ้า backend, frontend, mobile หรือ partner team ต้องทำงานคู่ขนานกัน OpenAPI spec ช่วยให้ frontend เริ่มจาก mock ได้ทันทีหลัง contract ผ่านการอนุมัติ โดยไม่ต้องรอ endpoint จริง

Workflow ที่ใช้ได้จริง:

Backend team     → เสนอ OpenAPI spec
Frontend team    → review response shape
Mobile team      → review required fields
Platform/API team→ review naming, versioning, error format
ทุกทีม           → approve ผ่าน PR
Enter fullscreen mode Exit fullscreen mode

3. Public API

สำหรับ API สาธารณะ เอกสารและความเสถียรคือส่วนหนึ่งของ product contract ที่ดูแลดีช่วยให้:

  • generate documentation ได้
  • สื่อสาร breaking changes ได้ชัดเจน
  • ควบคุม versioning ได้
  • ลด ambiguity สำหรับนักพัฒนาภายนอก

สรุป: design-first ได้เปรียบเมื่อ API เป็นอินเทอร์เฟซที่หลายคนต้องตกลงกัน ก่อน เขียนโค้ด ไม่ใช่แค่ endpoint ที่คุณทดลองเรียก หลัง deploy แล้ว

Apidog design-first พร้อมโหมด Spec-First

Apidog ถูกสร้างขึ้นบนแนวคิด design-first โดยยังรองรับ workflow ที่เป็น OpenAPI-native และ Git-friendly

ในโปรเจกต์เดียวกัน ทีมสามารถทำงานได้สองแบบ:

  1. Visual API design

    ใช้ UI เพื่อกำหนด endpoint, request schema, response schema และ reusable components โดยไม่ต้องเขียน YAML เองทั้งหมด

  2. Spec-First mode

    แก้ OpenAPI document โดยตรงผ่าน code editor โดยให้ spec เป็นแหล่งข้อมูลหลัก

ทั้งสองมุมมองซิงค์กัน ทำให้ backend engineer ทำงานกับ OpenAPI ดิบได้ ขณะที่ product engineer หรือ frontend engineer ตรวจ contract ผ่านพื้นที่ออกแบบเดียวกัน

ตัวอย่าง workflow:

1. สร้างหรือ import OpenAPI spec ใน Apidog
2. ออกแบบ endpoint และ schema ผ่าน visual editor หรือ Spec-First mode
3. Sync spec กับ Git repository
4. เปิด PR เพื่อรีวิว API contract
5. หลัง approve แล้ว generate mock/docs หรือเริ่ม implementation
6. ทดสอบ endpoint จริงเทียบกับ contract
Enter fullscreen mode Exit fullscreen mode

โหมด Spec-First รองรับการซิงค์ Git แบบสองทาง ทำให้ OpenAPI spec อยู่ใน repository เป็นไฟล์จริง การเปลี่ยนแปลงไหลได้ทั้งจาก Apidog ไป Git และจาก Git กลับเข้า Apidog กลไกนี้อธิบายไว้ใน เอกสารประกอบโหมด Spec-First

ผลลัพธ์คือทีมสามารถใช้ workflow เดียวเพื่อ:

  • ออกแบบ contract ก่อน implementation
  • review API ผ่าน Git และ PR
  • สร้าง mock/documentation จาก spec
  • ทดสอบ endpoint จริงเมื่อพร้อมใช้งาน
  • ลดการแยกกันระหว่าง request collection กับ API contract

อ่านเพิ่มเติมเกี่ยวกับความต่างของโมเดลเหล่านี้ได้ที่ spec-first เทียบกับ design-first ใน Apidog

การเลือกตามวุฒิภาวะของทีม

เลือกเครื่องมือจากสถานะของ API ไม่ใช่จากความชอบส่วนตัว

ทีมเดี่ยวหรือทีมเล็กที่เน้นใช้ API

ถ้าทีมส่วนใหญ่เรียกใช้ API ที่มีอยู่แล้ว:

เลือก request-first
Enter fullscreen mode Exit fullscreen mode

Bruno เพียงพอสำหรับงานสำรวจ ทดสอบ และเก็บ request ใน Git โดยไม่ต้องเพิ่มภาระเรื่อง formal contract

ทีมที่เริ่มส่งมอบ API ให้ทีมอื่น

เมื่อมีทีมที่สองเริ่มพึ่งพา endpoint ของคุณ:

เริ่มเพิ่ม OpenAPI contract
Enter fullscreen mode Exit fullscreen mode

จุดนี้คอลเลกชัน request อย่างเดียวมักไม่พอ เพราะทีมต้องตกลงเรื่อง schema, error format และ versioning ก่อน implementation

องค์กรที่มี API จำนวนมากหรือ Public API

ถ้ามี API ภายในจำนวนมาก หรือเปิด API ให้นักพัฒนาภายนอกใช้:

ใช้ design-first / OpenAPI-native workflow
Enter fullscreen mode Exit fullscreen mode

Spec จะกลายเป็นศูนย์กลางของ governance, documentation, onboarding และ change management

เช็กลิสต์สำหรับเลือก workflow

ใช้รายการนี้ก่อนเลือกเครื่องมือหรือปรับ workflow:

[ ] API มีอยู่แล้วหรือยัง?
[ ] มีมากกว่าหนึ่งทีมต้องใช้ API นี้หรือไม่?
[ ] ต้อง review contract ก่อน backend พร้อมใช้งานหรือไม่?
[ ] ต้อง generate mock หรือ documentation จาก spec หรือไม่?
[ ] ต้องเก็บ API contract ใน Git หรือไม่?
[ ] ต้องควบคุม breaking changes หรือ versioning หรือไม่?
Enter fullscreen mode Exit fullscreen mode

ถ้าคำตอบส่วนใหญ่คือ “ใช่” โดยเฉพาะเรื่องหลายทีม, review ก่อน implementation และ Git-based contract ให้พิจารณา design-first/OpenAPI-native workflow

คำถามที่พบบ่อย

Bruno เป็นแบบ request-first หรือ design-first?

Bruno เป็นแบบ request-first โมเดลหลักคือการสร้าง จัดระเบียบ และส่ง HTTP request ที่เก็บเป็นไฟล์ข้อความธรรมดา เหมาะกับการสำรวจและทดสอบ API ที่มีอยู่แล้ว ไม่ได้มุ่งเน้นการสร้าง OpenAPI contract ก่อนเริ่มสร้าง API

ฉันสามารถทำงานแบบ design-first ใน Bruno ได้หรือไม่?

ไม่ได้โดยธรรมชาติในแบบที่เครื่องมือที่เน้น spec ทำ Bruno มุ่งเน้นคำขอมากกว่า visual API design หรือการใช้ OpenAPI spec เป็นแหล่งข้อมูลหลัก ถ้าคุณต้องกำหนด ตรวจสอบ และอนุมัติ contract ก่อนเขียนโค้ด เครื่องมือ design-first ที่เป็น OpenAPI-native จะเหมาะกว่า

ฉันต้องละทิ้งความเป็นมิตรกับ Git เพื่อใช้ design-first หรือไม่?

ไม่จำเป็น คุณสามารถเก็บ OpenAPI spec เป็นไฟล์ใน repository, review ผ่าน PR, ดู diff และจัดการ version ได้เหมือนโค้ด โหมด Spec-First ของ Apidog รองรับการซิงค์ Git แบบสองทาง ดังนั้น design-first ไม่ได้หมายความว่าต้องทิ้ง Git workflow

สรุปควรเลือกอะไร?

  • ใช้ request-first เมื่อคุณต้องการเรียก ทดสอบ และ debug API ที่มีอยู่แล้ว
  • ใช้ design-first เมื่อคุณต้องออกแบบ API contract ก่อน implementation
  • ใช้ OpenAPI-native + Git sync เมื่อ API เป็นสัญญาที่หลายทีมต้องพึ่งพา

Top comments (0)