เนื่องจากมีโอกาสนำ Flutter 2.0 มาพัฒนาระบบ web application
ซึ่งก่อนหน้านี้ใช้พัฒนาแต่ Mobile app เท่านั้น
ใน Flutter 2.0 นั้นเพิ่ม web application เข้ามาด้วย
แต่เมื่อนำมาใช้พัฒนาระบบงานจริง ๆ
ก็เจอปัญหาหรือ issue ต่าง ๆ ขึ้นมา
จึงจดบันทึกไว้นิดหน่อย

เรื่องที่ 1 คือ CORS (Cross-Origin Resource Sharing)

จะไม่เจอใน Mobile app เลย
แต่เมื่อเป็น Web application จะเจอเรื่องนี้แน่นอน
มันคือ security ของ web browser นั่นเอง
ดังนั้นการจัดการเรื่องของ CORS และ Authentication เป็นสิ่งที่สำคัญ
แสดงการทำงานดังรูป

เรื่องที่ 2 โครงสร้างที่เหมาะสมกับระบบงาน

เรื่องของโครงสร้างนั้น มันสำคัญต่อระบบงานอย่างมาก
ถ้าวางโครงสร้างไม่ดี
อาจจะส่งผลต่อเวลาของการพัฒนาที่มากขึ้นหรือน้อยลง
รวมทั้งเรื่องของการทำงานเป็นทีม
การจัดการมีหลายแบบ ยกตัวอย่างเช่น

  • Flat
  • Layered
  • Feature/domain/page
  • Clean architecture

เรื่องที่ 3 การจัดเก็บข้อมูลในฝั่ง client

สิ่งที่ควรให้ความสำคัญคือใน Web application นั้น
จะทำการเก็บข้อมูลลงใน cookie และใน Local storage
ซึ่งข้อมูลที่จัดเก็บต้องเก็บเท่าที่จำเป็นเท่านั้น
เก็บเยอะไปก็ไม่ดีแน่ ๆ

เรื่องที่ 4 การจัดการ Routing ของระบบงาน ซึ่งเป็น Client-side routing

เรื่องของ URL strategy ว่าจะจัดการและออกแบบอย่างไร ?
ต้องสามารถทำการ share หรือเข้าตรง ๆ ได้หรือไม่ ?
SEO ?

รวมไปถึงการจัดการกับ life cycle ของ Web application
ที่ทำงานบน web browser เช่นการกดปุ่ม refresh หรือ back เป็นต้น
จะต้องทำการจัดการอย่างไร
ซึ่งจะไม่เจอปัญหานี้บน Mobile app เลย

เรื่องที่ 5 การทดสอบระบบงาน

การทดสอบ Flutter application นั้น
มีทั้ง Unit, Widget, Integration, Mobile app เป็นต้น
ส่วน Web application ก็ใช้แนวทางเดียวกันอาจจะเพิ่มเข้ามาคือ พวก

  • Cypress
  • Selenium
  • Playwright

เป็นสิ่งที่นักพัฒนามักไม่สนใจเรื่องนี้เท่าไรนัก
แต่เป็นสิ่งที่สำคัญมาก ๆ

ยังมีเรื่องอื่น ๆ อีก ยกตัวอย่างเช่น

  • Responsive UI
  • Security
  • Performance
  • SEO