前言：
做後端開發的同學都知道，越是正規的公司，分工越是專業。一般後端開發不太會被安排一些前端開發任務。儘管如此，不代表說後端同學一點前端也做。
對於一些內部時候、對樣式不太在意的“管理系統”（各種 admin/government/background）。套路化、模板化的前端，有很大機率是後端來做的。因此後端同學也有必要掌握一些前端技術，不求多專業，夠用就好。
後臺管理系統幾個時代
就筆者而言，後臺管理系統的前端開發，基本上經歷了4個階段。
這4個階段基本跟前端框架的進展也是吻合的。4個階段如下：
l 石器時代
後端使用JSP、Freemarker、Velocity等模板引擎，基於內建or自定義標籤。後端直接渲染出前端頁面。
缺點有很多：後端一個變數寫不對，整個頁面無法出現。語法十分不方便閱讀，各種轉義符經常看的眼花繚亂，從而也很難維護。這個階段很快就過去。
l 青銅時代
出現了一些基本是後端才會用的js ui框架。如 jquery-ui 、easyui / miniui 、extjs等。
自帶了很多元件。前端使用的 table、form、pager等元件都是現成的。直接引用和組裝即可。
這時候基本不需要後端的標籤了，jsp仍然在使用，但也僅僅是作為一個構架，將js、css等資源引入。其他所有操作都是 js + ajax + json 與後端互動。無論是開發、維護效率都大大提升
l 蒸汽時代
這個時代基本跟上一個時代差別不大，最大的區別是出現了 bootstrap 這個基於柵格的css框架。有大量的jquery外掛與之配合，同時出現了大量的模板，幾乎一統天下。
l 現在
前後端分離的趨勢不可阻擋，後端的管理系統也有部分已經是基於vue或者react開發。
管理系統模板
前後端分離框架3足鼎立。Vue、AngularJS、React各有擁躉，國內vue用的比較多，相對來說vue也最容易上手，所以很適合後端開發快速學習。
Vue 本身的ui框架，國內餓了麼開源的 element-ui 使用者眾多，因此開發vue選擇element-ui是很好的選擇。
今日推薦的框架，就是基於element-ui進行的二次封裝。直接提供了一套解決方案。
我們來看一下。
專案地址：
https：//panjiachen。github。io/vue-element-admin-site/zh/
專案預覽：
專案特點
：
vue-element-admin
是一個後臺前端解決方案，它基於
vue
和
element-ui
實現。它使用了最新的前端技術棧，內建了 i18 國際化解決方案，動態路由，許可權驗證，提煉了典型的業務模型，提供了豐富的功能元件，它可以幫助你快速搭建企業級中後臺產品原型。
l 主流技術棧
所謂主流，就是說即便是我們自己搭建，也大機率引入相同的大部分依賴。
l 封裝簡練
沒有重度耦合太多自定義的、沒有原始碼的未知元件，用法也是主流用法，看了之後會容易二次修改
l 元件豐富
許可權、主題、國際化、編輯器、表格、Error頁面、圖表等儘可能集成了。減少你的開發量。
功能截圖：
圖表：
圖示：
整合了編輯器：
動態表格：
EXCEL匯出：
換膚：
