一、后臺管理的需求分析
項目描述：
項目作用：此項目做為一個前臺后臺分離的后臺管理SPA，包括前端PC應(yīng)用和后端應(yīng)用
主要功能：商品管理、用戶管理、權(quán)限管理、數(shù)據(jù)統(tǒng)計、語言等功能模塊
前端技術(shù)選用：react、react－dom、react－router－dom、echarts－for－react（就是react全家桶）、redux、reducer、axios、antd
后端技術(shù)選用：node＋express＋mongodb （寫api接口，數(shù)據(jù)存儲）
開發(fā)模式：采用功能模塊化、組件化、工程化的開發(fā)模式，項目簡潔、美觀、運行更流暢、使用簡單、易于維護。。。
舉個非常簡單的例子：
登錄、主界面
分類管理
商品管理：增刪改查
用戶管理：增刪改查
權(quán)限管理：超級管理員和普通管理權(quán)限
數(shù)據(jù)統(tǒng)計：圖表
設(shè)置：個人中心、信息、資料、賬戶安全、修改密碼什么的
其他：語言設(shè)置，個人偏好設(shè)置
二、根據(jù)需求選擇ui模版? ? ui后臺管理常用的模版網(wǎng)站
EasyUI：官網(wǎng)：http://www.jeasyui.com/? 資源：http://www.jeasyui.net/
DWZ JUI：官網(wǎng)：http://jui.org/? ? ? ?下載：https://github.com/dwzteam/
HUI：官網(wǎng)：http://www.h-ui.net/H-ui.admin.shtml? ?下載：https://github.com/jackying/
Ace Admin：官網(wǎng)：http://ace.jeka.by/? ? ? ?下載：https://github.com/bopoda/ace
Metronic：官網(wǎng)：http://www.zi-han.net/theme/hplus/
BootStrap：官網(wǎng)：https://www.bootcss.com/
使用的比較的ui是：
1、使用HUI和bootstrap
2、使用EasyUI的框架，內(nèi)容頁使用HUI+BootStrap，iframe選項卡
3、從各個功能強大的頁面中拿一些插件過來
三、技術(shù)選型
四、前端路由：分／login和／admin兩塊子路由全部放admin后面，這個主要是根據(jù)你們項目需求來分，非常簡單就不多說了
五、API接口：API接口一般是后端給出，基本上不用我們前端來寫，但是基本操作還是要懂，尤其是后端給過來的數(shù)據(jù)格式，數(shù)據(jù)處理，這些基本要會，也不多說了
六、我這邊用的是github? 所以也說下git常用的基本命令（我簡書上有相關(guān)文章可以去翻翻）
$ git config --global user.name"username"? ／配置用戶名
$ git config --global user.email"xx@gmail.com" ／配置郵箱
$ git init? ? ／初始化一個本地倉庫 .git
$ git add .? ?／將文件添加到暫存區(qū)
$ git commit -m "提交日志"? ?／提交到本地倉庫
$ git remote add origin? url? ?／本地倉庫關(guān)聯(lián)到遠程倉庫
$ git clone url? ? ／克隆代碼 拉取遠程倉庫項目
$ git push origin master? ?／將本地分支項目推送到遠程倉庫分支master
$ git branch -a? ?／查看本地分支和遠程分支
$ git checkout -b 分支名? ?／切換并創(chuàng)建一個新的分支
$ git checkout 分支名? ? ? ／切換到這個分支
$ git pull origin 分支名? ? ?／將本地倉庫項目推送到遠程倉庫這個分支
七、使用 creact－react－app （項目名admin）搭建項目
標注：create-react-app 是 react 官方提供的用于搭建基于 react+webpack+es6 項目的腳手架
操作：
npm? install? －g? crecte－react－app：全局下載腳手架工具
create－react－app? ?admin（項目名） 創(chuàng)建模版項目
cd? admin? ? ? ／找到項目路徑下
npm? run? start／localhost：3000? ? ?／訪問頁面
八、創(chuàng)建構(gòu)架目錄
項目的基本構(gòu)架到這基本是完結(jié)了，需要新增什么功能里面直接添加相關(guān)文件再寫代碼就可以。
從項目準備，到完全搭建好項目整個流程基本上都寫到了，希望對大家有所幫助
————————————————————————————————————
一縷陽光，后期將不定時出針對前端項目疑點難點的博文，謝謝關(guān)注！！
