菜谱网站内容 项目总结与上一个练手的王者荣耀移动端

　　菜谱网站内容

项目总结与上一个练手的王者荣耀移动端

　　基于Vue+Node.js网站的手机配方

　　【美食角】是我在学习Vue、Node.js等相关技术后自主开发的菜谱webapp。收录后台管理系统，参考了当前主流配方应用的功能和界面设计。

　　从3月初开始，我开始选择自己感兴趣的内容，基本完成了自己想要实现的功能。总共用了半个月。虽然完全是我自己开发出来的，但依旧是修炼前的王者荣耀。基于移动端开发，也参考了一些开源项目。整体功能设计比较简单。与纯静态显示界面相比，移动端的设计增加了一些新的功能。

　　作为新手，我明白还有很多东西要学。完成这个小项目是为了巩固之前所学的知识。毕竟，熟能生巧。一直觉得跟视频学习没什么难度。自己做了一次，还是有很多意想不到的bug，在解决这些问题的同时，我也觉得自己的能力得到了一定的提升。

　　项目描述

　　开发环境 Win10 node.js 10.16.0 Chrome

　　Github 地址：

　　项目地址：webapp、后台管理系统

　　技术栈

　　vue + node.js + express + mongodb + elementui

　　项目运营

　　运行前你需要安装好：

node.js 10+、mongodb、nodemon、vue cli3

项目运行：

clone项目到本地

npm install

cd web(移动端)/admin(后台管理系统)

npm run serve

访问地址

　　目标函数

　　移动端：

　　后台管理系统：

　　个人全栈项目Food Corner，一个基于node-express-vue-mongodb的菜谱应用，收录一个后台管理系统移动网页

　　项目截图

　　后台管理：

　　项目总结

　　与之前的王者荣耀移动项目相比，我在这个项目中根据实际情况增加了新的功能，比如用户登录注册、登录后个人中心显示、用户发布食谱、搜索食谱等。有一个纯粹的静态页面显示。

　　在页面设计中，也引入了一些未使用的组件，比如底部导航栏、水平滚动条、分类导航等，当然也遇到了很多问题。

　　组件：

　　功能：

　　疯狂的错误：

　　quire(‘cors’)())

- 查询parent分类

好几次在查询上级分类的时候发现只能请求到上级分类的id，在这个上面花了很多时间，发现忘了加上下面这个查询

　　if(req.Model.modelName===‘Xxx’){//xxx 是收录父对象的模型名称

　　queryOptions.populate='parent'

　　}

- 使用静态资源（忘记加/），又是比较粗心的错误

　　app.use('/uploads',express.static(__dirname + '/uploads'))