SpringBoot開源線上考試系統!解決我的燃眉之急
前言
最近看到了一個考試系統,感覺做的挺不錯,並且也比較成熟,所以我就簡單玩了一下。另外,考試系統應用場景還挺多的,不論是對於在校大學生還是已經工作的小夥伴,並且,類似的私活也有很多。
線上考試系統後臺管理主頁
下面我就把這個專案分享給小夥伴們,非常值得學習,拿來即用!
為了一步一步演示,讓小夥伴們都能成功部署/執行專案, Guide 哥自己本地搭建了專案環境,並將專案成功跑了起來,並使用了其基本的功能。
照著我的步驟,新手也能成功把專案跑起來!
如果你“感動”的話,點個贊/在看,就是對我最大的支援!
另外,以下內容不涉及程式碼分析,整體程式碼結構比較清晰,熟悉了基本功能之後會很容易看明白。
介紹
uexam 是一款前後端分離的線上考試系統。這款線上考試系統,不光支援 web 端,同時還支援微信小程式端。
uexam 介面設計美觀,程式碼整體結構清晰,表設計比較規範。
uexam 後端基於 Spring Boot 2.0+MySQL/PostgreSQL+Redis+MyBatis,前端基於 Vue,採用前端後端分離開發!
另外,這個專案提供了 MySQL 和 PostgreSQL 兩種不同的資料庫版本,下面我以 PostgreSQL 資料庫版本的來演示(建議大家使用和體驗 PostgreSQL 版本)。
專案地址:
軟體架構
軟體架構圖
使用效果
樣式以及操作體驗都是非常不錯的,這也是我推薦這個專案很重要的一個原因。
管理端
新增學科
在建立題目之前,你需要首要建立學科。這裡我們建立的學科是程式設計,年級是三年級。
新增題目
可以看到這裡可以新增多種題型: 單選題、多選題、判斷題、填空題、簡答題。
我們以單選題為例,新增題目介面如下。
新增成功之後,題目列表就會出現我們剛剛新增的題目。
新增試卷
有了學科和題目之後才能新增試卷。
新增試卷
新增成功之後,試卷列表就會出現我們剛剛新增的試卷。
試卷建立成功
新增學生
注意:這裡的學生要和我們前面建立的學科對應的年級對應上。
新增學生
學生端
使用我們剛剛建立的學生賬號登入,你會發現主頁多了一個試卷。這個試卷就是我們剛剛在管理端建立的。
學生端-主頁
試卷答題介面如下。
學生端-試卷
啟動
後端
我們這裡以 PostgreSQL 資料庫版本來演示。
安裝 PostgreSQL
這裡我們使用 Docker 下載最近版的 PostgreSQL 映象 ,預設大家已經安裝了 Docker。
$dockerpullpostgres
檢視 PostgreSQL 映象:
-
$dockerimages|greppostgres
-
postgreslatest62473370e7ee2weeksago314MB
執行 PostgreSQL:
$dockerrun-d-p5432:5432--namepostgresql-ePOSTGRES_PASSWORD=123456postgres
安裝 Redis
這裡我們使用 Docker 下載最近版的 Redis 映象 ,預設大家已經安裝了 Docker。
$dockerpullredis
檢視 Redis 映象:
-
$dockerimages|grepredis
執行 Redis:
$dockerrun-itd--nameredis-test-p6379:6379redis
建立資料庫並執行資料庫指令碼
首先建立一個名字叫做xzs的資料庫,然後執行相應的資料庫指令碼即可(資料庫指令碼在uexam/source/xzs/sql目錄下。)。
配置檔案修改
使用 IntelliJ IDEA 開啟uexam/source/xzs(後臺程式碼),修改application-dev.yml,將 postgesql/mysql、redis 的服務地址改為自己本地的。
啟動專案
直接執行XzsApplication即可。
啟動成功後,開啟下面的連結即可跳轉到對應的端:
- 學生系統地址:http://localhost:8000/student
- 管理端地址:http://localhost:8000/admin
注意:這種方式,前端雖然也啟動了,也能訪問,不過是內嵌在後端專案中。如果如果我們需要前後端分離的話,需要單獨執行前端專案
前端
小程式端的就不演示了,我這裡只演示一下 web 端的。
web 端程式碼在uexam/source/vue下,我們需要首先進入這個目錄,然後分別對xzs-admin(管理端) 和xzs-student(學生端)執行下面兩個命令。
1.下載相關依賴
$npminstall
2.啟動專案
$npmrunserve
啟動完成之後,開啟下面的連結即可跳轉到對應的端:
- 學生系統地址:http://localhost:8001
- 管理端地址:http://localhost:8002