菜谱网站内容( 项目说明开发环境Win10.js10.16.0，含后台管理系统移动端 )

　　菜谱网站内容(

项目说明开发环境Win10.js10.16.0，含后台管理系统移动端

)

　　基于 Vue+Node.js网站 的移动端食谱

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

　　从三月初开始，花了半个多月的时间，选了一个自己感兴趣的内容，基本完成了自己想要实现的功能。虽然完全是自己开发的，但还是基于王者荣耀的移动端，之前练过的。对于开发，也参考了一些开源项目。整体功能设计比较简单。与纯静态显示界面相比，移动端的设计增加了一些新功能。

　　作为一个新手，我知道还有很多东西要学。完成这个小项目应该算是巩固了我之前所学的。毕竟熟能生巧，总觉得跟着视频学起来不难。一旦自己动手，还是有很多意想不到的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的菜谱应用，包括后台管理系统的移动网页

　　项目截图

　　后台管理：

　　项目总结

　　相比之前的王者荣耀移动端练手项目，在这个项目中，我根据实际情况增加了用户登录注册、登录后个人中心显示、用户发布菜谱、搜索菜谱等新功能。它不再是简单的静态页面展示。

　　页面设计中还引入了一些不用的组件，比如底部导航栏、水平滚动条、分类导航等，当然问题也不少。

　　组件：

　　特征：

　　疯狂的错误：

　　查询（'cors'）（））

- 查询parent分类

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

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

　　queryOptions.populate='父'

　　}

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

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