基于PHP+Amaze+JQuery的学习论坛的设计与实现1.99

摘 要

互联网教育服务是在互联网技术、通信技术、计算机技术不断发展融合的基础之上,人们在对以信息为基础的各种各样应用需求快速增长的激励之下,在现在社会信息化的水平日益提高前提之下,迅速发展起来的一种全新大众服务方式。
笔者拟设计一个学习论坛网站满足大众这一需求。针对网站布局的需要,在不同大小显示屏幕实现网站自适应调整的问题,前端的框架选用前端开源框架Amaze_UI,让系统能自动流畅地响应 PC 端和 WAP 端。采用了PHP开发框架大大简化了开发过程,也使得系统更易于维护和拓展;结合了jQuery 前端语言使得系统实现了无刷新加载,很好地优化了用户体验和交互。本论坛网站在PC 端和WAP端都做了较为完全的显示测试以及后台功能的测试。所得结果显示本论坛网站在PC端和WAP端都能流畅地跳转界面自动适应界面布局,后台管理功能正常有序,达到了预期效果。

关键词:学习论坛网站;PHP;JQuery

Abstract
Internet education service is in the Internet technology, communication technology, the development of computer technology integration, on the basis of people on various applications of based on the information demand under the rapid growth of incentive, in what is now the social informatization level is increasing day by day under the premise, rapidly developed a new service mode of the masses.
The author intends to design a study BBS site to meet the demand of the masses. Aiming at the need of layout in different size display screen to achieve website adaptive adjustment problems, the front-end Amaze_UI selects the front open source framework, the framework of the system can automatically smoothly respond to PC and WAP side. Using a PHP framework greatly simplifies the development process, also makes the system easier to maintain and expand. Combined with jQuery front language makes no refresh load of system implementation, and optimize the user experience and well interaction. This BBS site on the PC and WAP end all did more completely show the test function tests as well as the background. The results show that the BBS site can smoothly in PC and WAP jump automatically adapt to the interface layout, background management functions of normal and orderly, the desired effect.
Key Words: Study BBS website; PHP; JQuery;

目 录

摘 要 I
Abstract II

  1. 前言 1
    1.1 研究背景 1
    1.2 研究意义 1
    2.系统定义 2
    2.1可行性分析 2
    2.1.1 技术可行性 2
    2.1.2 经济可行性 2
    2.1.3 法律可行性 3
    2.2 需求分析 3
    2.2.1 功能需求 3
    2.2.2性能需求 5
  2. 系统设计 6
    3.1 系统结构图 6
    3.2 系统功能模块设计 6
    3.2.1 用户功能模块设计 6
    3.2.2 管理功能模块设计 7
    3.3 逻辑结构设计 8
    3.4 系统架构设计 10
    3.5 系统 E-R 图 11
    3.6 数据库表设计 11
    3.6.1 表汇总 11
    3.6.2 表详情 12
    4.系统实现与测试 17
    4.1 网站功能实现 17
    4.1.1网站前端功能实现 17
    4.1.2 网站后台功能实现 24
    4.2 测试实例 26
    5.结语 28
    参考文献 30
    致 谢 31

基于PHP+Amaze+JQuery搭建本学习论坛网站

1. 前言

