ITSource 分享 第2期【在线考试系统】

项目介绍

本期给大家介绍一个 基于 SpringBoot 和 Vue 的前后端分离系统，代码写的很规范，具有学习和参考意义。

一 业务介绍

考试系统顾名思义，有出题方，有做题方。本系统也是如此，把出题方角色叫做老师，做题放角色叫做学生。不同账号可授予不同的角色。

本系统分为以下几个模块:

1.考试卡片

考试卡片可以理解为是一份试卷，里面是一些试题的集合，当我们以 学生身份登录时，可以看到考试卡片和我的考试

随便点击一个考试卡片，即可开始答题

答题完毕，可以点击 交卷，即可跳转到我的考试页面

2.问题管理

问题管理可以理解为是一个试题库，可以在此出题。此模块需要老师的角色才可看到，我们可以以 老师的账号登录。

点击新建，可以创建一个新问题

点击下一步，可以继续完善问题类型：题型，归类，难度

设置选项：

点击完成，即可看到问题被添加

点击详情可以查看题目信息：

3.考试管理

考试管理，可以管理考试卡片，可以理解为创建试卷的地方

选择分数和题目：

点击完成，即可创建一张试卷：

4.我的考试

可以查看自己参加过的考试，以及答题详情

点击 查看开始详情，即可看到自己的答卷详情和对错

二 技术介绍

1.技术栈

• 后端: SpringBoo2.x +JPA
• 数据库 : MYSQL5.x OR MYSQL8.x,
• 前端: VUE + ElementUI

2.代码介绍

• 项目结构

image.png

三 Quick Start

1. 环境准备

• MYSQL 5.7
• JDK1.8
• Maven 3
• IDEA
• Node 16+

以上环境需要准备好, 在自己的本地搭建好,方可进行下面步骤

2. 下载源码

• Github:

 https://github.com/panji-tech/spring-boot-online-exam

• 百度云:

链接: https://pan.baidu.com/s/1RiVFa5qt-wLa3MW2lnYrlw?pwd=5ya8 提取码: 5ya8

• 蓝奏云:

 https://itguang.lanzoub.com/b02x6t03e 密码: 6fjx

3. 后端部署

• Step1: 下载源码
• Step2: IDEA 打开项目
• Step3: 安装 Maven 依赖
• Step4: 配置检查

• 数据库配置: 数据库初始化语句: doc 文件夹下

• 

创建数据库并初始化: 打开 navicat 创建数据库：exam。（注意默认数据库连接账号密码均为 root） 将SQL 语句复制到 navicat 等Mysql 可视化工具中，执行即可看到表结构以及初始化数据：

• Step4: 启动后端项目

Idea 运行后端项目,看到以下信息,表示运行成功

其中打开

http://127.0.0.1:9527/swagger-ui.html

即可看到该项目的API 文档

至此，候选项目部署完成。

4. 前端部署

打开终端,进入 前端项目目录:

image.png

• Step1: 安装npm依赖

终端进入该目录后，安装npm 依赖： npm install

• Step2: 启动前端项目

npm run serve 看到如下信息表示部署成功

如果遇到报错： Error: error:0308010C:digital envelope routines::unsupported

点击任何一个连接,即可跳转浏览器打开.

image.png

登录:

• 学生： student admin123
• 老师： teacher admin123

---

---

关注 ITSource 公众号 ! 获取更多学习资源呀 !

---

原创作者: u_13866611 转载于: https://blog.51cto.com/u_13866611/11556792