Vue 电商后台管理项目阶段性总结(推荐)


Posted in Javascript onAugust 22, 2020

一、阶段总结

该项目偏向前端更多一点,后端 API 服务是已经搭建好了的,我们只需要用既可以,(但是作为一个 全栈开发人员,它的数据库的表设计,Restful API 的设计是我们要着重学习的!!!)

这个vue 项目是从 2020 4月开始,一直开发直至 5月23日 部署上线,也算是我的第二个 vue 的实战项目(其实是熟悉 elementUI 的使用),在开发过程中使用 Vue cil4 脚手架进行开发,使用码云作为 Git 管理仓库, 目前已经基本开发完毕,在服务器上也能够正常运行 (nginx 配置整整用了我两天)

项目仓库:vue_shop
项目地址:运行地址
测试账号:test
测试密码:123456

鉴于可能会出现一些危险的操作,这个测试账号只提供了查询的功能,修改,删除操作就通过权限管理禁用了。(小服务器,没啥值钱的东西,求大佬放过)

二、项目技术栈

2.1 前端

前端采用 vue cli4 脚手架搭建框架,大体使用 elementUI 美化项目结构,所以需要安装 elementUI 插件

Vue 电商后台管理项目阶段性总结(推荐)

其次是环境依赖 (有开发依赖,有运行依赖),有的功能是有现成的轮子的,直接那来用就好了,比如:

富文本编辑器

Vue 电商后台管理项目阶段性总结(推荐)

加载进度条

Vue 电商后台管理项目阶段性总结(推荐)

图表展示功能

Vue 电商后台管理项目阶段性总结(推荐)

第三方 http 库

Vue 电商后台管理项目阶段性总结(推荐)

2.2 后端

后端是已经写好了的,采用 express 搭建的 API 服务,返回的数据是 JSON 格式的数据,所以用起来还是比较舒服的,我们只需要导入数据库,并配置一下数据库信息,就可以跑起来了。也有对应的 API 文档

后端 API 文档:传送门

2.3 数据库

数据库采用 MySQL 5.7存储,我们只需要将项目的 sql 文件导入即可,数据库的表如下

Vue 电商后台管理项目阶段性总结(推荐)

三、项目概要

3.1 开发流程

开发流程以及记录在另一博客上了:传送门 (感谢 My-Belief的分享)

因为使用版本控制工具 Git 来管理工程,所以每开发一个新模块,就会提交一个新分支:仓库地址

Vue 电商后台管理项目阶段性总结(推荐)

3.2 项目预览

登录界面

Vue 电商后台管理项目阶段性总结(推荐)

项目首页

Vue 电商后台管理项目阶段性总结(推荐)

项目模块展示

Vue 电商后台管理项目阶段性总结(推荐)

框架真香

使用 node 的 pm2 管理项目

Vue 电商后台管理项目阶段性总结(推荐)

Vue 电商后台管理项目阶段性总结(推荐)

使用 node 快速关闭一个端口的服务

全局安装: npm install -g xl_close_port关闭某一个端口 ( 8081 )xl_close_port -p 8080四、学习资源

哔哩哔哩上有这个资源:B站视频

到此这篇关于Vue 电商后台管理项目阶段性总结的文章就介绍到这了,更多相关Vue 电商后台管理项目内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
基于jQuery图片平滑连续滚动插件
Apr 27 Javascript
基于jquery实现的表格分页实现代码
Jun 21 Javascript
js简单实现竖向tab选项卡的方法
May 04 Javascript
在ASP.NET MVC项目中使用RequireJS库的用法示例
Feb 15 Javascript
JavaScript兼容性总结之获取非行间样式案例
Aug 07 Javascript
在javascript中使用com组件的简单实现方法
Aug 17 Javascript
Reactjs实现通用分页组件的实例代码
Jan 19 Javascript
React Native 使用Fetch发送网络请求的示例代码
Dec 02 Javascript
Vue+Flask实现简单的登录验证跳转的示例代码
Jan 13 Javascript
详解Vue中的scoped及穿透方法
Apr 18 Javascript
Node.js系列之连接DB的方法(3)
Aug 30 Javascript
vue制作抓娃娃机的示例代码
Apr 17 Javascript
vue实现移动端H5数字键盘组件使用详解
Aug 25 #Javascript
探究一道价值25k的蚂蚁金服异步串行面试题
Aug 21 #Javascript
js实现页面导航层级指示效果
Aug 25 #Javascript
js实现拖拽元素选择和删除
Aug 25 #Javascript
基于vue实现简易打地鼠游戏
Aug 21 #Javascript
vue实现打地鼠小游戏
Aug 21 #Javascript
js实现滑动进度条效果
Aug 21 #Javascript
You might like
php入门小知识
2008/03/24 PHP
js实现的网站首页随机公告随机公告
2007/03/14 Javascript
JScript的条件编译
2007/05/29 Javascript
js与jquery中获取当前鼠标的x、y坐标位置的代码
2011/05/23 Javascript
javascript针对DOM的应用实例(一)
2012/04/15 Javascript
JavaScript实现多维数组的方法
2013/11/20 Javascript
js实现九宫格图片半透明渐显特效的方法
2015/02/16 Javascript
Jquery实现仿腾讯娱乐频道焦点图(幻灯片)特效
2015/03/06 Javascript
JS+CSS实现的经典tab选项卡效果代码
2015/09/16 Javascript
Javascript之Date对象详解
2016/06/07 Javascript
javascript防篡改对象实例详解
2017/04/10 Javascript
微信小程序 配置顶部导航条标题颜色的实现方法
2017/09/20 Javascript
jqueryUI tab标签页代码分享
2017/10/09 jQuery
javascript实现5秒倒计时并跳转功能
2019/06/20 Javascript
JavaScript Image对象实现原理实例解析
2020/08/26 Javascript
Element-UI 使用el-row 分栏布局的教程
2020/10/26 Javascript
Vue多选列表组件深入详解
2021/03/02 Vue.js
自动化Nginx服务器的反向代理的配置方法
2015/06/28 Python
python append、extend与insert的区别
2016/10/13 Python
详解Python中的Numpy、SciPy、MatPlotLib安装与配置
2017/11/17 Python
python如何实现反向迭代
2018/03/20 Python
Python使用while循环花式打印乘法表
2019/01/28 Python
Django网络框架之HelloDjango项目创建教程
2019/06/06 Python
Python 类属性与实例属性,类对象与实例对象用法分析
2019/09/20 Python
python [:3] 实现提取数组中的数
2019/11/27 Python
python垃圾回收机制(GC)原理解析
2019/12/30 Python
python GUI模拟实现计算器
2020/06/22 Python
使用html5 canvas创建太空游戏的示例
2014/05/08 HTML / CSS
HTML5 新标签全部总汇(推荐)
2016/06/13 HTML / CSS
毕业生求职简历的自我评价
2013/10/07 职场文书
葛优非诚勿扰搞笑征婚台词
2014/03/17 职场文书
社区巾帼文明岗事迹材料
2014/06/03 职场文书
报考公务员诚信承诺书
2014/08/29 职场文书
2014年幼儿园个人工作总结
2014/11/10 职场文书
暑期社会实践证明书
2014/11/17 职场文书
python保存图片的四个常用方法
2022/02/28 Python