程序员的知识教程库

网站首页 > 教程分享 正文

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

henian88 2024-08-14 18:20:40 教程分享 28 ℃ 0 评论

项目介绍

本期给大家介绍一个 基于 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. 下载源码

  • 百度云:

链接: 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. 前端部署

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

  • Step1: 安装npm依赖

终端进入该目录后,安装npm 依赖: npm install

  • Step2: 启动前端项目

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

如果遇到报错: Error: error:0308010C:digital envelope routines::unsupported 可以检查你的 node 版本,是否高于 17. 可以参考这边博客解决: https://blog.csdn.net/m0_65933139/article/details/130690790

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

登录:

学生: student admin123

老师: teacher admin123



私信或者评论我,免费获取更多编程资源呀!还可以帮你指导部署哦!


本文暂时没有评论,来添加一个吧(●'◡'●)

欢迎 发表评论:

最近发表
标签列表