Spring Boot+Vue 3 大型前后端分离项目实战

本书详细讲解Spring Boot + Vue 3大型前后端分离项目实战，涉及前后端分离开发模式的基本学习方法、技术趋势、开发环境和开发工具等基础知识;涉及核心源码、模板引擎、数据库等分析，以及分页、文件上传等功能的编码实现;涉及从0开始动手搭建一个企业级的商城项目，包括其前后端所有功能模块的技术开发。本书重在引导读者进行直实的项目开发体验，围绕Spring Boot + Vue 3技术栈全面展开，兼顾相关技术的知识拓展，由浅入深，步步为营，使读者既能学习基础知识，又能堂握一定的开发技巧。本书的目标是让读者拥有一个完整且高质量的学习体验，远离“Hello World”项目，为技术深度的挖掘和薪水、职位的提升提供保障。

十三，企业技术主管、掘金优秀作者、CSDN博客专家、专栏作者、视频讲师。GitHub开源项目newbee-mall系列的主理人，多年一线开发经验，历任高级开发工程师、后端主程、技术部门主管等职位。熟练使用Java、SQL、Spring Boot、Vue等计算机语言和开发框架，有非常丰富的开发经验，同时也是开源项目的爱好者和贡献者。

尼克陈，资深前端开发、掘金优秀作者、掘金小册作者。毕业于宁波大学科技学院，多年一线开发经验，对前端技术有自己的理解，善于通过多个角度，通俗易懂地阐述前端知识点。熟练使用NodeJS、React、Vue等计算机语言和开发框架，热衷各种有趣的前端工具库的研究。

本书内容全面、深入地讲解Spring Boot技术栈和Vue 3技术栈的技术原理、功能点开发和项目实战。读者可以收获：

?? 掌握Vue 3框架的使用方法和实战技巧；

?? 积累前后端分离项目开发的实战经验；

?? 掌握Spring Boot技术栈的基本使用方法和开发技巧；

?? 积累Spring Boot项目开发的实战经验；

?? 具有Vue-Router 路由原理的解析能力；

?? 具有企业级项目开发和统筹的能力；

?? 如果你在发愁毕业设计或缺少项目经验，那么这个项目可以给你提供很多思路。

自序

大家好，我是十三。

非常感谢大家阅读本书，在技术道路上，从此我们不再独行。

写作背景

2017年2月24日，笔者正式开启技术写作之路，同时也开始在GitHub网站上做开源项目，由于一直坚持更新文章和开源项目，因此慢慢地被越来越多的人所熟悉。2018年6月7日，电子工业出版社的陈林编辑通过邮件联系笔者并邀请笔者写书。从此，笔者与电子工业出版社结缘。2018年笔者也被不同的平台邀请制作付费专栏课程。从2018年9月起，笔者陆陆续续在CSDN图文课、实验楼、蓝桥云课、掘金小册、极客时间等平台上线了多个付费专栏和课程。2020年，笔者与电子工业出版社的陈林编辑联系并沟通了写作事宜，之后签订了图书写作意向合同，笔者的第一本书在2021年正式出版。本书是我们合作的第二本书。

笔者写作的初衷是把自己对技术的理解及实战项目开发的经验分享给读者。过去几年的经历可以整理成下面的图，“免费文章→付费专栏→付费视频→实体图书”，从0到1，从无到有，都是一步一步走过来的。这些就是笔者的写作背景。

同时，笔者也会将付费专栏和本书中用到的实战项目开源到GitHub和Gitee两个开源代码平台上。本书中Spring Boot+Vue 3前后端分离的实战项目newbee-mall-vue3-app就是笔者开发的一个开源项目。

从项目的构思到图书的编写笔者都选择了当前非常受欢迎的技术栈——Spring Boot和Vue。为了让读者更好地学到可用于实践的知识，在写作过程中，从项目的初始化构建到应用落地，每一步都有详细的代码和分步解读。本书讲解的Spring Boot+Vue 3前后端分离项目并不是一个“Hello Word”项目，这个项目代码量充足、组件完善、页面美观、交互完整，能够给读者提供充足的支持和良好的学习体验。本书中的很多代码逻辑在真实工作环境中是普遍适用的，灵活运用这些代码逻辑，利用发散思维将其移植到其他形式的项目中，是笔者在书中一直强调的观点。如果本书能够帮助读者学会Spring Boot和Vue，并且开发一些实际项目，那么笔者就非常满足了，这一次的写作也变得意义非凡。

你会学到什么

本书的代码基于Spring Boot 2.3.7.RELEASE版本和Vue 3.0版本。通过28章的内容全面、深入地讲解Spring Boot技术栈和Vue 3技术栈的技术原理、功能点开发和项目实战。另外，本书从书稿整理完成至正式出版耗时近一年时间，在这段时间里，Spring Boot和Vue两大技术栈也有一些版本升级，比如Spring Boot 2.7.3发版、Spring Boot 3.0版本即将发布正式版本、Vue 3.2发版。对于这些情况，笔者会在本书实战项目的开源仓库中创建不同的代码分支，保持实战项目的源码更新，保证读者朋友们不会学习过气的知识点。

工欲善其事，必先利其器。本书注重基础环境的搭建和开发工具的使用，以帮助读者少走弯路，快速掌握Spring Boot+Vue 3前后端分离项目的开发技能。

学习完本书，读者会有以下收获：

