Vue+Spring Boot 前后端分离的商城项目开源啦！

新蜂商城 Vue 移动端版本开源啦！

去年开源新蜂商城项目后，就一直在计划这个项目 Vue 版本的改造，2020 年开始开发并且自己私下一直在测试，之前也有文章介绍过测试过程和存在的问题，修改完成后，于 5 月底将 Vue 版本的所有代码开源了，只是后面一直太忙，没有时间整理这篇文章。

现在，向大家介绍一下这个 Vue 版的前后端分离商城项目。

所有的代码、文件全部都开源到 GitHub 仓库中，并没有任何藏着掖着的行为，不会说缺少哪个依赖或者某个重要功能，这种事情是不存在的，大家先看看文章和预览图，觉得不错的朋友可以继续了解一下这个项目。

当然，也希望感兴趣的朋友可以找找其中的问题，提一些 pr 或者 issue，让这个开源项目能够减少问题并且保持进步。

image

newbee-mall 在 GitHub 和国内的码云都创建了代码仓库，如果有人访问 GitHub 比较慢的话，建议在 Gitee 上查看该项目，两个仓库会保持同步更新。

新蜂商城回顾

2019 年 10 月份我在 GitHub 开源仓库中上传了新蜂商城项目的所有源码，至今已经有近一年的时间了，感兴趣的可以去了解一下这个 Spring Boot 技术栈开发的商城项目，开源地址如下：

newbee-mall 在 GitHub 和国内的码云都创建了代码仓库，如果有人访问 GitHub 比较慢的话，建议在 Gitee 上查看该项目。

image

当然，本文的主角并不是这个商城项目，而是这个项目的第二个版本：新蜂商城 Vue 版本。

之前我也在

《「newbee-mall新蜂商城开源啦」1000 Star Get !仓库Star数破千！记录一下》

和

《「newbee-mall新蜂商城开源啦」GitHub 上最热门的 Spring Boot 项目，我也要做一次靓仔！》

两篇文章中介绍了新蜂商城的未来规划和 Vue 版本的开发想法，我也并没有食言，现在这个 Vue 商城已经开发完成并且开源到 GitHub 了。

原来的新蜂商城只有一个 PC 端的页面，现在加入了 Vue 版本之后，新蜂商城的展现形式更加丰富了，现在的新蜂商城变成了这样：

image

从左到右依次为：新蜂商城后台管理系统页面、新蜂商城 PC 端页面、新蜂商城 Vue 版本的三个页面。

不仅仅是展现形式的增多和产品线的丰富，技术栈也加入了 Vue，开发模式也变成了前后端分离模式。

Vue 版本开发及测试

这个项目的开发和制作过程也是很有意思的事情，所以大致的整理了一下时间线。

具体的开发时间有些记不清楚了，查了一下提交记录，第一次提交是在 2020 年的 2 月 13 号：

image

不过初次提交的代码中，已经有很多文件了，所以之前也是开发过一段时间的，时间应该在 2020 年 1 月份，那个时候开始动工开发。

开发版本的最后一次提交是在 2020 年 5 月 15 日：

image

开发的时候感觉还不错，就是有时间就完善一些功能，并没有特别大的压力，直到测试阶段，才感觉到一些压力，因为确实测出了不少的问题，不仅仅是自测，在 QQ 群里让大家帮忙测试的时候也收到了不少的反馈，改了不少的 bug。

测试流程一共走了三次。

第一次是在四月初，当时功能并没有完全开发完成，不过主要页面都制作好了，所以就和几个朋友简单测试了一下，主要围绕页面样式、UI还原度、数据显示以及基本的功能流程，问题很多，自己写的时候没有发现，但是让别人测的时候，大家基本都提出了很多的问题。

第一次测试结果：稀烂。

看到这个结果还是有些慌的，因为之前计划就是在 5 月初开源的，基础问题还有不少确实就有点完不成既定计划的意思，之后花了比较多的精力在这个项目上面，把问题都修复掉、同时把剩下的功能开发好，花了 20 天左右的时间。

紧接着就是第二次测试，时间点是在四月二十几号，又多找了几个朋友帮忙测试。这次测试就要比之前一次更加全面，验证第一次的问题修复掉没有，同时要走完所有的功能流程，每一个步骤都要反复测试、反复的验证，有些能修改的当时就修改了，问题复杂的就记录下来后面再改。还有机型和适配也简单的验证了一下，但是毕竟不是专业的测试，手头上也没有太多的机器，所以只是简单的验证了一波，也发现了一些问题。

第二次测试结果：及格。

之后呢，当然就是整理这两次的测试结果及其中的问题，然后针对性的去修复，本来计划在五月初开源，但是因为两次的测试结果不是非常理想，就顺延到后面了，测试过程和修改过程花费的时间挺多的，主要还是对自己负责，对大家负责，我把一份不完整或者有问题的代码放到开源仓库，这肯定也不是一个太好的做法，我尽量把完善的内容交给大家。又开发了大概 20 天左右，把所有问题都修复完成并且自己也验证了多次。

这两次测试时碰到的问题我都记录到这篇文章中了，有好奇的同学也可以去看一下：《「newbee-mall新蜂商城开源啦」前后端分离的 Vue 版本即将开源》。

第三次测试就是在 5 月 23 号：

image

当天是周六，感觉大家可能都有时间，就把这件事发到了我的几个 QQ 群里，让所有人都去测试和体验一下，从注册流程到之后的购物模块都测试一遍，聊天记录挺多的，感觉大家也比较热情，但是当时的体验并不是非常好，因为个人服务器的带宽比较低，所以大家都觉得有些卡顿。

这次测试除了访问有些慢之外，大家并没有反馈太多问题，之后针对这些零零散散的问题又进行了一次修复，然后在 2020 年 5 月 30 号就全部放到 GitHub 开源仓库上了：

image

以上就是新蜂商城 Vue 版本的开发及开源过程，从计划到开发、到测试、再到成功开源差不多花费了半年的时间。结果也很好，我没有放大家鸽子，从去年就告诉大家要开源 Vue 版本的商城项目，到今年把所有代码开发并放到开源网站上，虽然时间推迟了一个月左右，但是整体来说是比较圆满的。

希望大家喜欢这个项目，多多支持它！有问题我一定及时修复，同时我也会继续围绕新蜂商城做其他的功能和技术栈的拓展。

总结

从年初写下第一行代码到 5 月 30 号把所有代码全部开源，花费了半年时间写了一个 Vue 商城的开源项目，虽然过程挺曲折，但是结果总是让人开心的，希望大家也能满意。

这是第一篇介绍新蜂商城 Vue 版本的文章，时间比较仓促并没有整理太多内容，后续会根据大家的反馈再整理几篇文章，如果大家有什么问题也可以及时和我说，我之后也会整理出更详细的内容给大家。

由于去年给了大家这样一个承诺：我要写一个 Vue 版本的商城项目给大家。

今年，我做到了。

于是，新蜂商城 Vue 版本就开源了。

除注明转载/出处外，皆为作者原创，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文链接，否则保留追究法律责任的权利。
原文链接：https://www.cnblogs.com/han-1034683568/p/13496643.html

欢迎关注我的博客，里面有很多精品合集

本文转载注明出处（必须带连接，不能只转文字）：字母哥博客。

觉得对您有帮助的话，帮我点赞、分享！您的支持是我不竭的创作动力！ 。另外，笔者最近一段时间输出了如下的精品内容，期待您的关注。