高仿小米商城项目,我爱了!
项目简介
本项目前后端分离,前端基于Vue+Vue-router+Vuex+Element-ui+Axios,参考小米商城实现。后端基于Node.js(Koa框架)+Mysql实现。
后端采取了MVC模式,根据前端需要的数据分模块设计了相应的接口、控制层、数据持久层。后端传送地址store-server 。
技术栈
-
前端:Vue+Vue-router+Vuex+Element-ui+Axios 后端:Node.js、Koa框架 数据库:Mysql
功能模块
登录
用户输入的数据往往是不可靠的,所以本项目前后端都对登录信息进行了校验,前端基于element-ui的表单校验方式,自定义了校验规则进行校验。
注册
用户输入的数据往往是不可靠的,所以本项目前后端同样都对注册信息进行了校验,前端基于element-ui的表单校验方式,自定义了校验规则进行校验。
首页
首页主要是对商品的展示,有轮播图展示推荐的商品,分类别对热门商品进行展示。
全部商品
全部商品页面集成了全部商品展示、商品分类查询,以及根据关键字搜索商品结果展示。
商品详情页
我的购物车
购物车采用vuex实现,页面效果参考了小米商城的购物车。
详细实现过程请看:基于Vuex实现小米商城购物车
订单结算
用户在购物车选择了准备购买的商品后,点击“去结算”按钮,会来到该页面。 用户在这里选择收货地址,确认订单的相关信息,然后确认购买。
我的订单
对用户的所有订单进行展示。
效果预览
体验地址
http://106.15.179.105/
后台回复「小米」即可获取项目地址
项目简介 本项目前后端分离,前端基于Vue+Vue-router+Vuex+Element-ui+Axios,参考小米商城实现。后端基于Node.js(Koa框架)+Mysql实现。 后端采取了MVC模式,根据前端需要的数据分模块设计了相应的接口、控制层、数据持久层。后端传送地址store-server 。 技术栈 前端:Vue+Vue-router+Vuex+Element-ui+Axios 后端:Node.js、Koa框架 数据库:Mysql 功能模块 登录 用户输入的数据往往是不可靠的,所以本项目前后端都对登录信息进行了校验,前端基于element-ui的表单校验方式,自定义了校验规则进行校验。 注册 用户输入的数据往往是不可靠的,所以本项目前后端同样都对注册信息进行了校验,前端基于element-ui的表单校验方式,自定义了校验规则进行校验。 首页 首页主要是对商品的展示,有轮播图展示推荐的商品,分类别对热门商品进行展示。 全部商品 全部商品页面集成了全部商品展示、商品分类查询,以及根据关键字搜索商品结果展示。 商品详情页 我的购物车 购物车采用vuex实现,页面效果参考了小米商城的购物车。 详细实现过程请看:基于Vuex实现小米商城购物车 订单结算 用户在购物车选择了准备购买的商品后,点击“去结算”按钮,会来到该页面。 用户在这里选择收货地址,确认订单的相关信息,然后确认购买。 我的订单 对用户的所有订单进行展示。 效果预览 体验地址 http://106.15.179.105/ 后台回复「小米」即可获取项目地址上一篇:
IDEA上Java项目控制台中文乱码