溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

Vue 電商后臺(tái)管理項(xiàng)目階段性總結(jié)

發(fā)布時(shí)間:2020-10-02 20:54:21 來(lái)源:腳本之家 閱讀:160 作者:Gorit 欄目:開發(fā)技術(shù)

一、階段總結(jié)

該項(xiàng)目偏向前端更多一點(diǎn),后端 API 服務(wù)是已經(jīng)搭建好了的,我們只需要用既可以,(但是作為一個(gè) 全棧開發(fā)人員,它的數(shù)據(jù)庫(kù)的表設(shè)計(jì),Restful API 的設(shè)計(jì)是我們要著重學(xué)習(xí)的?。。。?/p>

這個(gè)vue 項(xiàng)目是從 2020 4月開始,一直開發(fā)直至 5月23日 部署上線,也算是我的第二個(gè) vue 的實(shí)戰(zhàn)項(xiàng)目(其實(shí)是熟悉 elementUI 的使用),在開發(fā)過(guò)程中使用 Vue cil4 腳手架進(jìn)行開發(fā),使用碼云作為 Git 管理倉(cāng)庫(kù), 目前已經(jīng)基本開發(fā)完畢,在服務(wù)器上也能夠正常運(yùn)行 (nginx 配置整整用了我兩天)

項(xiàng)目倉(cāng)庫(kù):vue_shop
項(xiàng)目地址:運(yùn)行地址
測(cè)試賬號(hào):test
測(cè)試密碼:123456

鑒于可能會(huì)出現(xiàn)一些危險(xiǎn)的操作,這個(gè)測(cè)試賬號(hào)只提供了查詢的功能,修改,刪除操作就通過(guò)權(quán)限管理禁用了。(小服務(wù)器,沒(méi)啥值錢的東西,求大佬放過(guò))

二、項(xiàng)目技術(shù)棧

2.1 前端

前端采用 vue cli4 腳手架搭建框架,大體使用 elementUI 美化項(xiàng)目結(jié)構(gòu),所以需要安裝 elementUI 插件

Vue 電商后臺(tái)管理項(xiàng)目階段性總結(jié)

其次是環(huán)境依賴 (有開發(fā)依賴,有運(yùn)行依賴),有的功能是有現(xiàn)成的輪子的,直接那來(lái)用就好了,比如:

富文本編輯器

Vue 電商后臺(tái)管理項(xiàng)目階段性總結(jié)

加載進(jìn)度條

Vue 電商后臺(tái)管理項(xiàng)目階段性總結(jié)

圖表展示功能

Vue 電商后臺(tái)管理項(xiàng)目階段性總結(jié)

第三方 http 庫(kù)

Vue 電商后臺(tái)管理項(xiàng)目階段性總結(jié)

2.2 后端

后端是已經(jīng)寫好了的,采用 express 搭建的 API 服務(wù),返回的數(shù)據(jù)是 JSON 格式的數(shù)據(jù),所以用起來(lái)還是比較舒服的,我們只需要導(dǎo)入數(shù)據(jù)庫(kù),并配置一下數(shù)據(jù)庫(kù)信息,就可以跑起來(lái)了。也有對(duì)應(yīng)的 API 文檔

后端 API 文檔:傳送門

2.3 數(shù)據(jù)庫(kù)

數(shù)據(jù)庫(kù)采用 MySQL 5.7存儲(chǔ),我們只需要將項(xiàng)目的 sql 文件導(dǎo)入即可,數(shù)據(jù)庫(kù)的表如下

Vue 電商后臺(tái)管理項(xiàng)目階段性總結(jié)

三、項(xiàng)目概要

3.1 開發(fā)流程

開發(fā)流程以及記錄在另一博客上了:傳送門 (感謝 My-Belief的分享)

因?yàn)槭褂冒姹究刂乒ぞ?Git 來(lái)管理工程,所以每開發(fā)一個(gè)新模塊,就會(huì)提交一個(gè)新分支:倉(cāng)庫(kù)地址

Vue 電商后臺(tái)管理項(xiàng)目階段性總結(jié)

3.2 項(xiàng)目預(yù)覽

登錄界面

Vue 電商后臺(tái)管理項(xiàng)目階段性總結(jié)

項(xiàng)目首頁(yè)

Vue 電商后臺(tái)管理項(xiàng)目階段性總結(jié)

項(xiàng)目模塊展示

Vue 電商后臺(tái)管理項(xiàng)目階段性總結(jié)

框架真香

使用 node 的 pm2 管理項(xiàng)目

Vue 電商后臺(tái)管理項(xiàng)目階段性總結(jié)

Vue 電商后臺(tái)管理項(xiàng)目階段性總結(jié)

使用 node 快速關(guān)閉一個(gè)端口的服務(wù)

全局安裝: npm install -g xl_close_port關(guān)閉某一個(gè)端口 ( 8081 )xl_close_port -p 8080四、學(xué)習(xí)資源

嗶哩嗶哩上有這個(gè)資源:B站視頻

到此這篇關(guān)于Vue 電商后臺(tái)管理項(xiàng)目階段性總結(jié)的文章就介紹到這了,更多相關(guān)Vue 電商后臺(tái)管理項(xiàng)目?jī)?nèi)容請(qǐng)搜索億速云以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持億速云!

向AI問(wèn)一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI