没有合适的资源?快使用搜索试试~ 我知道了~
基于Vue的体育汇App设计与实现.doc
1.该资源内容由用户上传,如若侵权请联系客服进行举报
2.虚拟产品一经售出概不退款(资源遇到问题,请及时私信上传者)
2.虚拟产品一经售出概不退款(资源遇到问题,请及时私信上传者)
版权申诉
0 下载量 49 浏览量
2023-09-11
13:12:29
上传
评论
收藏 4.46MB DOC 举报
温馨提示
试读
44页
基于Vue的体育汇App设计与实现.doc
资源推荐
资源详情
资源评论
目 录
摘 要......................................................................................................................I
Abstract.....................................................................................................................II
引 言 .....................................................................................................................1
1 核心技术的理论与分析 .......................................................................................3
1.1 客户端技术 ..................................................................................................3
1.1.1 Vue.js 框架...........................................................................................3
1.1.2 Vue.js 路由管理...................................................................................3
1.1.3 Vuex 状态管理 ....................................................................................3
1.1.4 MVVM 开发模式 ................................................................................4
1.1.5 Vant 组件库 .........................................................................................5
1.2 服务端技术 ..................................................................................................5
1.2.1 Node.js..................................................................................................5
1.2.2 Egg.js 框架...........................................................................................5
1.3 数据库技术 ..................................................................................................6
1.4 本章小结 ......................................................................................................6
2 App 系统分析 ........................................................................................................7
2.1 需求分析 ......................................................................................................7
2.1.1 功能性需求分析 .................................................................................7
2.1.2 非功能性需求分析 .............................................................................8
2.2 用例分析 ......................................................................................................9
2.3 系统工作流程图 ........................................................................................10
2.4 本章小结 ....................................................................................................10
3 App 系统设计 ......................................................................................................11
3.1 体系结构设计 ............................................................................................11
3.2 数据库设计 ................................................................................................12
3.3 App 功能模块设计 .....................................................................................16
3.3.1 登录模块设计 ...................................................................................16
3.3.2 赛事相关模块设计 ...........................................................................16
3.3.3 日志模块设计 ...................................................................................18
3.3.4 论坛模块设计 ...................................................................................19
3.3.5 购物优选模块设计 ...........................................................................20
3.4 本章小结 ....................................................................................................20
4 App 功能模块具体编程实现 ..............................................................................21
4.1 项目开发环境 ............................................................................................21
4.2 项目目录结构 ............................................................................................21
4.3 登录模块详细编码设计 ............................................................................22
4.4 赛事模块详细编码设计 ............................................................................23
4.4.1 赛事新闻功能具体实现 ...................................................................24
4.4.2 赛事赛程安排功能具体实现 ...........................................................25
4.4.3 球队技术统计功能具体实现 ...........................................................26
4.4.4 球员技术统计功能具体实现 ...........................................................27
4.5 日志模块详细编码设计 ............................................................................29
4.6 论坛模块详细编码设计 ............................................................................29
4.7 购物优选详细编码设计 ............................................................................31
4.8 本章小结 ....................................................................................................32
5 App 测试与验证 ..................................................................................................33
5.1 测试环境 ....................................................................................................33
5.2 测试目的 ....................................................................................................33
5.3 测试内容 ....................................................................................................33
5.3.1 登录模块测试 ...................................................................................33
5.3.2 论坛模块测试 ...................................................................................34
5.3.3 购物优选模块测试 ...........................................................................34
5.3.4 压力测试 ...........................................................................................35
5.4 本章小结 ....................................................................................................36
结 论 ...................................................................................................................37
致 谢 ...................................................................................................................38
参考文献 .................................................................................................................39
沈阳城市学院毕业设计(论文)
I
摘 要
基于体育产业的日益增长以及智能手机、互联网快速发展的今天,国
内各种类型的体育 App 呈现出“爆棚”的增长趋势。相对于传统媒体的资
讯报道和赛事直播都可以通过 App 了解体育新闻动向。目前体育 App 主要
以体育资讯、体育赛事直播为主,产品功能略显单一,然而将赛事资讯传
达、获取热门赛事技术统计、球迷论坛以及便捷购买体育装备等功能融合
在一个整体中将会是主流的发展方向。本课题基于以上背景从前端设计到
项目功能实现阐述了 App 的开发过程。
本课题主要针对足球运动为设计方向,根据大众对体育 App 的使用需
求设计一套界面清晰、功能具有多样性的一款体育 App 应用。App 的编码
设计过程,后端采用具有事件驱动、非阻塞 I/O、单进程等特点的 Node.js
和 Egg.js 应用开发框架为服务端进行架构,通过 ORM 框架 Sequelize 操作
MySql 数据库对数据进行读取存储。前端采用 Vue.js 框架,配合 Vue.js 脚
手架工具 Vue-cli、路由 Vue-router、状态管理 Vuex 进行前端架构代码编写,
完成单页面应用开发,实现了前后端完全分离。前端设计过程使用 Vant 组
件库实现了响应式网页设计,从而能够适应不同型号移动设备的屏幕分辨
率,使用户体验最优化。开发过程中对 App 的功能与产品设计进行需求分
析使功能模块化、独立功能组件化,以增强系统的健壮性,使代码模块层
次分明。
关键词:Vue.js 框架; Node.js;前后端分离; 体育类 App 开发
沈阳城市学院毕业设计(论文)
II
Abstract
Based on the growing sports industry and the rapid development of smart
phones and the Internet today, various types of sports apps in China show an
"explosive" growth trend. Compared with the information report of traditional
media and the live broadcast of games, sports news trends can be understood
through the App. At present, sports apps mainly focus on sports information and
live broadcast of sports events, with slightly single product functions. However,
it will be the mainstream development direction to integrate the functions of
event information transmission, access to technical statistics of popular events,
fan forums and convenient purchase of sports equipment into a whole. Based on
the above background, this project elaborated the development process of App
from front-end design to product function implementation.
This project mainly aims at the design direction of football, and designs a
set of sports App with clear interface and diversified functions according to the
needs of the public for the use of sports App. The application development
framework of Node. js and Egg. js, which are event-driven, non-blocking I/O
and single process, is adopted at the back end of the coding design process of
App to construct the server side. The ORM framework Sequelize is used to
operate MySql database to read and store data. The front-end adopts the Vue. js
framework, and the front-end architecture code is written in cooperation with the
Vue. js scaffold tool Vue-cli, routing Vue-router, and Vuex for state
management. The single-page application development is completed and the
front and rear ends are completely separated. The front-end design process uses
the Vant component library to achieve responsive web design that adapts to the
screen resolution of different mobile devices for optimal user experience. In the
process of development, the requirements of App function and product design
were analyzed to make the function modular and independent function
componentization, so as to enhance the robustness of the system, and the code
modules were hierarchical.
Keywords: Vue. js Framework; Node.js; Fore And Aft End Separation; Sports
App Development
沈阳城市学院毕业设计(论文)
1
引 言
现如今,互联网的飞速发展与智能手机性能的卓越提升使越来越多的
大众步入互联网的新时代。根据第 44 次《中国互联网络发展状况统计报告》
显示,我国网民数量已经达到 8.54 亿,互联网普及率高达 61.2%,较 2018
年增长 1.6 个百分点,并且网民使用智能手机的上网方式居多,上网比例高
达 99.1%
[1]
。从数据统计中可以发现,移动互联网和智能手机在我国已经实
现普及,网民对电脑的使用需求逐渐下降,移动手机在人们的众多上网方
式中占据主导地位。
当前,体育产业已经加入国家战略发展方向之一。伴随着生活的快节
奏、过渡依赖智能电子产品,导致全民身体状况呈下坡状态。为改变当前
状态缓解生活压力,体育运动成为了大众的首选方式。从而体育类“手机
App”渐渐进入到大众的视野当中,体育 App 在应用平台下载量迅速崛起。
目前国内外普遍的体育 App,就是将传统的赛事资讯和相关信息以应用的
形式展现给用户,使用者的功能可选择性较少导致没有用户影响力
[2]
,但较
受用户欢迎的体育 App,例如国内的“虎扑体育”和国外的“ESPN”体育
App,几乎覆盖了世界各地的每一项运动,这些 App 除了提供比赛信息外,
还涵盖了体育社交圈子、个人喜好推送等。所以能够做到既有体育赛事的
资讯报道传达,又有及时的体育评论、球迷圈子、购物平台等内容整体融
合在一起,将会是未来主流的发展方向。在这样背景下设计一款资讯数量
多、更新速度快、可选择性广泛的体育 App 非常具有使用价值。
本项目设计的体育汇 App 可以使用户更加便捷的获取所需的体育信息,
像一些传统的体育需求,如及时获取体育资讯、赛事时间、获取心仪球队
或球员的赛事技术统计等,都可以通过体育汇 App 得到满足。为解决体育
App 界面同质化严重以及功能较为单一等现象
[3]
。App 在设计的过程中增添
了签到获取积分、球迷论坛、球队加油助力、购物等功能,丰富了 App 的
实用性。体育汇 App 除日常使用外,更大的优点在于可以让球迷发布自己
的动态,建立用户之间双向互动交流模式。通过签到累计积分的形式增强
了用户与功能模块的互动性,从而提高了用户对 App 的使用频率。同时 App
剩余43页未读,继续阅读
资源评论
南抖北快东卫
- 粉丝: 70
- 资源: 5584
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功