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 相关文章推荐
Javascript 更新 JavaScript 数组的 uniq 方法
Jan 23 Javascript
JavaScript高级程序设计 读书笔记之九 本地对象Array
Feb 27 Javascript
js hover 定时器(实例代码)
Nov 12 Javascript
超简单的Vue.js环境搭建教程
Mar 17 Javascript
vue 中directive功能的简单实现
Jan 05 Javascript
JS实现数组简单去重及数组根据对象中的元素去重操作示例
Jan 05 Javascript
Vue cli构建及项目打包以及出现的问题解决
Aug 27 Javascript
Vue将页面导出为图片或者PDF
Aug 17 Javascript
elementUI vue this.$confirm 和el-dialog 弹出框 移动 示例demo
Jul 03 Javascript
JS实现的碰撞检测与周期移动完整示例
Sep 02 Javascript
微信浏览器下拉黑边解决方案 wScroollFix
Jan 21 Javascript
vue动态绑定style样式
Apr 20 Vue.js
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 读取文件头判断文件类型的实现代码
2013/08/05 PHP
php 查找数组元素提高效率的方法详解
2017/05/05 PHP
jquery之Document元素选择器篇
2008/08/14 Javascript
使用jquery插件实现图片延迟加载技术详细说明
2011/03/12 Javascript
Javascript和Java获取各种form表单信息的简单实例
2014/02/14 Javascript
jQuery 过滤方法filter()选择具有特殊属性的元素
2014/06/15 Javascript
JavaScript中的定时器之Item23的合理使用
2015/10/30 Javascript
js动态获取子复选项并设计全选及提交的实现方法
2016/06/24 Javascript
微信小程序 wxapp视图容器 view详解
2016/10/31 Javascript
jquery pagination分页插件使用详解(后台struts2)
2017/01/22 Javascript
JavaScript中数组Array方法详解
2017/02/27 Javascript
解决OneThink中无法异步提交kindeditor文本框中修改后的内容方法
2017/05/05 Javascript
使用Angular CLI进行Build(构建)和Serve详解
2018/03/24 Javascript
Vue一次性简洁明了引入所有公共组件的方法
2018/11/28 Javascript
详解Vue一个案例引发「内容分发slot」的最全总结
2018/12/02 Javascript
实例介绍JavaScript中多种组合继承
2019/01/20 Javascript
详解vue项目中调用百度地图API使用方法
2019/04/25 Javascript
vue 实现Web端的定位功能 获取经纬度
2019/08/08 Javascript
React+EggJs实现断点续传的示例代码
2020/07/07 Javascript
Python迭代器和生成器定义与用法示例
2018/02/10 Python
Django 连接sql server数据库的方法
2018/06/30 Python
python清除字符串前后空格函数的方法
2018/10/21 Python
python使用opencv对图像mask处理的方法
2019/07/05 Python
python3实现斐波那契数列(4种方法)
2019/07/15 Python
pytorch程序异常后删除占用的显存操作
2020/01/13 Python
Python爬虫定时计划任务的几种常见方法(推荐)
2021/01/15 Python
香港网上花店:FlowerAdvisor香港
2019/05/30 全球购物
铭万公司.net面试题笔试题
2014/07/20 面试题
GWT都有什么特性
2016/12/02 面试题
库房管理员岗位职责
2014/03/09 职场文书
淘宝好评语大全
2014/05/05 职场文书
公务员考察材料
2014/12/23 职场文书
教代会闭幕词
2015/01/28 职场文书
销售开票员岗位职责
2015/04/15 职场文书
公司酒会主持词
2015/07/02 职场文书
药房管理制度范本
2015/08/06 职场文书