Routes & Directory Structure

Mon 01 Jul 2024  

🎉 Hi: ... 🎉

Routes & Directory Structure

TIP

กำหนดแนวปฎิบัติการสร้างแฟ้มให้สอดคล้องกับ route เนื่องจาก Front-end และ Back-end จะต้องใช้โดเมนเดียวกันและใช้โดเมนร่วมกันหลายระบบ

Front-end

• Pages: จะต้องสร้างแฟ้ม โดยตั้งชื่อโปรเจคก่อนเสมอ

  ตัวอย่าง Directory Structure

Back-end

• routes: จะต้องสร้างแฟ้ม โดยตั้งชื่อโปรเจคก่อนเสมอ

  ตัวอย่าง Directory Structure

WARNING

Front-end ห้ามใช้ชื่อ route /.../api สำหรับการเข้าใช้งาน

เพราะอาจจะทำให้ไปซ้ำซ้อนกับ route ของ Back-end และจะทำให้ใช้งานไม่ได้

Front-end NuxtJS

• Kong route: /complaint
• Front-end URI: /complaint/home

Directory Structure

├── components
│   └── complaint
|   |   └── HomeComponent.vue
└── pages
    └── complaint
        └── home
            └── HomePage.vue

Back-end Fastify

• Kong route: /complaint/api
• Back-end URI: /complaint/api/v1/home

Directory Structure

├── routes
|   └── complaint
|   |    └── api
|   |        └── V1
|   |            └── home
|   |                └── home.js
└── services
    └── v1
        └── home
            └── home.js