耗时三年开源的H5商城，生产级代码实战

waynboot-mall 商城项目是我从疫情开始初期着手准备开发的，到如今 2023 年底，已经过了 3 年多的时间。

从项目初期到现在，一个人持续迭代，修复漏洞，添加功能，经历了前端开发工具从 vue2、vue-cli 切换到 vue3、vite 的转变，也经历了后端技术框架从 Spring Boot2 到 Spring Boot3 的变迁。

项目的定位是帮助开发者从零到一搭建一套完备、包含前后端、生产可用的商城系统。所以也希望更多的开发者能够看到这个项目，使用到这个项目，能帮助到大家就是对我最大的肯定。

简介

waynboot-mall 是一套全部开源的微商城项目，包含三个项目：运营后台、H5 商城和后端接口。实现了一套完整的商城业务，有首页展示、商品分类、商品详情、sku 详情、商品搜索、加入购物车、结算下单、支付宝/微信支付、订单列表、商品评论等一系列功能。

商城前后台项目源码全部开源，绝无套路。技术上基于最新得 Spring Boot3.1、Mybatis Plus、Spring Security，整合了 Mysql、Redis、RabbitMQ、ElasticSearch 等常用中间件，根据博主多年线上项目实战经验总结开发而来不断优化、完善。

对于初学者而言本项目是非常易于部署的，根据 readme 中的本地开发指南就能成功启动项目。

并且提供了 docker-compose 一键部署脚本，只需要十多分钟就能在生产环境启动商城前后台所有服务。

项目地址

• 后端接口项目 https://github.com/wayn111/waynboot-mall
• 前端 H5 商城项目 https://github.com/wayn111/waynboot-mobile
• 前端运管后台项目 https://github.com/wayn111/waynboot-admin

功能设计

功能上，waynboot-mall 项目可分为 “H5 商城前台” 和 “运管后台” 两部分。

系统架构

系统架构上，waynboot-mall 项目秉持着小而精的架构特征，经典而不失优雅，

系统设计

从系统设计来看，waynboot-mall 项目选用当前最新 Spring Boot3.1、MyBatis-Plus 开发而来，项目中其他系统组件介绍如下图：

最新迭代

在 waynboot-mall 最新的 1.4.0 版本中，新增了很多功能、商城体验优化、美化样式以及一些 bug 修复，

1. 商城搜索栏，新增搜索建议，支持拼音搜索
2. 标签栏购物车新增商品数量微标
3. 商城购物车新增商品失效处理
4. 购物车页面、订单详情页面样式优化
5. 标签栏切换 bug 修复

附提交记录

waynboot-mall 商城项目经历了三年发展，前后端代码累计有 600 多次提交记录、超过 600 个 star 以及 190 个 fork。

第一次提交记录 2020 年 4 月 20 日

2020 - 2023 提交贡献图

演示GIF

最后聊两句

waynboot-mall 项目发展至今，我也会继续迭代升级，后续会添加秒杀、抽奖等商城系统中的常用营销模块功能。

大家可以关注我以及 waynboot-mall 这个项目，后续商城版本升级迭代最新消息都会第一时间通知大家。

GitHub地址：https://github.com/wayn111/waynboot-mall