仿美团外卖的全栈项目(vue+node+mongodb)带支付->大三求实习

发布时间:2019-05-15 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了仿美团外卖的全栈项目(vue+node+mongodb)带支付->大三求实习脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

关于

2019届大三学生,前段时间一直想一个人单独开发一个较为完整的项目,在众多应用中,考虑之后选择了美团外卖来模仿,这段时间就利用课余时间进行开发,前端用vue+vuex+vue-router+axios,因为需要用到定位和支付等功能,需要后端配合,而且想要做真正数据交互,所以用express(基于nodejs的框架)做后台,数据库用NOSQL的mongodb。 前端项目包含20多个路由,涉及到vue文件有40个,功能设计登录,定位,浏览商品,加购物车,下订单,支付(支持微信和支付宝的扫码支付和调起app支付),评价,个人信息更改,是一个较为完整的项目。

注意:此项目为个人开发实践练习,不作为任何商业用途

重要事情先讲一遍

求广深实习,现在可以开始上班(要求暑假上班也可以),每周保证4天以上的上班时间

功能

  • 登录/注销
  • IP定位
  • 搜索地址
  • 获取商店(计算当前位置和商店的距离)
  • 加购物车
  • 下订单
  • 支付(支持微信和支付宝的扫码支付和调起app支付)
  • 评价
  • 头像上传(用了七牛云存储)
  • 图片懒加载

技术栈

  • Webpack-cli搭建项目
  • Vue全家桶(vue+vuex+vue-router)
  • CSS预处理器SCSS
  • axios与后端进行请求数据
  • 使用better-scroll滚动
  • 七牛云存储图片
  • 支付宝和微信支付
  • Express搭建后端服务
  • Mongoose对MongoDB进行便捷操作
  • 使用Charles抓取数据

多图预警

仿美团外卖的全栈项目(vue+node+mongodb)带支付->大三求实习

定位和搜索商家

仿美团外卖的全栈项目(vue+node+mongodb)带支付->大三求实习

扫码支付

仿美团外卖的全栈项目(vue+node+mongodb)带支付->大三求实习

调起APP支付

仿美团外卖的全栈项目(vue+node+mongodb)带支付->大三求实习

购物车

仿美团外卖的全栈项目(vue+node+mongodb)带支付->大三求实习

商品操作

仿美团外卖的全栈项目(vue+node+mongodb)带支付->大三求实习

评论

仿美团外卖的全栈项目(vue+node+mongodb)带支付->大三求实习

其它操作

仿美团外卖的全栈项目(vue+node+mongodb)带支付->大三求实习

还有一些其它功能就不放图了哈

线上地址

请用谷歌浏览器然后开启移动端浏览,如果要调用APP支付就需要用手机自带浏览器打开,然后支付时选择调起APP支付

线上地址

仓库地址

代码已开源到github上面,有具体的运行操作,如果觉得还可以,请给个Star哈哈!

github地址

未完待续

还有商家管理PC端还没写完,等写完再开源出来

写在最后

因为还是学生,平时最多也是和同学一起开发,并没有参与过真正的企业团队开发,所以应该有很多地方做的不是很好,欢迎各位大佬们给我提一些意见,最后再问一句哈,求广深实习,现在可以开始上班(要求暑假上班也可以),每周保证4天以上的上班时间。如果没有,我等下再来问哈。。。

脚本宝典总结

以上是脚本宝典为你收集整理的仿美团外卖的全栈项目(vue+node+mongodb)带支付->大三求实习全部内容,希望文章能够帮你解决仿美团外卖的全栈项目(vue+node+mongodb)带支付->大三求实习所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。
标签:CSSVue