1.1 研究背景
随着互联快速的发展,中国的在线教育亦得到了快速的发展,其中在线教育就包含了一个学习社区或学习论坛。它是一个用于交流和讨论学习技巧、心得或成就的网络交流平台。现如今,越来越多人依赖着互联网来解决生活上、工作上和学习上遇到的问题。正是响应国家的“互联网+”的思路,利用互联网思维来解决学习浏览的问题才是符合这个时代背景的。
随着我国教育行业的发展,人们的教育水平得到了极大的提高,人们对学习新知识和新技术产生了较大的需求,他们迫切希望寻找一个学习平台来解决学习交流的需要。现如今,越来越多人通过互联网教育平台来学习新知识,这种新的学习交流方式已经成为人们普遍接受的新方式。本毕业设计是学习论坛的设计与实现,以解决人们的迫切互联网学习的新需求。
1.2 研究意义
本毕业设计是基于PHP+Amaze+JQuery等技术实现的学习论坛网站。它是利用搭建在Linux操作系统上Apache来做服务器,通过PHP的技术来实现对网站页面的渲染和对数据的处理;本学习论坛网站的前端主要使用了Amaze框架,便于快速开发具有跨平台适应性的前端网页。
通过对本学习论坛网站的设计与实现,我掌握了一些新的知识与技术;并且,本设计可以作为互联网学习交流平台的解决方案,为促使更多的人们参与到互联网学习中来,鼓励更多的人们积极参与学习讨论,努力营造一种愉悦的互联网学习氛围和致力于打造有秩序稳定的交流平台。

2.系统分析

2.1可行性分析
2.1.1 技术可行性
本学习论坛网站是一个基于Apache+PHP+Amaze+JQuery实现的面向学习者或学生用户的学习论坛网站。它所依据的技术和应用都是现行比较流行的、成熟的、易上手且开源的技术,而且这些技术也相当优秀和稳。下面分别讨论:
(1) Apache
Apache是一个开源网页服务器软件;它性能高效、安全可靠且稳定性高。它是一个简单且容易操作的服务器软件,很简单即可完成配置,并且支持很多应用和模块的扩展。本学习论坛网站是基于Apache服务器软件和PHP处理页面来实现的。
(2) PHP
PHP,全称:Page Hypertext Preprocesso,是一种开源的通用计算机脚本语言,尤其适用于网络开发并可嵌入 HTML 中使用[1]。它适合快速开发各种类型的网站或者平台。各大中小互联网企业都比较有用到它来开发自己的产品或者网站系统。它的执行效率较高,代码运行较快,所以这里采用PHP作为后端的开发语言。本项目托管平台主要使用是ThinkPHP。ThinkPHP是一个开源的基于PHP的开发框架,它可以有效提高本项目的开发效率,方便开发者在后期的维护工作。
(3) Amaze
Amaze是个开源的前端开发框架。Amaze是基于HTML、CSS、JAVASCRIPT开发的响应式前端框架。它是国内比较流行的前端框架,它非常有效,它帮助开发者更加有效率的完成网站项目的前端开发且网站界面美观大方不失大雅。本学习论坛网站的前端大部分是基于Amaze开发出来的,它是简单、美观和容易操作的,提高用户的操作体验,且容易上手操作。
(4)JQuery
JQuery是一个相对好用的 Javascript 框架。提高了 JavaScript 的编写效率。JQuery封装了很多DOM操作的函数,让网站前端的DOM操作变得简单;JQuery也封装了一些网络请求的函数,让网页动态获取数据变得简单、快捷和可异步实现。
(5)CSS
CSS 的是层叠样式表。是网页结构与样式分离的产物。它的作用就是为了控制网站 页面的外观,呈现出更加美观的效果。同时,分离 CSS,后期网页的维护变得更加方便[2]。
综上所述,本学习论坛在技术上是完全可行的。
2.1.2 经济可行性
经济可行性分析是要考虑开发本系统需要花费的总共成本和所支持的硬件设备, 确保本人能负担开发的经济成本。本学习论坛网站帮助人们更加简单方便地获取知识,节省了时间精力,提高了学习的效率。所以说本学习论坛类型的这类网站对当今社会的网民是相当重要的。
就开发经济成本而言,本系统是用笔者自己的MacBook开发的,硬件成本为零。开发系统需要的所有软件在网上皆可免费下载,软件成本也为零。而域名与服务器则是用腾讯云平台,服务器成本亦为零。故此开发本学习论坛系统需要花费的总成本为零。需要的只是笔者的时间成本。
综上分析,开发基于PHP+Amaze+jQuery的学习论坛网站在经济上是可行的。
2.1.3 法律可行性
本学习论坛网站完全属于自主开发,基本按照软件的开发流程来进行,此系统采用的技术完全属于开源技术,若一些功能与其它课程学习网站相似,纯属设计参考与功能的借鉴改进,无完全复制使用,在法律方面并无任何侵权行为。
本学习论坛网站依赖和所需支持的框架或函数库都是遵循开源协议的,在准守开源协议的基础上使用这些框架和函数库是符合法律的。
综上分析,开发基于PHP+Amaze+jQuery的学习论坛网站在法律方面是完全可行的。
2.2 需求分析
2.2.1 功能需求
深入了解求学者用户的需求后画出系统的流程图,就开始分析满足符合流程的系 统的各大功能点。我们可以先分析前端用户和后台管理员各自需要的功能,再进一步总结分析本系统所需要的功能。
2.2.1.1前端用户用例分析
根据前期的对系统的调研与分析,我们得出本学习论坛用户的用例分析:
① 论坛首页
② 论坛版块页面
③ 帖子搜索结果页
④ 帖子页面(包含回复)
⑤ 我的文章
⑥ 我的回复
⑦ 站内信箱
⑧ 个人资料
⑨ 发表帖子(富文本编辑器的实现)
⑩ 修改帖子
⑪ 课程中心

