一、 MVC 一種設計模式
M (Model) : 用於封裝與應用程式的業務邏輯相關的資料以及對資料的處理方法，簡單地說就是把任何跟資料有關的操作都放到一個叫做 Model 的地方去。
V (view) : 實現資料有目的的顯示，所以會將所有跟顯示畫面有關的東西都放到 View，View 裡面用一個 template 來塞入資料。
C (Controller) : 起到不同層面間的組織作用，用於控制應用程式的流程。將 M 與 V 進行連結。
為什麼要有 MVC？
有 MVC 跟沒有 MVC 的差別在哪？
所以 MVC 是什麼？
為了讓代碼更好維護，開發人員可以遵循 MVC 規範進行職責劃分。 MVC 是軟體工程中的一種軟體架構模式，把軟體系統分為三個基本部分：模型（Model）、視圖（View）和控制器（Controller）。
要存取資料庫就是去 Model 裡面，要寫 HTML 就去 View，絕對不會出現在 View 裡面下 SQL Query 這種事情。
MVC 就只是一個框架，後端可以遵守 MVC 的架構去開發，前端也可以，就算不是 Web 也可以用 MVC。
二、form 與 Ajax，頁頁 Ya Ya
在 Ajax 出現之前，資料的傳遞都要透過表單，發送表單就等於向 server 發請求，server 接收處理後再回傳一個 response。但因為前後頁面往往 html 大致相同，回應的時間又仰賴 server 處理的時間，導致處理時間太久，體驗不佳。(This placed additional load on the server and made bandwidth a limiting factor on performance.)
為了解決跨頁的問題，Ajax 誕生了。現在，透過 Ajax 不換頁也能跟 Server 溝通。
Ajax，全名 Asynchronous JavaScript and XML，就只是處理 JavaScript 裡非同步地去呼叫 Server 的 API 並拿回資料。
新增留言，方式比較
server side render：由後端直接回傳整份 HTML，瀏覽器直接顯示就好，因為 response 就是完整的網頁了。
client side render：當前端拿到資料以後，才用 JavaScript 動態的把那些內容填到網頁上面。Ajax 發請求給 server，在不刷新頁面的前提下，我們透過 js 來進行新增留言
假如 server 有一天掛了，API 也跟著掛了，使用者依然可以造訪網頁，只是看不到資料而已，或者是你可以顯示出一個錯誤的圖案。但如果是舊的那種綁在一起的架構，server 一旦掛掉，你連畫面都渲染不出來。
client side render 技術下，因為後端不再處理這邊的路由了，所以這個部分完全轉交給前端負責，必須在前端自己管理 URL 的狀態，去決定現在要顯示哪一個頁面。此外，前端還要克服，要怎麼只更新部分畫面，而不是暴力的每次都砍掉重練。
三、SPA 泡個湯吧
SPA，全名是 Single Page Application，單頁式應用。與之對應的概念是 MPA，Multiple Page Application。要寫 SPA 的話，最難的就是狀態的管理。
發信程式比較
A、未使用 Ajax
1. 點擊刪除之後，利用 Form 表單 POST 資料去 /server/delete_email
2. /server/delete_email 處理完之後 redirect 回去信件列表
3. 瀏覽器重新載入信件列表（在載入之前你都會看到全白畫面，因為因為瀏覽器正在等待 Server 的 Response 才能載入 HTML）
B、使用 Ajax
1. 點擊刪除之後，利用 Ajax POST 資料去 /server/api/delete_email
2. /server/api/delete_email 處理完之後回傳 Response
3. 用 JavaScript 在前端把那封信的從畫面上移除
後者利用 Ajax 跟後端同步資料，並且在前端用 JavaScript 更改畫面，所以無論做什麼操作都不會換頁，也可以保證前後端的資料是同步的。
換句話說，現在所有畫面都在前端由 JS 動態產生，後端一點都不需要 View，使用者看到的其實都是同一個頁面，只是我們利用 JavaScript 在這個頁面上做變化。，
這個概念就叫做 SPA，全名是 Single Page Application，單頁式應用。與之對應的概念是 MPA，Multiple Page Application。
前端如果利用 SPA 來實作的話，會把原本應該是後端處理的一部份職責給搬到前端去，例如說狀態的管理跟路由。
四、SSR 哈囉 ~ 大曝光時代
SPA 是由前端的 JavaScript 動態產生內容，只有你的網站經由瀏覽器載入並且執行 JavaScript，等 Response 回來之後才會動態產生出內容。因此無論是哪個頁面，你檢視原始碼都看不到動態新增後的內容，同時一旦瀏覽器關掉，內容就不見了。
為了解決 SEO 的問題，有了 SSR。
既然問題出在「第一次渲染」，所以只要在第一次渲染的時候把該輸出的資料都輸出就好啦。第一個頁面由 Server side render，之後的操作還是由 Client side render。這個概念就叫做 SSR，Server Side Rendering。
重點回顧
MVC 是因為 code 變得越來越亂，所以將職責區分清楚的一種設計模式。
SPA 是因為想增進使用者體驗，而出現的一種在前端利用 Ajax 達成不換頁的方法。SSR 是因為 SPA 的 SEO 問題而出現的解法。
