本章將展示如何初始化Angular、Spring Boot，并使用二者相結合的方式輸出我們熟悉的Hello World! # 前后臺分離 在正式開始前先了解下什么是前后端分離以及為什么要前后端分離，我們先看看日常生活中離不開的火車票相關系統：  雖然我們還不太清楚應該用什么語言來開發自助購(取)票終端、自動閘機以及火車票人工售票終端，但我們可以確認的是：無論使用哪種語言進行開發，都離不開用戶交互(v層)、數據轉發（C層）以及邏輯處理（M層）。CV層的功能由于交互界質、數據格式的不同會有所不同，但邏輯處理的思想卻必然相同。比如購票時都需要校驗車票的余額及完成支付。在前后端不分離的情況下，對于不同的終端我們可能需要在不同的語言下實現邏輯完全相同的功能，這無疑在增加了開發工作量的同時，也增大了出錯的概率。更重要的是它將使得整套系統變得不可維護。所以我們急需一種方法來將邏輯相同的M層部分進行剝離，進而達到統一開發統一維護的目的。  我想這應該便是前后端分離的理由吧。 # WEB前后端分離 手機APP是前后端分離的最典型的應用，在使用某個APP前我們首先要來個軟件市場來下載這個應用。這個下載到手機中的應用便是APP前端。不同的用戶啟動相同的app應用看到的界面`骨架`都是一樣的，相同的用戶在不同的時間啟動該APP看到的界面骨架也是一樣的。但應用展示的`內容`卻會隨著用戶不同、時間不同而不盡相同。這是由于`骨架`存在于APP前端應用中，大家下載的都一樣；而`內容`存在于APP后端服務中，不同用戶、不同條件請求后端服務得到的內容是不相同的。我們把這個無論對誰都一樣、固定不變的`骨架`稱為前端應用，把提供`內容`的稱為后端應用。前端與后端應用配置工作，最終向用戶展現了APP功能，則稱為前后端分離的應用架構。 WEB的前后端分與手機APP應用前后端分離基本一致。在前后端分離的WEB應用中，也需要先下載一個`前端應用`到用戶的瀏覽器中，然后瀏覽器自動的運行這個`前端應用`。`前端應用`依自己的設定或用戶的操作來請求WEB后端，后端按請求條件將特定的內容發送給`前端應用`。  如圖所示，瀏覽器在訪問前后端分離的WEB應用時，首先請求并獲取前端應用，然后前端應用再依次訪問后端應用來獲取對應的數據。前后端分離的WEB應用由于前后端可以直接的部署到不同的服務器上，所以可以將請求壓力進行分離；由于前端應用在整個用戶訪問過程中僅請求一次，可以有效的降低冗余的數據的傳輸，近而減少用戶請求次數、發送數據量，近一步的降低了服務器的壓力；前后端分離后，前后端可以有不同的團隊進行開發，系統被近一步地模塊化，這有助于加快系統開發的速度；前后端分離要求在進行整體的系統開發前，規則好前后端的數據傳輸內容及格式，這使得開發團隊在開發系統前必須對系統有個整體的認識，這將降低需求偏差。 ## 前端 在前后端分離的架構中，由于前端被近一步的模塊化，使得我們在思索問題時，可以單獨圍繞該模塊化的前端進行。摒棄一些后端復雜的業務邏輯后，我們有更多的腦容量來思索如何優化前端的問題。