在这里插入图片描述

图2.1 本学习论坛的用户的用例分析图

2.2.1.2 后台管理员用例分析
根据前期的对系统的调研与分析,我们得出本学习论坛管理员的用例分析:
① 用户管理
② 内容管理(文章,版块和图片)
③ 课程管理
④ 日志管理
⑤ 角色与权限

在这里插入图片描述

图2.2 本学习论坛网站的管理员的用例分析图

2.2.2性能需求
本学习论坛网站是典型的浏览器/服务器结构设计的;所以以下分两个方面对本学习论坛网站的性能进行分析。
(1)服务器性能
本学习论坛网站以Linux操作系统作服务器主机、以Apache作为服务器软件、以MySQL开源软件做数据库和以PHP作为服务器后端脚本。此架构是轻量级的并且是开源免费的,更加有利于我们快速开发本学习论坛系统。本架构是轻量级的、高效的是性能优越的。
(2)浏览器性能
随着互联网时代的发展,电脑的更新换代,绝大多数的个人电脑的性能越来越优越了。我们绝大多数电脑的浏览器性能相当优越。绝大多数浏览器都支持Html5、CSS3和JQuery等浏览器新特性。

3. 系统设计

3.1 系统结构图
根据本学习论坛前期的需求分析,深入研究与分析之后得出本学习论坛的系统结构图。本学习论坛涉及多个重要的模块和功能如图3-1所示,由登录与注册、前台内容模块、个人中心模块、内容管理、用户管理、课程管理、角色与权限和日志管理等组成一个完整的网站系统结构。本学习论坛的主要模块和功能如下图3.1所示:
在这里插入图片描述

图3.1 系统结构图

