項(xiàng)目介紹

這是一個(gè)采用前后端分離開發(fā)的項(xiàng)目，前端采用 Vue 開發(fā)、后端采用 SpringBoot + Mybatis 開發(fā)。

項(xiàng)目部署

1. 將 studentms.sql 導(dǎo)入數(shù)據(jù)庫，參考下文數(shù)據(jù)庫配置

2. 運(yùn)行 student_client_localhost 前端

3. 運(yùn)行后端

• 方法1：配置 student_server 后端的 yml 文件 ，以及 port 為 10086。
• 方法2：直接運(yùn)行 java -jar student-server.jar 文件，但是必須保證數(shù)據(jù)庫中 root 賬號(hào)的密碼是 123

項(xiàng)目展示

1、登陸界面

2、admin 主界面

3、動(dòng)態(tài)搜索框與表格展示

4、學(xué)生端首頁展示

5、教師端成績搜索與編輯

前端部分

1、項(xiàng)目運(yùn)行

由于涉及大量的 ES6/7 等新屬性，node 需要 6.0 以上版本

git clone [email protected]:ruanjiancheng/StudentManageSystem.git

cd /StudentManageSystem/student_client

npm install

npm run serve

2、技術(shù)棧

• Vuex
• Router
• Axios
• Element ui
• sessionStorage

3、項(xiàng)目介紹

采用 vue 2.0 開發(fā)，通過調(diào)用后端提供的數(shù)據(jù)接口實(shí)現(xiàn)數(shù)據(jù)的動(dòng)態(tài)渲染。項(xiàng)目默認(rèn)端口號(hào) 8080

• 使用監(jiān)視器，得益于 Mybatis 強(qiáng)大的動(dòng)態(tài) SQL 功能，實(shí)現(xiàn)高性能動(dòng)態(tài)搜索功能
• 使用 router 配置路由，實(shí)現(xiàn)不同用戶類型導(dǎo)航欄的動(dòng)態(tài)渲染
• 使用 axios 異步加載后端數(shù)據(jù)
• 使用 element ui 實(shí)現(xiàn)表單的前端校驗(yàn)功能
• 使用 sessionStorage 實(shí)現(xiàn)登錄攔截
• 分別實(shí)現(xiàn)了基于前端和后端的數(shù)據(jù)分頁功能

4、系統(tǒng)功能

1、admin

• 實(shí)現(xiàn)對(duì)教師，學(xué)生，課程的 CRUD
• 實(shí)現(xiàn)對(duì)教師業(yè)務(wù)以及學(xué)生業(yè)務(wù)的全方位控制

2、teacher

• 實(shí)現(xiàn)查詢我開設(shè)的課程，以及選擇我課程的學(xué)生信息
• 對(duì)學(xué)生成績的登陸

3、student

• 實(shí)現(xiàn)選課退課的功能
• 實(shí)現(xiàn)成績查詢的功能

后端部分

1、項(xiàng)目運(yùn)行

JDK 版本需要 17.0.2

git clone [email protected]:ruanjiancheng/StudentManageSystem.git

cd /StudentManageSystem/student_server

# 必須保證 root 賬號(hào)的密碼是 123，否則無法連接數(shù)據(jù)
# 也可以自己配置 application.yml 文件的數(shù)據(jù)庫連接，并運(yùn)行
java -jar student_server.jar

2、技術(shù)棧

• Spring boot 2.6.3
• Mybatis
• Maven

3、項(xiàng)目介紹

采用 Restful 風(fēng)格開發(fā)，采用 CrossOrigin 解決跨域問題。采用注解以及 xml 文件配置 SQL 語句，實(shí)現(xiàn)動(dòng)態(tài) SQL 的功能，為前端提供完備的數(shù)據(jù)接口。

由于 vue 項(xiàng)目占用了 8080 Tomcat 默認(rèn)端口，所以指定項(xiàng)目啟動(dòng)在 10086 端口, 可以使用 YAML 文件配置，使用 Maven 項(xiàng)目進(jìn)行打包。

4、系統(tǒng)功能

實(shí)現(xiàn)前端 Ajex 請(qǐng)求的全部數(shù)據(jù)接口，Get 請(qǐng)求通過 RESTful 風(fēng)格開發(fā)。

數(shù)據(jù)庫設(shè)計(jì)

建立數(shù)據(jù)庫：

mysqld -u$Username -p$Password studentms < studentms.sql

項(xiàng)目源碼下載

源碼地址

掃碼下方二維碼，后臺(tái)回復(fù)【1119】即可獲取所有源碼文件