前言

網(wǎng)站建設(shè)哪家好，找創(chuàng)新互聯(lián)公司！專注于網(wǎng)頁設(shè)計(jì)、網(wǎng)站建設(shè)、微信開發(fā)、小程序定制開發(fā)、集團(tuán)企業(yè)網(wǎng)站建設(shè)等服務(wù)項(xiàng)目。為回饋新老客戶創(chuàng)新互聯(lián)還提供了連平免費(fèi)建站歡迎大家使用！

最近看到了一個考試系統(tǒng)，感覺做的挺不錯，并且也比較成熟，所以我就簡單玩了一下。另外，考試系統(tǒng)應(yīng)用場景還挺多的，不論是對于在校大學(xué)生還是已經(jīng)工作的小伙伴，并且，類似的私活也有很多。

在線考試系統(tǒng)后臺管理主頁

下面我就把這個項(xiàng)目分享給小伙伴們，非常值得學(xué)習(xí)，拿來即用!

為了一步一步演示，讓小伙伴們都能成功部署/運(yùn)行項(xiàng)目， Guide 哥自己本地搭建了項(xiàng)目環(huán)境，并將項(xiàng)目成功跑了起來，并使用了其基本的功能。

照著我的步驟，新手也能成功把項(xiàng)目跑起來!

另外，以下內(nèi)容不涉及代碼分析，整體代碼結(jié)構(gòu)比較清晰，熟悉了基本功能之后會很容易看明白。

介紹

uexam 是一款前后端分離的在線考試系統(tǒng)。這款在線考試系統(tǒng)，不光支持 web 端，同時(shí)還支持微信小程序端。

uexam 界面設(shè)計(jì)美觀，代碼整體結(jié)構(gòu)清晰，表設(shè)計(jì)比較規(guī)范。

uexam 后端基于 Spring Boot 2.0+MySQL/PostgreSQL+Redis+MyBatis，前端基于 Vue，采用前端后端分離開發(fā)!

另外，這個項(xiàng)目提供了 MySQL 和 PostgreSQL 兩種不同的數(shù)據(jù)庫版本，下面我以 PostgreSQL 數(shù)據(jù)庫版本的來演示(建議大家使用和體驗(yàn) PostgreSQL 版本)。

項(xiàng)目地址：https://gitee.com/SnailClimb/uexam 。

軟件架構(gòu)

軟件架構(gòu)圖

使用效果

樣式以及操作體驗(yàn)都是非常不錯的，這也是我推薦這個項(xiàng)目很重要的一個原因。

管理端

添加學(xué)科

在創(chuàng)建題目之前，你需要首要創(chuàng)建學(xué)科。這里我們創(chuàng)建的學(xué)科是編程，年級是三年級。

添加學(xué)科

添加題目

可以看到這里可以添加多種題型: 單選題、多選題、判斷題、填空題、簡答題。

添加題目

我們以單選題為例，添加題目界面如下。

添加題目頁面

添加成功之后，題目列表就會出現(xiàn)我們剛剛添加的題目。

題目創(chuàng)建成功

添加試卷

有了學(xué)科和題目之后才能添加試卷。

添加試卷

添加成功之后，試卷列表就會出現(xiàn)我們剛剛添加的試卷。

試卷創(chuàng)建成功

添加學(xué)生

注意：這里的學(xué)生要和我們前面創(chuàng)建的學(xué)科對應(yīng)的年級對應(yīng)上。

添加學(xué)生

學(xué)生端

使用我們剛剛創(chuàng)建的學(xué)生賬號登錄，你會發(fā)現(xiàn)主頁多了一個試卷。這個試卷就是我們剛剛在管理端創(chuàng)建的。

學(xué)生端-主頁

試卷答題界面如下。

學(xué)生端-試卷

啟動

后端

我們這里以 PostgreSQL 數(shù)據(jù)庫版本來演示。

安裝 PostgreSQL

這里我們使用 Docker 下載最近版的 PostgreSQL 鏡像 ，默認(rèn)大家已經(jīng)安裝了 Docker。

 
 
 
 

  
  
  
  
$ docker pull postgres 
 
 
 
 

查看 PostgreSQL 鏡像：

 
 
 
 

  
  
  
  
$ docker images |grep postgrespostgres latest 62473370e7ee 2 weeks ago 314MB 
 
 
 
 

運(yùn)行 PostgreSQL：

 
 
 
 

  
  
  
  
$ docker run -d -p 5432:5432 --name postgresql -e POSTGRES_PASSWORD=123456 postgres 
 
 
 
 

安裝 Redis

這里我們使用 Docker 下載最近版的 Redis 鏡像 ，默認(rèn)大家已經(jīng)安裝了 Docker。

 
 
 
 

  
  
  
  
$ docker pull redis 
 
 
 
 

查看 Redis 鏡像：

 
 
 
 

  
  
  
  
$ docker images |grep redis 
 
 
 
 

運(yùn)行 Redis：

 
 
 
 

  
  
  
  
$ docker run -itd --name redis-test -p 6379:6379 redis 
 
 
 
 

創(chuàng)建數(shù)據(jù)庫并執(zhí)行數(shù)據(jù)庫腳本

首先創(chuàng)建一個名字叫做xzs 的數(shù)據(jù)庫，然后執(zhí)行相應(yīng)的數(shù)據(jù)庫腳本即可(數(shù)據(jù)庫腳本在 uexam/source/xzs/sql 目錄下。)。

配置文件修改

使用 IntelliJ IDEA 打開 uexam/source/xzs (后臺代碼)，修改 application-dev.yml ，將 postgesql/mysql、redis 的服務(wù)地址改為自己本地的。

啟動項(xiàng)目

直接運(yùn)行 XzsApplication 即可。

啟動成功后，打開下面的鏈接即可跳轉(zhuǎn)到對應(yīng)的端：

• 學(xué)生系統(tǒng)地址：http://localhost:8000/student
• 管理端地址：http://localhost:8000/admin

注意：這種方式，前端雖然也啟動了，也能訪問，不過是內(nèi)嵌在后端項(xiàng)目中。如果如果我們需要前后端分離的話，需要單獨(dú)運(yùn)行前端項(xiàng)目

前端

小程序端的就不演示了，我這里只演示一下 web 端的。

web 端代碼在 uexam/source/vue 下，我們需要首先進(jìn)入這個目錄,然后分別對 xzs-admin (管理端) 和 xzs-student (學(xué)生端)執(zhí)行下面兩個命令。

1.下載相關(guān)依賴

 
 
 
 

  
  
  
  
$ npm install 
 
 
 
 

2.啟動項(xiàng)目

 
 
 
 

  
  
  
  
$ npm run serve 
 
 
 
 

啟動完成之后，打開下面的鏈接即可跳轉(zhuǎn)到對應(yīng)的端：

• 學(xué)生系統(tǒng)地址：http://localhost:8001
• 管理端地址：http://localhost:8002

當(dāng)前題目：好一個SpringBoot開源在線考試系統(tǒng)！解決我的燃眉之急
URL分享：http://uogjgqi.cn/article/dhiiieo.html