3.2 系统功能模块设计
本学习论坛的系统功能模块设计,是根据上面的网站结构图所列出夫人模块功能结构来设计的,也是对以上网站结构图的进一步说明与解释。
3.2.1 用户功能模块设计
(1)登录与注册模块
用户可以通过此模块来注册本学习论坛网站的用户账号,也可以通过本模块来登录本学习论坛网站和可灵活选择安全退出本学习论坛网站。
(2)课程展示中心
本课程中心展示模块系统而又祥细的向用户展示了课程学时、目录和讲师等方面的信息。用户可以根据自己兴趣喜好选择要学习的课程或教程,并可以清楚明了地看到学习了哪些课程和未学习那些课程。
(3)论坛版块
本学习论坛包含了论坛版块模块,可以灵活的将论坛里的内容、方向、话题或类型进行有序的分类。论坛版块可以方便用户快速有效地找到自己需要的有用信息,并将学习论坛网站上的文章帖子进行了有序分类。
(4)内容模块
内容模块包含了文章帖子、回复和课程。本学习论坛网站的内容分为了文章帖子、回复和课程三种形式的内容;用户可以通过论坛版块来浏览文章帖子;用户也可以通过课程中心来浏览和学习课程内容;所有的文章帖子和课程内容,用户都可以对其进行评论和相应的查看其所包含的评论列表。
(5)个人中心
用户的个人中心模块包含了用户的文章帖子、回复、信箱、个人资料和好友等功能。用户可以通过我的文章来进行文章的删除、修改和查询等操作;用户可以通过我的回复来进行回复的删除和查询等操作;用户可以通过我的信箱来查看一些系统通知和与其他用户的信箱聊天;用户可以通过个人资料来修改自己的一些个人信息;用户也可以通过我的好友来查看自己的好友,也可以主动发起与好友的信箱聊天。
3.2.2 管理功能模块设计
(1)内容管理模块
本内容管理模块分为文章管理、版块管理和图片管理等;管理员可以通过文章管理来进行查询和删除文章;管理员可以通过版块管理来进行版块的创建、删除、查询和修改;管理员也可以通过图片管理来查询本学习论坛网站来查询用户上传的图片。
(2)用户管理模块
用户管理模块是专门用来管理本学习论坛网站的注册用户账号和管理员账号的模块;其中包含了用户的姓名、昵称、角色组、省份、电话和学校等相关信息;管理员可以通过用户管理模块来进行用户搜索来进一步快速获取用户的相关信息。
(3)课程管理模块
课程管理模块是专门用于管理本学习论坛网站的课程中心的课程、课程的章节和相关课程信息的管理的模块;管理员可以通过本功能模块来对课程进行的创建、修改、删除和查询等操作;管理员亦可以对课程添加或者设置课程章节;此处的章节是是属于内容管理部分的文章。
(4)角色与权限模块
角色与权限模块在本系统里又叫系统设置;本模块分为节点管理、角色管理和角色权限三个重要部分;管理员可以通过节点管理来进行对节点的新增、查询、删除和修改等操作;管理员也可以通过角色管理来进行对角色的新增、查询、删除和修改等操作;管理员亦可通过角色权限来控制用户拥有哪些节点和那些版块的访问权限和操作权限。
(5)日志管理模块
本日志管理模块较为简单,主要是对本学习论坛网站系统的部分重要操作和系统关键位置的代码或者运行数据的监控或记录;方便管理员统计用户在本学习论坛网站的行为数据,也及时对系统敏感或重要数据的监控,方便尽快发现系统漏洞或者问题。
3.3 逻辑结构设计
(1)微信扫码登录流程
① 用户访问平台的登录页面;
② 点击微信登录,跳转微信登录页面;
③ 用户微信扫二维码;
④ 用户在微信端确认登录;
⑤ 成功登录通知到我方服务器;
⑥ 登录成功。
微信扫码登录流程图,如图3.2所示:
在这里插入图片描述

图3.2 微信扫码登录的流程图

(2)短信验证码流程
① 用户输入手机号码点击获取验证码;
② 服务器收到用户请求,并请求第三方平台发送短信;
③ 用户收到验证码短信,并填写验证短信验证码;
④ 服务器收到提交的验证码,并进行核对;
⑤ 验证成功。
短信验证码流程图,如图3.3所示:

在这里插入图片描述

图3.3 短信验证码验证流程图

3.4 系统架构设计
本学习论坛网站使用的是MMVC四层次结构的设计模式。其分为Module、Model、View和Controller四个层次。其设计模式便于快速地、结构清晰地完成整个系统的开发过程。
Module为网站架构的功能模块层次,可以将功能根据分类和用途来区分不同的模块,本项目托管系统分为两个模块,前台模块(Home)和后台管理模块(Admin)。
Model为网站架构的数据库模型层次,是用于处理数据库读写和操作数据的数据模型,它只作数据库操作、验证字段和检查数据格式等操作。
View为网站架构的视图层次,是网站页面的具体视图,但不包含数据只是简单的页面。视图是通过控制器的页面渲染再与数据进行结合。
Controller为网站架构的控制器层次,是用于处理用户的操作和一些逻辑的处理,负责调用模型层来存储数据和调用视图层来渲染页面输出最终的结果页面。
3.5 系统 E-R 图
本学习论坛网站的系统E-R图如图3.4所示:
在这里插入图片描述

