Flow Do Assessment Suggest Service Center - Kanapakan/MoodMent-Project-SW-dev-tool GitHub Wiki

Do Assessment Suggest Service Center = ผู้ใช้สามารถทำแบบประเมินคัดกรองภาวะซึมเศร้า เพื่อดูสถานที่ให้บริการด้านสุขภาพจิตที่แนะนำ

User Flow

1. เมื่อ User เข้าใช้งานเว็บก็จะพบกับหน้า Main
2. ในหน้า Main จะแสดง Assessment Modal
3. Click ปุ่มเพื่อทำแบบประเมิน จาก Assessment Modal ในหน้า Main เพื่อไปยังหน้าทำแบบประเมิน (Do Assessment Page)
4. หน้าเว็บจะแสดง Disclaimer เพื่อให้ผู้ใช้รับทราบและกดยืนยัน
5. User ทำแบบประเมินเสร็จเรียบร้อยและกดประเมินผล
6. หน้าเว็บแสดงผลการทำแบบประเมินแก่ User โดยจะมีให้เลือกว่าจะย้อนกลับหน้าหลัก (Back to Home) หรือทำแบบประเมินต่อไป (Next to ?Q) หรือต้องการดูสถานที่ให้บริการที่แนะนำ (Suggest Service Center)
7. กรณีที่ User เลือกดูสถานที่ให้บริการที่แนะนำ (Suggest Service Center) และทำการเลือกสถานที่ที่สนใจ ตัวเว็บไซต์ก็จะนำพาไปยังหน้ารายละเอียดของสถานที่บริการ

UI Flow

Acceptance Tests

View more Do Assessment Suggest Service Center Acceptance Tests

Technical

Frontend

• Ui For Frontend

1. Design
2. เขียนโค้ดโดยใช้ React โดยเริ่มจากการสร้าง Component ที่จำเป็นและวาง Route ของแต่ละหน้า จากนั้นจึง Implement แต่ละหน้าตาม User Flow
3. Test ใช้ Acceptance Test ในการตรวจสอบการทำงานของ Website ว่าตรงกับ Business Logic ของโปรเจคหรือไม่
4. Deploy โดยใช้ Docker ในการ Deploy

Backend

1. Design API
   • Do Assessment Page
     • getServiceCenterByLocation
   • Service Center Info Page
     • getServiceCenterById
     • getReviewByServiceCenterId
2. เขียนโค้ดโดยใช้ NestJS
3. Test API ด้วย Postman
4. Deploy โดยใช้ Docker ในการ Deploy

Database

• MoodMent DBdiagram

Flow นี้มีการใช้ข้อมูลจากตาราง ดังนี้

• SERVICE_CENTER Table
• REVIEW Table
• FAVORITE Table

Deployment on Target Server

• Deploy on DigitalOcean

1. เขียน GitHub Action สำหรับการ Continuous Delivery และ Continuous Deployment
2. Setting Infrastructure บน DigitalOcean โดยติดตั้ง Docker
3. Run Container Traefik สำหรับทำ Reverse proxy
4. สร้าง docker-compose สำหรับรัน front-end และ back-end

GitHub Action จะรันก็ต่อเมื่อมีการ create releases

• Visit MoodMent Here!

Review

• Navbar ยังแสดงผลได้ไม่ถูกต้อง ในส่วนที่เป็นเส้นใต้ชื่อหน้า
• Result Modal มีขนาดที่ไม่พอดีสำหรับขนาดหน้าจอบางเครื่อง
• กรณีที่อินเทอร์เน็ตช้า การโหลดแผนที่จะต้องใช้เวลาประมาณหนึ่ง
• ยังขาดการทำ Skeleton เพื่อรอการ fetch ข้อมูล
• Acceptance Test in Google Sheet

---

Back to top