仿小米商城

前言

本项目是基于GitHub上一个作者hai-27开发的补充。他是使用vue、node.js做的前后端分离项目。

我是对他的前端进行采用并进行修改，后端使用SpringBoot框架实现的一个仿小米商城。

感谢 hai-27 的开源 vue-store 项目提供前端页面及框架支持

项目简介

本项目前后端分离，前端基于Vue+Vue-router+Vuex+Element-ui+Axios，参考小米商城实现。后端基于SpringBoot +Redis+ RabbitMQ + MySQL实现。

实现了用户注册与登录，商城首页展示，商品分类展示，商品详情页，购物车，订单结算，我的收藏等功能。

并在原作者的基础上添加了商品秒杀部分。

后端接口全部采用Resultful风格，因此前端接口以及部分内容也有修改。

前端项目地址：https://github.com/ZeroWdd/vue-store

后端项目地址：https://github.com/ZeroWdd/Xiaomi

项目已部署

仿小米商城： http://47.95.254.97:8080/

技术栈

• 前端：Vue+Vue-router+Vuex+Element-ui+Axios
• 后端：SpringBoot +Redis+ RabbitMQ
• 数据库：Mysql

功能实现

• 用户注册与登录
• 商品首页展示
• 商品分类列表展示
• 商品详情页
• 购物车
• 订单结算
• 我的收藏
• 我的地址
• 秒杀商品
• 商品支付

运行项目

前端运行

1. Clone project

git clone https://github.com/ZeroWdd/vue-store.git

2. Project setup

cd vue-store
npm install

3. Compiles and hot-reloads for development

npm run serve

4. Compiles and minifies for production

npm run build

后端运行

1. 修改application.yml文件中的mysql、redis、rabbitmq的地址
2. 运行SpringBoot项目

页面截图

首页

全部商品

购物车

我的收藏

我的订单

登录

注册