图3.4 本学习论坛网站的数据库ER图

3.6 数据库表设计
数据库设计是指根据用户的需求和系统的功能,设计和建立数据库过程[3]。
3.6.1 表汇总
数据库所有数据表的汇总,如表3.1所示:

表3.1 数据库表汇总表
表名 表介绍
area 版块表
article 文章帖子表
article_type 文章类型表
follow 关注表
func 节点表
log 日志表
member 成员表
msg 消息表
reply 回复表
role 角色表
role_area 角色版块表
role_func 角色节点表

3.6.2 表详情
(1) 版块表,用于记录版块信息,如表3.2所示:

表3.2 area表
列名 数据类型 长度/精度 空/非空 约束条件 备注
id Int 11 Not Null Pk 板块ID
status Int 4 Not Null 板块状态
visible Int 4 Not Null 板块可视态
name Varchar 45 Not Null 板块名称
pic Int 11 Not Null 板块图片
short Text 60000 Not Null 板块简介
update_time datetime 6 Not Null 板块更新时
create_time datetime 6 Not Null 板块创建时

(2) 文章表,用于记录文章信息,如表3.3所示:

表3.3 article表
列名 数据类型 长度/精度 空/非空 约束条件 备注
id int 11 Not Null Pk 文章ID
status int 4 Not Null 文章状态
title Varchar 255 Not Null 文章标题
content Mediumtext Not Null 文章内容
member_id int 11 Not Null 文章会员ID
article_type_id int 11 Not Null 文章类型ID
update_time datetime 6 Not Null 文章更新时
create_time datetime 6 Not Null 文章创建时
area_id int 11 Not Null 文章板块ID
like_c int 4 Not Null 文章点赞数
read_c int 4 Not Null 文章阅读量
give_c int 4 Not Null 文章打赏数

(3) 文章类型表,用于记录文章类型信息,如表3.4所示:

表3.4 article_type表
列名 数据类型 长度/精度 约束条件 备注
id Int 11 Pk 文章类型ID
status Int 4 文章类型状态
name Varchar 45 文章类型名称
update_time datetime 6 文章类型更新时
area_id Int 11 文章类型文章ID

(4) 关注表,用于用户关注信息,如表3.5所示:

表3.5 follow表
列名 数据类型 长度/精度 空/非空 约束条件 备注
id Int 11 Not Null Pk 关注ID
follow_member_id Int 11 Not Null 关注者ID
followed_member_id int 11 Not Null 已关注者ID
update_time datetime 6 Not Null 关注更新时间

(5) 系统节点表,用于记录系统节点信息,如表3.6所示:

表3.6 func表
列名 数据类型 长度/精度 空/非空 约束条件 备注
id Int 11 Not Null Pk 节点ID
status Int 4 Not Null 节点状态
name Varchar 64 Not Null 节点名称
update_time datetime 6 Not Null 函数更新时
create_time datetime 6 Not Null 函数创建时
module Int 11 Not Null 模块名称
controller Varchar 64 Not Null 控制器名称
action Varchar 64 Not Null 操作名称

(6) 日志表,用于系统日志信息,如表3.7所示:

表3.7 log表
列名 数据类型 长度/精度 空/非空 约束条件 备注
id Int 11 Not Null Pk 日志ID
status Int 4 Not Null 日志状态
type Varchar 45 Not Null 日志类型
member_id int 11 Not Null 日志会员ID
create_time datetime 6 Not Null 日志
action varchar 255 Not Null 日志
ip Varchar 45 Not Null 日志
other text 60000 Not Null 日志

(7) 成员表,用于记录成员信息,如表3.8所示:

