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

时间 2020-08-18

标签 vue+spring vue spring boot 后端分离商城项目开源栏目 Spring 繁體版

原文原文链接

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

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

如今，向你们介绍一下这个 Vue 版的先后端分离商城项目。vue

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

固然，也但愿感兴趣的朋友能够找找其中的问题，提一些 pr 或者 issue，让这个开源项目可以减小问题而且保持进步。github

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

新蜂商城回顾

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

newbee-mall 在 GitHub 和国内的码云都建立了代码仓库，若是有人访问 GitHub 比较慢的话，建议在 Gitee 上查看该项目。服务器

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

以前我也在前后端分离

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

和

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

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

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

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

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

Vue 版本开发及测试

这个项目的开发和制做过程也是颇有意思的事情，因此大体的整理了一下时间线。

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

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

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

开发的时候感受还不错，就是有时间就完善一些功能，并无特别大的压力，直到测试阶段，才感受到一些压力，由于确实测出了很多的问题，不只仅是自测，在 QQ 群里让你们帮忙测试的时候也收到了很多的反馈，改了很多的 bug。

测试流程一共走了三次。

第一次是在四月初，当时功能并无彻底开发完成，不过主要页面都制做好了，因此就和几个朋友简单测试了一下，主要围绕页面样式、UI还原度、数据显示以及基本的功能流程，问题不少，本身写的时候没有发现，可是让别人测的时候，你们基本都提出了不少的问题。

第一次测试结果：稀烂。

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

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

第二次测试结果：及格。

以后呢，固然就是整理这两次的测试结果及其中的问题，而后针对性的去修复，原本计划在五月初开源，可是由于两次的测试结果不是很是理想，就顺延到后面了，测试过程和修改过程花费的时间挺多的，主要仍是对本身负责，对你们负责，我把一份不完整或者有问题的代码放到开源仓库，这确定也不是一个太好的作法，我尽可能把完善的内容交给你们。又开发了大概 20 天左右，把全部问题都修复完成而且本身也验证了屡次。

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

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

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

此次测试除了访问有些慢以外，你们并无反馈太多问题，以后针对这些零零散散的问题又进行了一次修复，而后在 2020 年 5 月 30 号就所有放到 GitHub 开源仓库上了：

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

但愿你们喜欢这个项目，多多支持它！有问题我必定及时修复，同时我也会继续围绕新蜂商城作其余的功能和技术栈的拓展。

总结

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

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

因为去年给了你们这样一个承诺：我要写一个 Vue 版本的商城项目给你们。

今年，我作到了。

因而，新蜂商城 Vue 版本就开源了。

写在最后

作个小推广，感兴趣的朋友能够看一看，最近我在掘金平台上发布了一个新的专栏《Vue 商城项目开发实战》（预售阶段5折优惠）。

基于真实项目的实战开发，即学即用！

这是一个先后端分离的线上商城项目，技术栈为 Spring Boot 和 Vue，帮助读者具有开发和统筹一个完整项目的能力是本专栏的目标，本专栏将会带你进行一次 Spring Boot + Vue 全栈项目开发的开发实战，让你在实战中融会贯通当下的热门技术栈。

选取当下主流的技术，带你从零开始实现一个完整且纯正的先后端分离商城应用，实现前端、后端、数据库设计与开发流程，本专栏将经过技术栈的详细讲解、多个功能模块的开发实践、并结合实际项目开发中的产品流程来完成这个任务。

感兴趣的朋友能够关注一下。

除注明转载/出处外，皆为做者原创，欢迎转载，但未经做者赞成必须保留此段声明，且在文章页面明显位置给出原文连接，不然保留追究法律责任的权利。