在正式開始前，首先來了解下什么是前后端分離，以及為什么要進行前后端分離。 ## 前后端分離 我們先來看，日常生活中離不開的與火車票相關的各類系統：  雖然，我們還不太清楚應該用什么語言來開發自助購（取）票終端、自動閘機以及火車票人工售票終端，但我們可以確認的是：無論使用哪種語言進行開發，都離不開用戶交互（V層）、數據轉發（C層）以及邏輯處理（M層）。C、V層的功能由于交互介質、數據格式的不同會有所不同，但邏輯處理的思想必然相同。比如購票時，都需要校驗車票的余額及完成支付。 在前后端不分離的情況下，對于不同的終端，我們可能需要在不同的語言下實現邏輯完全相同的功能，這無疑在增加開發工作量的同時，也增大了出錯的概率。更重要的是，它將使得整套系統變得不易維護。所以我們急需一種方法，來將邏輯相同的M層部分進行剝離，進而達到統一開發、統一維護的目的。  我想這做為了前后端分離的理由應該是充分的吧。 # WEB前后端分離 手機APP是前后端分離最典型的應用，在使用某個APP前我們首先要打開軟件市場來下載這個應用，這個下載到手機中的應用便是APP前端。不同的用戶啟動相同的APP應用看到的界面架構都是一樣的，相同的用戶在不同的時間啟動該APP看到的界面架構也是一樣的，但應用展示的內容卻會隨著用戶不同、時間不同而不盡相同。這是由于骨架存在于APP前端應用中，大家下載的都一樣；而內容存在于APP后端服務中，不同用戶、不同時間請求后端服務得到的內容是不相同的。我們把這個無論對誰都一樣、固定不變的架構稱為前端應用，把提供內容的稱為后端應用。前端與后端應用配置工作，最終向用戶展現了APP功能，則稱為前后端分離的應用架構。 WEB的前后端分離與手機APP應用前后端分離基本一致。在前后端分離的WEB應用中，也需要先下載一個前端應用到用戶的瀏覽器中，然后瀏覽器自動的運行這個前端應用，前端應用按照自己的設定或用戶的操作來請求WEB后端，后端按照請求條件將特定的內容發送給前端應用。  如上圖所示，瀏覽器在訪問前后端分離的WEB應用時，首先請求并獲取前端應用，然后前端應用再依次訪問后端應用來獲取對應的數據。前后端分離的WEB應用由于前后端可以直接部署到不同的服務器上，所以可以將請求壓力進行分離；由于前端應用在整個用戶訪問過程中僅請求一次，可以有效的降低冗余的數據的傳輸，進而減少用戶請求次數和發送數據量，近一步降低了服務器的壓力；前后端分離后，前后端可以由不同的團隊在開發，系統被進一步的模塊化，這有助于加快系統開發的速度；前后端分離要求在進行整體的系統開發前，規劃好前后端的數據傳輸內容及格式，這使得開發團隊在開發系統前必須對系統有整體的認識，這將能夠降低需求偏差。 我們當前接觸的大多數WEB應用都應用了前后臺分離的思想，京東、淘寶、百度、google......無一例外。前端再也不是那個只需要P個圖、會寫個css、html就可以勝任的`美工`了，當前的前端打造了無數個優秀的前端工程師，而同時前端工程師的崗位需求也日益增加，薪資當然也隨著水漲船高。 # Angular 在前后端分離的架構中，由于前端被進一步的模塊化，使得我們在思索問題時，可以單獨圍繞該模塊化的前端進行，摒棄一些后端復雜的業務邏輯后，我們能夠有更多的精力來思索如何優化前端的問題。Angular便是在這種前端模塊進化中應運而生的優秀產品。 ## Angular、Vue、React 我想無論講Angular、vue或是react，都應該避不開將三者做比較的話題吧。三個框架無疑都是極其優秀的框架，三者對比必會各有千秋，每位作者相信在做對比時都會帶有一定的個人感情因素，筆者當然也是如此。所以我們從**適用**的角度上來做個對比。 | 名稱 | 難易程度 | 特點 | 適用人群 | | ---- | ---- | ---- | ---- | | Vue | 易 | 能夠非常友好地鑲嵌在老項目中、學習成本低、資源豐富 | 前后臺不分離老項目向前后臺分離更新的首選，可以穩步逐漸的過渡到前后端分離項目；當前有實際生產項目需求，沒有過多的時間學習 | | React | 中 | 構建手機APP非常友好，效率極高 | 適用于想用一套框架即可WEB前端，又寫手機APP的情況，一套語言無疑將降低整體的學習難度以及開發成本 | | Angular | 難 | 該有的都有的，你想的到的它有，你沒想到的它也有；學習的是使用方法，也是編程理論 | 適用于中大型項目開發；適用于對前端框架進行系統學習 |