表3.8 member表
列名 数据类型 长度/精度 空/非空 约束条件 备注
id Int 11 Not Null Pk 成员ID
status Int 4 Not Null 成员状态
name Varchar 45 Not Null 成员名称
update_time datetime 6 Not Null 成员更新时
create_time datetime 6 Not Null 成员创建时
true_name Varchar 45 Not Null 成员真实名称
short Varchar 512 Not Null 成员简介
pw Varchar 45 Not Null 成员密码
phone Varchar 45 Not Null 成员电话
email Varchar 45 Not Null 成员电邮
province Varchar 45 Not Null 成员省份
city Varchar 45 Not Null 成员城市
school Varchar 45 Not Null 成员学院
role_id Int 11 Not Null 成员角色组
head_src Varchar 128 Null 成员头像
sex Int 11 Not Null 成员性别
year Int 5 Not Null 成员毕业年份
open_id Varchar 255 Null 成员昵称
union_id Varchar 255 Null 成员系统ID
wx_info Text 60000 Null 成员微信信息
wx_name Varchar 45 Null 成员微信名称
weixin_id Varchar 45 Not Null 成员微信ID

(8) 消息表,用于记录用户消息信息,如表3.9所示:

表3.9 msg表
列名 数据类型 长度/精度 空/非空 约束条件 备注
id Int 11 Not Null Pk 消息ID
status Int 4 Not Null 消息状态
content Text 60000 Not Null 消息名称
update_time datetime 6 Not Null 消息更新时
create_time datetime 6 Not Null 消息创建时
to_member_id Int 11 Not Null 消息收件人
from_member_id Int 11 Not Null 消息寄件人
Is_read Int 4 Not Null 消息已读

(9) 文章评论表,用于记录文章评论信息,如表3.10所示:

表3.10 reply表
列名 数据类型 长度/精度 空/非空 约束条件 备注
id Int 11 Not Null Pk 回复ID
status Int 4 Not Null 回复状态
content Text 60000 Not Null 回复内容
update_time datetime 6 Not Null 回复更新时
create_time datetime 6 Not Null 回复创建时
member_id Int 11 Not Null 回复会员ID
article_id Int 11 Not Null 回复文章ID
reply_id Int 11 Not Null 回复者ID

(10) 用户角色表,用于记录用户角色信息,如表3.11所示:

表3.11 role表
列名 数据类型 长度/精度 空/非空 约束条件 备注
id Int 11 Not Null Pk 角色ID
status Int 4 Not Null 角色状态
name Varchar 45 Not Null 角色名称
update_time datetime 6 Not Null 角色更新时
create_time datetime 6 Not Null 角色创建时

(11) 角色菜单表,用于角色拥有的菜单信息,如表3.12所示:

表3.12 role_area表
列名 数据类型 长度/精度 空/非空 约束条件 备注
id Int 11 Not Null Pk 角色版块ID
role_id Int 11 Not Null Pk 角色ID
area _id Int 11 Not Null Pk 版块ID

(12) 角色节点表,用于记录角色拥有的节点信息,如表3.13所示:

表3.13 role_func表
列名 数据类型 长度/精度 空/非空 约束条件 备注
id Int 11 Not Null Pk 角色节点ID
role_id Int 11 Not Null Pk 角色ID
func _id Int 11 Not Null Pk 节点ID

4.系统实现与测试

4.1 网站功能实现
系统实现是软件开发工作的一个阶段。它是将系统的设计变成可实际运行的系统的过程[4]。本学习论坛网站基于Amaze、JQuery和ThinkPHP等开源框架实现的。这样更有利于我进行后期维护并更加便于后期的扩展。
本毕业设计的前端通过引入Amaze的样式和JS库,来实现网页的界面和基本组件,使得界面美观且容易操作。有些页面的DOM操作是通过引入JQuery库来简化DOM操作的流程步骤。网站的后端则是通过ThinkPHP这个开源框架,通过控制器接受到操作请求,然后根据请求的需求来处理逻辑流程,然后调用模型来操作处理数据,最后在通过视图来渲染输出页面结果。
4.1.1网站前端功能实现
(1)本学习论坛网站首页。如图4.1、图4.2和图4.3所示:

