昨天講述了一開始用於系統資料庫設計的 Schema，今天會說明開發系統常用的 MVC架構(MVC Pattern)。

MVC架構

當系統較為龐大時，若將所有CODE集中在同一個檔案，則在維運上十分困難，每次新增一個功能或者轉移開發者，都需要耗費大量的心力與時間去找理解龐大的code。選擇對的系統架構pattern，跟建築打地基一樣重要，好的架構在後期的維運時間成本低、也可以讓接手維運的人員快速掌握系統，加以繼續深入開發新功能。

在 Web 應用程式和桌面應用程式，最廣為人知的便是 MVC（Model-View-Controller）架構，分別使用 Model、View與Controller切分系統撰寫:

1. Model：
   • 負責連結資料庫做資料的更新與查詢的語法，執行CRUD操作，並將資料回傳給Controller
   • 使用 SQL + PHP 撰寫
2. View：
   • 即是應用程式的 UI 介面 (使用者唯一能接觸到、看到的畫面就是惹)
   • 使用 HTML + JavaScript 撰寫
3. Controller：
   • 負責處理 Model 與 View 間的溝通，將使用者在view寫入的資料傳遞給Model，或者根據使用者提出的請求，向 Model 索取資料後回傳
   • 使用 SQL + PHP 撰寫

MVC pattern 可以讓資料存取和功能的實現兩邊盡量分開，也可以讓同一個 model 能有多個View，雖然因此而增加了複雜度，但也讓 app 較容易設計。

MVC 架構優勢

• 最大效率重複使用程式碼：由於 MVC 三塊彼此獨立、各司其職，同一model可針對使用狀況不同，產出不同的 view 來呈現適合的資料，最大化程式碼的使用效率。
• 更容易維護程式碼：M、V、C 彼此獨立且互不干擾，可以更輕鬆快速地擴充或修改，提升開發效率。
• 方便團隊合作：MVC 架構將程式分為三大區塊，可以比照相同方式，將工程師、設計師負責部分的部分切開，專業分工，提升開發效率。

系統架構圖

以下為昨天的找寵物系統之架構圖，本系統正是由 M、V、C 三個部分組成，Model會向Database Server索取資料，Controller則是將資料傳遞給View，由View回傳資訊給User。

Reference

• 十種常見的軟體架構模式 10 Common Software Architectural Pattern
• 什麼是MVC網頁設計? 做網站一定需要MVC嗎?
• 後端工程師的第一堂課 (19) : 現代系統架構 — MVC
• MVC 架構與說明
• MVC架構是什麼？認識 Model-View-Controller 軟體設計模式