### 前端視圖 [TOC=4,6] #### 設計思路 那么學生模塊的前端視圖到底應該事什么樣子呢？這是首先需要填的“坑”。其實本系統說白了就是一個信息管理系統，學生是該系統的的一種用戶，那么系統需要為其提供便捷的使用方式。最好在一個統一的界面里解決所有的問題。所以，借鑒微博或博客以及其它信息系統的個人中心界面來完成本系統的學生模塊的視圖界面比較合適。下面先看看成品，如下圖:  該個人中心視圖插件名為matrix-admin,來源于網絡下載，下載后目錄結構如下：  可以看出，其中包括CSS,JS,img,font,用戶賬戶設置界面(account.html)，圖表(charts.html)，常見問題(faq.html)，表格(grid)，登錄界面（login.html）和計劃界面（plans.html）, 個人中心界面（index.html），完全可以滿足我們的需求。下載后，我們需要把這些文件融入到我們的項目中。 #### 插件融入項目 同樣的，我們將下載的前端插件放入項目的 public/static/vendor目錄下，該目錄中存放的都是前端第三方擴展插件。插件目錄為 public/static/vendor/matrix-admin目錄結構如下圖所示：  學生界面風格統一，當學生點擊左側不同的菜單，右側顯示不同的內容。由于大部分內容都相同（左側、頭部和尾部），所以這時候需要使用模板技術。