在这里插入图片描述

图4.1 本学习论坛首页的轮播图

图4.1为本学习论坛首页的上半部分。其中包含了网站的bar(顶部功能栏,它包含了几个跳转链接、文章搜索、个人头像和信箱等信息或功能)、广告轮播图和一些个人信息展示区。此部件页面的DOM操作是通过引入JQuery库来简化DOM操作的流程步骤。

在这里插入图片描述

图4.2 本学习论坛首页的版块列表

图4.2为本学习论坛首页的版块列表。其会展示本学习论坛所有的文章版块和文章版块的一些信息(如:点赞数量和阅读数量等)。此版块是通过导入Amaze的样式库来简化开发代码。

在这里插入图片描述

图4.3 本学习论坛首页的最新文章列表

图4.3为本学习论坛首页的最新文章列表。它会展示20条用户发表的最新的文章,其包含了文章的标题、发表文章的时间和作者等信息。此版块是通过导入Amaze的样式库来简化开发代码。
(2)本学习论坛的版块页面。如图4.4所示:

在这里插入图片描述

图4.4 论坛版块页面

图4.4为本学习论坛的版块页面。它包含了论坛版块的封面、名称、简介和版块文章列表等内容。文章按照时间顺序排列,也可以按照其他方式排列顺序,文章列表同样展示了文章标题等信息。在版块页面相应地可以在版块内发帖来发表文章。不同板块切换页面的DOM操作是通过引入JQuery库来简化DOM操作的流程步骤,此版块页面是通过使用部分Amaze的样式库来简化开发代码。
(3)本学习论坛的文章页面。如图4.5和图4.6所示:

在这里插入图片描述

图4.5 文章页面的文章部分

图4.5为本学习论坛的文章页面的文章部分。它会展示文章的标题、类型、发表版块和内容等信息;同时它也有详细的展示了文章作者的相关信息,如头像和昵称等信息。

在这里插入图片描述

图4.6 文章页面的评论部分

图4.6为本学习论坛的文章页面的评论部分。其中包含了评论列表和评论回复功能;评论列表里的评论详细地展示了用户信息(包含了用户头像和昵称等)、评论内容和评论时间等信息;这里也可以通过点击用户的头像来跳转到用户的个人主页。
(4)本学习论坛的个人主页。如图4.7所示:
在这里插入图片描述

图4.7 个人主页

 图4.7为本学习论坛的个人主页页面。其中包含个人的一些信息,如昵称、所属省份、性别、文章数、点赞数和粉丝数等;其中也包含了该个人所发表的所有可见文章。右栏的悬停与焦点聚焦的DOM操作是通过引入JQuery库来简化DOM操作的流程步骤的。
(5)本学习论坛的个人中心。如图4.8、图4.9、图4.10、图4.11和图4.12所示:

在这里插入图片描述

图4.8 个人中心我的文章

在这里插入图片描述

图4.9 个人中心我的回复

在这里插入图片描述

图4.10 个人中心我的信箱

在这里插入图片描述

图4.11 个人中心我的资料
在这里插入图片描述

图4.12 个人中心我的好友

图4.8、图4.9、图4.10、图4.11和图4.12为本学习论坛的个人中心的相关页面;其中包含了我的文章、我的回复、我的信箱、我的资料和我的好友等相关个人页面。
(6)本学习论坛的课程中心。如图4.13所示:

在这里插入图片描述

图4.13 课程中心页面

 图4.13为本学习论坛的课程中心。顾名思义,课程中心就是聚集了本学习论坛所有的课程或者教程等相关信息的汇总的页面;其中包含了各种课程和各式教程,也包含了课程所需的学时、课程学习人数、课程推荐指数和作者或者讲师等相关信息。