?? 掌握Vue 3框架的使用方法和实战技巧；

?? 积累前后端分离项目开发的实战经验；

?? 掌握Spring Boot技术栈的基本使用方法和开发技巧；

?? 积累Spring Boot项目开发的实战经验；

?? 具有Vue-Router 路由原理的解析能力；

?? 具有企业级项目开发和统筹的能力；

?? 如果你在发愁毕业设计或缺少项目经验，那么这个项目可以给你提供很多思路。

读者对象

本书定位Spring Boot+Vue前后端项目的实战和进阶，资深开发人员可按需选择对应的章节阅读。为了照顾有一定编程经验的初学者，本书也设置了入门章节。以下读者非常适合学习本书：

?? 需要学习Spring Boot完整项目的开发人员；

?? 需要学习Vue 3完整项目的开发人员；

?? 前端开发人员；

?? 需要前后端分离项目实战的开发人员；

?? 想要成为全栈开发工程师的开发人员；

?? 从事Java Web开发的技术人员；

?? 计算机/软件专业大学生；

?? 想完成一个完整项目作为面试敲门砖的开发人员；

?? 想要将自己的项目上线到互联网的开发人员。

源代码

本书每个实战章节都有对应的源码并提供下载，读者可以在本书封底扫码获取。

最终的实战项目是笔者的开源项目newbee-mall-vue3-app和newbee-mall-api，最新的源码可以在开源网站GitHub和Gitee上搜索并下载。

致谢

感谢本书的另一位作者尼克陈，能够最终成书和出版离不开他的支持与奉献。没有他的认真负责和辛苦付出，本书的知识点不会如此丰富和充足。7年的从业经验让他对前端知识体系有了更深刻的理解。他的授业理念不是生搬硬套，而是教你如何学习一个知识点、如何用学到的知识点解决业务上遇到的问题。

感谢本书编辑陈林老师。从第一封邮件开始，他就展现了出版人员的专业性和耐心。在写作中，陈老师对本书的内容脉络做了非常多的指导工作，也给予笔者非常多的帮助和鼓励。在书稿整理完成后，陈老师不断调整和优化稿件中的内容，以确保图书质量，获得读者认可。感谢电子工业出版社的美术编辑李玲和文字编辑戴新等老师，本书能够顺利出版离不开他们的奉献，感谢他们辛苦、严谨的工作。

感谢newbee-mall系列开源仓库的各位用户及笔者的专栏文章的所有读者，他们提供了非常多的修改和优化意见，使这个Spring Boot+ Vue 3前后端分离项目变得更加完善，也为笔者提供了持续写作的动力。

感谢掘金社区运营负责人优弧和运营人员Captain。本书部分内容是基于掘金小册《Vue商城项目开发实战》中的章节来扩展的，本书能顺利出版也得到了掘金社区的大力支持。

特别感谢家人，没有他们的默默付出和巨大的支持，笔者不可能有如此多的时间和精力专注于本书的写作。

感谢每一位没有被提及名字，但是曾经帮助过笔者的贵人。

韩 帅

目录
第1章 前后端分离开发模式介绍????????????????????????????????????????????????????1
第2章 SpringBoot+Vue3前后端分离实战商城项目的需求分析与功能设计??????????????????9
第 3 章 后端技术栈选择之 Spring Boot ??????????????????????????????????????????????22
第4章 后端代码运行环境及开发工具安装????????????????????????????????????????????30
第5章 SpringBoot项目搭建及快速上手??????????????????????????????????????????????44
第6章 SpringBoot实践之Web功能开发??????????????????????????????????????????????59
第7章 SpringBoot实践之操作MySQL数据库??????????????????????????????????????????81
第8章 SpringBoot实践之整合Swagger接口管理工具??????????????????????????????????108
第9章 商城后端API项目启动和运行注意事项??????????????????????????????????????122
第10章 后端API实战之用户模块接口开发及功能讲解????????????????????????????????145
第11章 后端API实战之首页接口开发及功能讲解????????????????????????????????????183
第12章 后端API实战之分类接口开发及功能讲解????????????????????????????????????209
第13章 后端API实战之商品模块接口开发及功能讲解????????????????????????????????229
第14章 后端API实战之购物车模块接口开发及功能讲解??????????????????????????????249
第15章 后端API实战之订单模块接口开发及功能讲解????????????????????????????????278
第16章 Vue3项目搭建及Vite原理浅析??????????????????????????????????????????????313
第17章 Vue．js数据绑定??????????????????????????????????????????????????????????343
第18章 Vue3新特性??????????????????????????????????????????????????????????????389
第19章 CSS预处理工具Less的介绍和使用规范????????????????????????????????????????426
第20章 Vue．js组件的应用????????????????????????????????????????????????????????448
第21章 路由插件Vue-Router的使用和原理浅析????????????????????????????????????????471
第22章 全局状态管理插件Vuex的介绍和使用????????????????????????????????????????489
第23章 Vue3项目实战之开发环境搭建????????????????????????????????????????????????504
第24章 Vue3项目实战之底部导航栏和公用组件提取??????????????????????????????526
第25章 Vue3项目实战之用户模块????????????????????????????????????????????????????544
第26章 Vue3项目实战之首页和分类页面??????????????????????????????????????????????570
第27章 Vue3项目实战之商品搜索和商品详情????????????????????????????????????????????????605
第28章 Vue3项目实战之下单购物流程??????????????????????????????????????????????????????633