一个基于 SpringBoot + Vue 的在线考试系统

大家好,我是 Java陈序员。

今天,给大家介绍一个前后端分离的在线考试系统。

关注微信公众号:【Java陈序员】,获取开源项目分享、AI副业分享、超200本经典计算机电子书籍等。

项目介绍

spring-boot-online-exam ------ 一个基于 Spring Boot + Vue 实现的在线考试系统,支持学生、教师、管理员三种角色。

功能特色:

  • 支持单选题、多选题、判断题
  • 支持学生、教师、管理员三种角色
    • 学生:参加考试和查看我的考试
    • 教师:学生的所有权限 + 创建/编辑题目 + 创建/编辑考试
    • 管理员:教师的所有权限 + 管理用户

技术栈:

  • 前后端分离,前段组件化,方便二次开发
  • 前端:Vue + AntDesign
  • 后端:SpringBoot + JPA + Swagger2 + JWT

功能图示

考试卡片

问题管理

考试管理

我的考试

快速上手

1、下载代码

bash 复制代码
git clone https://github.com/19920625lsg/spring-boot-online-exam.git

2、初始化数据库

  • 创建数据库
sql 复制代码
CREATE DATABASE `exam` DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_bin;
  • 执行脚本 spring-boot-online-exam/doc/sql/exam.sql,初始化数据

3、启动后端

  • 将项目以 Maven 项目的形式导入到 IDEA
  • 修改配置文件 spring-boot-online-exam/backend/src/main/resources/application.yml 中的数据库连接信息
yaml 复制代码
spring:
  datasource:
    driver-class-name: com.mysql.cj.jdbc.Driver
    username: root
    password: aA111111
    url: jdbc:mysql://localhost:3306/exam?characterEncoding=utf-8&useSSL=false&serverTimezone=Asia/Shanghai
  • 执行主启动类 lsgwr.exam.ExamApplication,启动后端服务

  • 浏览器访问 Swagger 文档地址 http://localhost:9527/swagger-ui.html 说明启动成功

4、启动前端

  • 进入前端代码
bash 复制代码
cd spring-boot-online-exam/frontend/exam/
  • 安装依赖
bash 复制代码
npm install
  • 启动前端
bash 复制代码
npm run serve

5、浏览器访问 http://localhost:8000

默认登录用户名:admin、teacher、student,密码:admin123

arduino 复制代码
项目地址:https://github.com/lsgwr/spring-boot-online-exam

最后

推荐的开源项目已经收录到 GitHub 项目,欢迎 Star:

bash 复制代码
https://github.com/chenyl8848/great-open-source-project

或者访问网站,进行在线浏览:

bash 复制代码
https://chencoding.top:8090/#/

大家的点赞、收藏和评论都是对作者的支持,如文章对你有帮助还请点赞转发支持下,谢谢!


相关推荐
A黄俊辉A3 天前
uniapp webview中实现 app和内嵌的H5双向通信
vue.js·json
小白男神4 天前
MySQL进阶学习四(存储过程、游标、触发器)
mysql
这个DBA有点耶4 天前
MVCC深入:Read View、版本链与快照读——InnoDB并发控制的内核
数据库·mysql·架构
vipxieliang4 天前
ValidX 在 DDD 领域驱动设计中的实践
java·spring boot
honkun64 天前
vue 表格组件 vxe-table 配置 ajax 请求自动加载数据与表单查询
vue.js·vxe-table
kybs19914 天前
全球灾害数据分析可视化 毕业设计-附源码66794
vue.js·spring boot·mysql·安全·django·c#·asp.net
雪芽蓝域zzs4 天前
第26章:ECharts 自定义主题 + 页面一键切换主题(深色 / 浅色两套)
vue.js·echars
雪芽蓝域zzs4 天前
第22章:ECharts 图表联动(多图表交互联动)
vue.js·echars
程序猿_极客4 天前
【免费】分享一套优质的基于SSM的校园失物招领系统的设计与实现,源码+文档+视频详解(讲解)
java·mysql·ssm·课程设计·失物招领系统
daols884 天前
vue 表格组件 vxe-table 实现虚拟滚动与无需滚动加载
vue.js·vxe-table