4.1.2 网站后台功能实现
网站的后端则是通过ThinkPHP这个开源框架,通过控制器接受到操作请求,然后根据请求的需求来处理逻辑流程,然后调用模型来操作处理数据,最后在通过视图来渲染输出页面结果。
(1)论坛后台的用户管理。如图4.14所示:

在这里插入图片描述

图4.14 用户管理

 图4.14为本学习论坛的用户管理。其中显示包含了每个用户的昵称、姓名、省份、电话和所属大学等信息。

(2)论坛后台的文章管理。如图4.15所示:

在这里插入图片描述

图4.15 文章管理

 图4.15为本学习论坛的文章管理。其中显示包含了文章的标题、发布者、发布版块等信息;管理员也拥有查询文章和删除文章的操作和权限。

(3)论坛后台的版块管理。如图4.16所示:

在这里插入图片描述

图4.16 版块管理

 图4.16为本学习论坛的版块管理。其中显示包含了版块名称、简介和是否显示等信息;同时管理员拥有新增、查询、修改和删除版块的操作和权限。
(4)论坛后台的角色管理。如图4.17所示:

在这里插入图片描述

图4.17 角色管理

4.2 测试实例
(1)发表文章测试
发表文章测试是对本学习论坛的发帖操作的测试。首先打开发帖页面,然后输入文章内容和标题并选择好文章类型,如图4.18所示。本学习论坛可以成功发表出文章,显示效果如图4.19所示。

在这里插入图片描述

图4.18 发表文章
在这里插入图片描述

图4.19 发表成功的文章

(2)回复文章测试
回复文章测试是对发表的文章内容进行评论回复的测试。我们选择一篇文章,并对其内容进行评论回复,如图4.20所示。进过测试,评论回复没有我问题。其评论回复的效果如图4.21所示。

在这里插入图片描述

图4.20 测试回复文章

在这里插入图片描述

图4.21 回复成功的结果

5.结语

本毕业设计是基于PHP+Amaze+JQuery学习论坛网站的设计与实现。通过分析需求来设计并且实现了这个学习论坛网站。用户可以通过在论坛里浏览帖子,发布帖子能迅速的与很多人在网上进行技术性的沟通和学习[5]。本毕业设计实现了一个学习论坛网站,较为实际地解决了互联网上人们对学习论坛的需求,解决了“去哪学习”的问题,并且为广大网民提供了一个交流讨论的学习平台。
本毕业设计是参考并借鉴了目前较为流行的一些互联网学习平台和互联网教育平台。其中,本毕业设计是有机地将学习教育和交流讨论这两大需求进行了结合,为用户提供一个可以一边学习一边交流的平台。
本毕业设计目前处于较为初级的开发阶段,有很多问题需要后期结合用户的实际需求来进行针对性解决问题。比如,用户对视频形式的教育的偏好多一点,还是对图文形式的教程偏好多一点。目前,本毕业设计还未完成对用户倾向数据的收集和处理。这是接下来的需要完善的不足之处。

参考文献

[1] 张泽娜. JavaScript 实战 [M]. 北京:清华大学出版社,2014.
[2] 温谦. CSS 设计彻底研究[M].北京.人民邮电出版社.2008.
[3] 吕琨. JavaScript 网页特效实例大全 [M]. 北京:清华大学出版社,2013.
[4] 高洛峰. 细说 PHP [M]. 北京:电子工业出版社,2012.
[5] 论坛百度百科词条[EB/OL]. http://baike.baidu.com/item/%E8%AE%BA%E5%9D%9B,2017.

致 谢

在本文完成之际,谨向我的导师教授致以衷心的感谢,本论文是在他的精心指导和关怀下完成的,从论文的选题、方案设计,到论文的撰写和修改,都倾注了副教授的心血和汗水,在学习期间,他的言传身教将使我终生受益,他认真严谨的治学态度、豁达宽广的胸怀、平易近人的处事风格是我一生的楷模,值此提交论文之时,在此向副教授表达衷心的感谢!

  • 26
    点赞
  • 24
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值