毕业论文--基于WEB前端开发技术的网站设计.docx

PAGE PAGE 2 毕 业 设 计（论 文） 设计(论文)题目：基于WEB前端开发技术的网站设计 2017年 3 月 20 日  目 录 TOC \o "1-3" \h \u 摘 要 2 1绪论 1 1.1 课题研究背景 1 1.2 国内外移动端网站建设状况 1 1.3 课题研究的目的和意义 2 2前端开发工具及相关技术 3 2.1 Web前端开发环境 3 2.2 Web前端开发工具 3 2.2.1 Sublime Text 3 2.2.2 Webstorm编辑器 4 2.3 Web前端开发相关技术 4 2.3.1 Html、Div+Css 4 2.3.2 Javascript语言 5 2.3.3 NodeJs简介 6 2.3.4 VueJs框架 7 2.3.5 Webpack模块打包 8 3 系统可行性及需求分析 10 3.1 系统可行性分析 10 3.2 需求分析 11 3.2.1 公共组件Header 11 3.2.2商品列表组件Goods 12 3.2.3商品详情组件Food 13 3.2.4评价列表组件Ratings 14 3.2.5商家详情组件Seller 15 3.3 非功能性需求分析 16 4系统详细设计 18 4.1 开发相关说明 18 4.2 项目开发流程 18 4.2.1. Vue-Cli构建框架 18 4.2.2数据Mock和路由 20 4.2.3Web App架构设计 21 4.2.4 编译打包 23 5系统测试 25 5.1测试目的及相关问题 25 5.2 测试步骤 25 6结论 26 参考文献 28 毕业设计（论文）：基于WEB前端开发技术的网站设计 PAGE PAGE 2 摘 要 伴随着移动互联网的发展，基于VueJs前端框架开发的Web App网站，将使人们对传统网站的观念有极大的改变。传统型网站，其传递信息的方式主要通过PC浏览器，由于其在手机浏览器的体验不佳，造成部分用户群体的流失。而Web App网站的出现，其使用VueJs前端框架将HTML5，及CSS3进行封装成组件，自定义标签，满足开发者需求，将会打破这个不平衡的局面。那是手机浏览器支持HTML5+，Javascript，和Web App网站带来的益处。站在开发商的角度，Web App网站会在应用市场里吸引更多的激活用户，提升用户在浏览器的留存与转换付费，和它的轻量级使客户更愿意用浏览器使用，而不是下载手机客户端APP，流量入口得到更大扩大；站在最终用户的角度，Web App网站具有省空间，省流量，省电，不卡诸多优点。采用VueJs前端框架设计实现仿饿了么Web App网站，将为产品的展示提供了一个快捷入口，不需要下载对应的客户端，只需在浏览器中即可使用，在地推该产品的同时，也能够让用户深入了解该产品。 关键词：VueJs框架，Web App网站，HTML5，CSS3，Javascript Abstract With the development of mobile Internet, the Web App website based on the development of the VueJs front-end framework will make people have a great change in the traditional concept of . Traditional website, the main way to transmit information through the PC browser, due to its poor experience in the mobile browser, resulting in the loss of some user groups. The emergence of the Web App site, the use of VueJs front-end framework will be HTML5, and CSS3 package into components, custom tags, to meet the needs of developers, will break the imbalance situation. That is the benefits of mobile browser support H