zhangshexin / mall-1

Spring Boot后端 + Vue管理员前端 + 微信小程序用户前端 + Vue用户移动端

小商城功能

• 首页
• 专题列表、专题详情
• 分类列表、分类详情
• 品牌列表、品牌详情
• 新品首发、人气推荐
• 优惠券列表、优惠券选择
• 团购
• 搜索
• 商品详情、商品评价、商品分享
• 购物车
• 下单
• 订单列表、订单详情、订单售后
• 地址、收藏、足迹、意见反馈
• 客服

管理平台功能

• 会员管理
• 商城管理
• 商品管理
• 推广管理
• 系统管理
• 配置管理
• 统计报表

技术选型

后端技术

技术	说明	官网
Spring Cloud	微服务框架	https://spring.io/projects/spring-cloud
Spring Cloud Alibaba	微服务框架	https://github.com/alibaba/spring-cloud-alibaba
Spring Boot	容器+MVC框架	https://spring.io/projects/spring-boot
Spring Security Oauth2	认证和授权框架	https://spring.io/projects/spring-security-oauth
MyBatis	ORM框架	http://www.mybatis.org/mybatis-3/zh/index.html
MyBatisGenerator	数据层代码生成	http://www.mybatis.org/generator/index.html
PageHelper	MyBatis物理分页插件	http://git.oschina.net/free/Mybatis_PageHelper
Knife4j	文档生产工具	https://github.com/xiaoymin/swagger-bootstrap-ui
Elasticsearch	搜索引擎	https://github.com/elastic/elasticsearch
RabbitMq	消息队列	https://www.rabbitmq.com/
Redis	分布式缓存	https://redis.io/
MongoDb	NoSql数据库	https://www.mongodb.com/
Docker	应用容器引擎	https://www.docker.com/
Druid	数据库连接池	https://github.com/alibaba/druid
OSS	对象存储	https://github.com/aliyun/aliyun-oss-java-sdk
MinIO	对象存储	https://github.com/minio/minio
JWT	JWT登录支持	https://github.com/jwtk/jjwt
LogStash	日志收集	https://github.com/logstash/logstash-logback-encoder
Lombok	简化对象封装工具	https://github.com/rzwitserloot/lombok
Seata	全局事务管理框架	https://github.com/seata/seata
Portainer	可视化Docker容器管理	https://github.com/portainer/portainer
Jenkins	自动化部署工具	https://github.com/jenkinsci/jenkins

前端技术

技术	说明	官网
Vue	前端框架	https://vuejs.org/
Vue-router	路由框架	https://router.vuejs.org/
Vuex	全局状态管理框架	https://vuex.vuejs.org/
Element	前端UI框架	https://element.eleme.io/
Axios	前端HTTP框架	https://github.com/axios/axios
v-charts	基于Echarts的图表框架	https://v-charts.js.org/

环境搭建

开发环境

工具	版本号	下载
JDK	1.8	https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
Mysql	5.7	https://www.mysql.com/
Redis	5.0	https://redis.io/download
Elasticsearch	7.6.2	https://www.elastic.co/cn/downloads/elasticsearch
Kibana	7.6.2	https://www.elastic.co/cn/downloads/kibana
Logstash	7.6.2	https://www.elastic.co/cn/downloads/logstash
MongoDb	4.2.5	https://www.mongodb.com/download-center
RabbitMq	3.7.14	http://www.rabbitmq.com/download.html
nginx	1.10	http://nginx.org/en/download.html

快速启动

1. 配置最小开发环境：

   • MySQL
   • JDK1.8或以上
   • Maven
   • Nodejs
   • 微信开发者工具

2. 数据库依次导入mall-db/sql下的数据库文件

   • mall_schema.sql
   • mall_table.sql
   • mall_data.sql

3. 启动小商场和管理后台的后端服务

   打开命令行，输入以下命令

   mvn install
   mvn clean package
   java -Dfile.encoding=UTF-8 -jar mall-all/target/mall-all-0.1.0-exec.jar

4. 启动管理后台前端

   打开命令行，输入以下命令

   npm install -g cnpm --registry=https://registry.npm.taobao.org
   cd mall/mall-admin
   cnpm install
   cnpm run dev

   此时，浏览器打开，输入网址http://localhost:9527, 此时进入管理后台登录页面。

5. 启动小商城前端

   这里存在两套小商场前端mall-wx和renard-wx，开发者可以分别导入和测试：

   1. 微信开发工具导入mall-wx项目;
   2. 项目配置，启用“不校验合法域名、web-view（业务域名）、TLS 版本以及 HTTPS 证书”
   3. 点击“编译”，即可在微信开发工具预览效果；
   4. 也可以点击“预览”，然后手机扫描登录（但是手机需开启调试功能）。

   注意：

   这里只是最简启动方式，而小商场的微信登录、微信支付等功能需开发者设置才能运行。

6. 启动轻商城前端

   打开命令行，输入以下命令

   npm install -g cnpm --registry=https://registry.npm.taobao.org
   cd mall/mall-vue
   cnpm install
   cnpm run dev

   此时，浏览器（建议采用chrome 手机模式）打开，输入网址http://localhost:6255, 此时进入轻商场。

项目实例

小商场实例

• vue实例

注意：此实例是真实小商场，开发者可以购买商品和付款，但请不要尝试退款操作。

• show databases;
• source F:\Program Files\MySQL\MySQL Server 8.0\bin\litemall_schema.sql
• source F:\Program Files\MySQL\MySQL Server 8.0\bin\litemall_table.sql
• source F:\Program Files\MySQL\MySQL Server 8.0\bin\litemall_data.sql
• java -Dfile.encoding=UTF-8 -jar /usr/local/apache-tomcat-9.0.38/webapps/mall-all-0.1.0-exec.jar
• nohup java -Dfile.encoding=UTF-8 -jar /usr/local/apache-tomcat-9.0.38/webapps/mall-all-0.1.0-exec.jar > log.txt &