前言
从事前端开发有几年时间了，虽然经常需要与后端同事沟通、联调，但对纯后端技术一直没有了解。也经常在网上看到很多人嘲讽说，前端太简单啦，前端开发也能叫程序员？呵呵...
于是，决定一探后端技术，看看后端开发一般项目都用到哪些技术，后端代码都怎么样高大上，便有了这个商城项目。同时，考虑到平时公司使用的前端技术栈一般都是Vue2，而Vue3正式版也出来一段时间了，正好趁这个项目把Vue3用上，顺便再巩固一下React。所以本项目前端技术栈便选择了Vue3 + React，至于后端技术栈，毫无疑问啦，springboot 永远滴神。
本项目是个人对全栈开发的一次实践，因本人是前端开发，所以后端部分可能写得不够深入或严谨哈，多以实现基本的业务逻辑为主，对性能或项目架构方面或考虑得不够，但开发过程中，也参考了一些优秀的开源项目，所以整体来说还算是比较规范的。因为实现的功能和项目架构不算复杂，所以正好可以给到一些对后端技术不熟悉，而又想了解一点后端技术的前端开发同学一些入门的帮助，后端大佬可以无视哈，当然，有问题欢迎指出、交流学习。
技术储备
开始做这个项目前，我花了大概两三个月的业余时间去学习Java知识，包括JavaSE、Java web、MySQL、SSM等，当然只是快速地了解一些常用的语法和操作，这些也是后端开发必须要掌握的基础知识了，所以，如果要想了解后端开发并能用到实践中，最好先把前面提到的那几大块知识点过一遍。
项目地址
- github：github.com/pinxixi-mal…
- gitee：gitee.com/pinxixi-mal…
如果觉得有帮助，点个star咯，谢谢支持！
在线体验
前端部分
前端包含一个PC后台管理系统和一个H5客户端。
-
PC端后台管理系统
技术栈
- React-16.8（hook）
- Antd
- Typescript
源码目录
|-- src
|-- api // 接口文件
|-- assets // 静态资源
|-- components // 组件
|-- config // 项目配置
|-- hooks // 自定义hook
|-- layout // 页面布局
|-- router // 路由配置
|-- store // store仓库
|-- style // 全局样式
|-- types // ts接口
|-- utils // 工具方法
|-- views // 页面
|-- dashboard // 首页看板
|-- goodsManage // 商品管理
|-- homeManage // 首页管理
|-- login // 登录
|-- orderManage // 订单管理
|-- userManage // 用户管理
项目演示（部分）
-
H5客户端
技术栈
- Vue3.x
- Vite2.x
- Vant4.x
- Typescript
- Pinia
源码目录
|-- src
|-- api // 接口文件
|-- assets // 资源文件
|-- components // 组件
|-- config // 项目配置
|-- layout // 页面布局
|-- request // 网络请求
|-- router // 路由
|-- stores // store仓库
|-- styles // 全局样式
|-- types // ts接口
|-- use // 自定义hook
|-- utils // 工具方法
|-- views // 页面
|-- cart // 购物车
|-- category // 分类
|-- goods // 商品模块
|-- home // 首页模块
|-- mine // 我的
|-- order // 订单模块
|-- user // 用户模块
项目演示（部分）
后端部分
技术栈
- Springboot 2.x
- Mybatis
- MySQL 8.x
- Redis
源码目录
|-- pom.xml // 项目依赖
|-- log // 日志输出目录
|-- src
| |-- main
| | |-- java // 源码
| | | |-- com
| | | |-- pinxixi // 包
| | | |-- PinXiXiApplication.java // springboot启动类
| | | |-- common // 公共包
| | | | |-- Constants.java // 常量
| | | | |-- GoodsEnum.java // 商品枚举
| | | | |-- HttpStatus.java // http状态码常量
| | | | |-- HttpStatusEnum.java // http状态码枚举
| | | | |-- PageResult.java // 分页结果
| | | | |-- Result.java // 响应返回结果
| | | | |-- ServiceResultEnum.java // 响应结果枚举
| | | |-- config // 项目配置
| | | | |-- JWTConfig.java // JWT配置（token）
| | | | |-- PinXiXiException.java // 全局异常处理
| | | | |-- RedisConfig.java // Redis配置
| | | | |-- SwaggerConfig.java // swagger配置
| | | | |-- WebMvcConfig.java // 全局拦截配置
| | | | |-- annotation // 注解
| | | | | |-- AdminUserArgument.java // 管理员信息参数注解
| | | | | |-- ClientUserArgument.java // 客户信息参数注解
| | | | |-- handler // 处理器
| | | | | |-- AdminUserArgumentResolver.java // 管理员注解处理器
| | | | | |-- ClientUserArgumentResolver.java // 客户注解处理器
| | | | | |-- PinXiXiExceptionHandler.java // 异常处理器
| | | | |-- interceptor // 拦截器
| | | | |-- TokenInterceptor.java // token拦截器
| | | |-- controller // 请求控制层
| | | |-- dao // 数据访问对象
| | | |-- entity // 实体类
| | | |-- service // 业务处理层
| | | |-- utils // 工具类
| | |-- resources // 资源
| | |-- application.yml // 项目配置
| | |-- deploy.sh // 部署脚本
| | |-- logback-spring.xml // 日志配置
| | |-- pinxixi_mall_sql_prod.sql // 项目SQL
| | |-- mapper // SQL映射
| |-- test // 测试相关
|-- target // 编译目录
最后
简简单单写个全栈项目，虽然算不上大型项目，但功能还算比较全，用来上手Vue3，或者入门springboot，还是够用的。第一次写Java项目，也算是对后端开发有了一个更全面的认识，单从写一般业务代码的角度看，后端CRUD也并不比前端高级到哪里去嘛。
