摘要：二十一世纪，互联网技术飞速发展。十几年前的网站使用简单的html+css开发，而现在，前端工作人员使用框架和各种插件配合各种技术做出令人赏心悦目的网页界面。毫无疑问，网站的迅猛发展让前端行业持续火热。而根源在于，互联网时代的人们需要交互，和近在咫尺的人交互，和远在天涯的人交互。人类社会从来没有什么时候像今天这样对交互的需求如此之大。东半球发生的事情很快可以传到西半球，亚洲的人们在为欧洲的灾难祈福。Web技术使我们知道全球各地的事情，我们会在中国对美国发生的事情心心念念，NBA便是其中之一。

NBA联盟自1946年创立，到如今运营了大半个世纪，已经跻身于世界五百强之列。若无庞大的球迷观众喜爱，则其不可能长盛不衰。因此做一个球迷喜爱的NBA新闻网站就显得十分必要了。

NBA新闻网站是一个具有登录、注册、浏览、评论等功能的网站系统。用户进入网站以后可以在不同板块内浏览新闻，如果需要与其他用户交流，或是对某个新闻发表评论，则必须登录。

NBA新闻网站项目制作内容包括了前端和后台两个部分。前端页面由vue框架进行组件化开发，后台采用wamp集成环境进行开发。页面间的跳转由vue-router实现，页面间的参数传递由vuex实现，前端与后台的交互由axios实现。

关键词：NBA  新闻  wamp  Vue.js

目录

摘要

Abstract

1. 绪论-1

1.1 课题研究背景-1

1.2 课题研究目的-2

1.3 课题研究意义-2

2. 开发环境、软件及技术的介绍-3

2.1 开发环境的介绍-3

2.1.1 wamp集成环境-3

2.1.2 vue-cli脚手架-3

2.2 开发软件的介绍-3

2.2.1 Visual Code的介绍-3

2.2.2 Photoshop的介绍-4

2.3 开发技术的介绍-4

2.3.1 vue.js简介-4

2.3.2 HTML5、CSS3、JavaScript简介-4

2.3.3 php+MySQL+apache+window简介-5

3. 网站的规划与设计-6

3.1 网站的规划-6

3.1.1 网站的定位-6

3.1.2 网站的目标-6

3.2 网站的设计-6

3.2.1 风格设计-6

3.2.2 布局设计-6

3.2.3 功能设计-7

4. 数据库的设计与创建-9

4.1 数据库规划-9

4.1.1需求分析-9

4.1.2 E-R图-9

4.2 数据库搭建-10

4.3 数据表的创建-11

5. 网站的开发与功能的实现-14

5.1 布局的设计-14

5.2 用户功能的设计-15

5.2.1 登录功能-15

5.2.2 注册功能-16

5.2.3 评论功能-17

5.3 管理功能的设计-17

5.3.1 新闻发布功能-18

5.3.2 视频发布功能-19

5.3.3 新闻管理功能-20

5.3.4 视频管理功能-21

5.3.5 评论管理功能-22

5.3.6 用户管理功能-23

5.4 前后台交互-24

5.5 数据库的连接-25

5.6 axios请求和跨组件通信-25

5.6.1 页面加载时的axios请求-25

5.6.2 表单提交时的axios请求-27

5.6.3 跨组件通信-28

5.7 功能的实现-30

5.7.1 注册功能的实现-30

5.7.2 登录功能的实现-31

5.7.3 个人信息修改功能-31

5.7.4 评论功能的实现-31

5.7.5 新闻发布功能的实现-31

5.7.6 视频发布功能的实现-32

5.7.7 新闻管理功能的实现-32

5.7.8 用户管理功能的实现-32

5.8 打包项目-32

6. 工程伦理-34

7. 总结与思考-35

参考文献-36

致谢-37

附录-38