オンライン教育システム|オンライン教育システム|Springboot+Vue+Nodejs をベースとしたオンライン教育プラットフォーム システム

著者ホームページ:プログラミングコンパス

著者について: Java 分野の高品質クリエイター、CSDN ブログ エキスパート、CSDN コンテンツ パートナー、Nuggets の招待著者、Alibaba Cloud ブログ エキスパート、51CTO 招待著者、長年のアーキテクト設計経験、Tencent 教室の常駐講師

主な内容:Javaプロジェクト、Pythonプロジェクト、フロントエンドプロジェクト、人工知能とビッグデータ、卒業設計、履歴書テンプレート、教材、面接質問バンク、技術相互支援

お気に入り、いいね、迷わず作者フォローすると良いです

記事の最後にあるソースコードを入手してください 

序文:

卒業制作は数年間の大学生活の成果の発表として大きな比重を占め、とても大切な節目でもあります!しかし、この専攻には入りたくない、あるいは他の希望を持っている人が多く、戦いに備えて公的試験や大学院入学試験を受験して軍隊に入隊する人が多く、結果的には時間がほとんどありません。最終的なデザインと論文の準備をします。近年、家庭教師の卒業プロジェクトに対する要求はますます高くなっていると言えます。その多くは企業開発の一般的な困難を超えており、ほとんどの学生は前に進むことをためらい、ためらっています。このコラムでは、お客様向けに開発されたBS作品を参考アイデアとしてご紹介します。必要に応じて、関連プロジェクトの開発、LWドキュメントの作成、プロジェクトの説明、リモートデバッグなどの一連のサービスも提供します。 、などお選びいただけます!

品番:BS-GX-060

目次

1. 環境紹介

2. プロジェクト紹介

2.1 開発の背景

2.2 需要分析

        2.3 機能紹介

三、システム表示

4番目、コアコード表示

5. 関連作品の展示


1. 環境紹介

ロケール: Java: jdk1.8

データベース: MySQL: mysql5.7

アプリケーションサーバー: Tomcat: tomcat8.5.31

開発ツール: IDEA または eclipse

バックグラウンド開発: springiboot+mybatis

フロントエンド開発: vue+elementUI

2. プロジェクト紹介

2.1 開発の背景

コンピュータ応用技術の急速な発展に伴い、コンピュータ応用技術は徐々に教育分野に浸透し、特に感染症の特別な時期においては、教育概念、教育モデル、指導方法に変化をもたらしました。生徒間の対面コミュニケーションのため、教師は生徒の問題にタイムリーに答えることができず、教師は毎年異なる生徒と向き合い、多くの質問が繰り返し行われ、前のクラスで生徒が提起した質問は膨大である次のクラスの生徒たち。しかし、インターネット上の情報は複雑すぎて、生徒の問題を的を絞って解決することができないため、このプロジェクトは、「コンピュータネットワーク」コース知識ベースの構築を通じて、教師の永続的な指導プロセスの問題と解決策をシステムに記録します。問題のキーワードを検索して解決策を見つけます。これにより、毎年繰り返される生徒の質問に教師が答える必要がなくなり、教師の負担が大幅に軽減されるとともに、生徒がいつでもどこでも問題の解決策を得ることができるため、生徒の学習意欲も向上します。

「コンピューター ネットワーク」コース教育システムは、springboot フレームワークと Vue フレームワークを使用して開発されています。springboot フレームワークはシンプルで、構成が簡素化され、開発サイクルが短縮され、最適化により多くの時間を費やすことができます。同時に、springboot は Maven の最小限の構成を提供しますパフォーマンス監視、アプリケーションの健全性などの視覚的な相関監視機能、フロントエンドの Vue フレームワークでは、Vue を使用すると Web サイトがよりシンプルで美しくなり、パフォーマンスが大幅に向上し、Web サイトがよりスムーズに実行されます。

2.2 需要分析

市場調査とユーザー訪問、および分類と分析によると、今回設計および実装された《コンピューターネットワーク》コース教育ウェブサイトには3つのタイプのユーザーが存在することがわかっています。1つは学生ユーザー、もう1つは学生ユーザーです。教師ユーザー、もう 1 つはプラットフォーム 基本的なシステム情報を管理するために提供される管理者アカウントです。これら 3 種類のユーザーには、異なる役割と操作機能権限があり、以下にユースケース図の形式で示します。

学生ユーザーのユースケース図を以下の図 1 に示します。

 

学生ユーザーの使用例の説明: 学生ユーザーは、登録してログインした後、主にオンラインで発表情報を閲覧したり、自分のコース情報、章情報、オンライン学習コースを閲覧したり、ニュース情報やブログ記事を閲覧したり、個人情報を管理したりすることができます。センターやコレクションの情報を閲覧できると同時に、経歴管理室でブログを公開したり、自分の質問や先生の回答情報などを管理したりすることができます。

教師ユーザーの操作ユースケース図を以下の図 2 に示します。

教師ユーザーの使用例図の説明: 教師は、<<コンピューター ネットワーク>> コース指導 Web サイトにログインし、主な責任は、コース管理、章管理、質問管理、解答管理、コース リソースなどの自分のコース情報を管理することです。運営は待ってください。

管理者ユーザーのユースケース図を以下の図 3 に示します。

 

管理者ユーザーのユースケース図の説明: 管理者は、<<コンピューター ネットワーク>> コース指導 Web サイトにログインします。主な操作機能には、ユーザー管理、管理者管理、コース管理、コース章管理、コース リソース管理、ブログ記事管理、およびニュース情報管理やカルーセルマップ管理など

2.3 機能紹介

 <<Computer Network>> コース教育 Web サイト全体の完全な需要分析とアーキテクチャ設計の後、開発および設計された <<Computer Network>> コース教育 Web サイトによって達成される機能目標が、次のように最終的に決定されます。図5。

このトピックで実現する機能については、以下に対応する概要を示します。

学生ユーザー向けの機能説明:

(1) 登録とログイン: 観光客として《コンピュータネットワーク》コース指導ウェブサイトのフロントエンドに入ると、主に情報の閲覧が可能となり、その他のオンライン学習、オンライン質疑応答モジュールの操作は許可されません。会員ユーザーとして登録し、登録時に指定したアカウントに従ってプラットフォームにログインすることによってのみ、プラットフォームに関連する操作を実行することが許可されます。

(2) コースの閲覧:コースのリンクをクリックするとオンラインコース詳細表示ページに入り、コースのブックマークやコメントを付けることができます。

(3) オンライン学習: ユーザーは、コースの章の詳細ページで章の内容情報を表示したり、学習コースのビデオをオンラインで視聴したり、コース関連のリソース ファイルをダウンロードしたりできます。

(4) ニュースの閲覧: プラットフォームは、ユーザーが閲覧して理解できるように、必要に応じてニュースやシステムのお知らせをリリースできます。

(5) ブログ閲覧:学習メモなどのブログ情報をオンラインで公開し、他の人が閲覧することができます。

(6) パーソナルセンター:パーソナルセンターでは、主に基本的な個人情報の管理と個人収集情報の管理が行われます。

(7) オンライン質疑応答:ユーザーはコース内でオンラインで質問することができ、コースに所属する教師がそれを見た上で回答し、ユーザーは教師の回答内容を確認することができます。

教師ユーザー向けの機能説明:

   (1) パーソナルセンター:個人情報やログインパスワードを管理します。

   (2) コース管理: 教師は自分のコース情報を公開および管理できます。

   (3) 章管理: 各コースには複数の章を追加でき、各章にコース リソースと対応する説明ビデオを追加できます。

   (4) コースリソース管理: 教師は、アップロードされたコースリソース情報を管理および操作できます。

   (5) 質問管理:主にフロントエンドユーザーが公開している講座に対して提起した質問を閲覧し、回答することができ、ユーザーはフロントエンド上で回答を確認することができます。

   (6)回答管理:回答した回答の情報を修正・削除することができます。

バックグラウンド管理者の操作機能は次のとおりです。

    (1) ユーザー管理:主に授業指導用サイト《コンピュータネットワーク》に登録されている学生情報、教員情報、プラットフォーム管理者の管理・運用を実現します。

(2) 記事分類管理: 主にシステムブログ分類情報の管理操作を完了します。これは、ユーザーが分類別にブログ情報を閲覧するのに便利です。

    (3) コース管理:管理者は、すべての教師が公開したコース情報を管理できます。

   (3) 章管理: 管理者は、すべての教師が公開したコースの章情報を管理でき、各コースに複数の章を追加し、章にコースリソースと対応する説明ビデオを追加できます。

   (4) コースリソース管理: 管理者は、すべての教師がアップロードしたコースリソース情報を管理および操作できます。

   (5) 質問管理: 主に、コースに関するすべてのフロントエンド ユーザーの質問を確認して回答することができ、ユーザーはフロントエンドで回答を確認できます。

   (6)回答管理:全教員が回答した回答情報の修正・削除が可能です。

   (7)カルーセル画像管理:フロントエンドに表示されるカルーセル画像を管理する。

   (8) ニュース管理: 管理者は、フロントエンド ユーザーが閲覧できるように、関連するニュースや発表情報を公開できます。

 

三、システム表示

ユーザーログイン

 ユーザー登録

 コースの閲覧

 詳細ルート

ニュース閲覧

 

カリキュラムリソース

 

 パーソナルセンターのバックグラウンド管理

管理者のバックグラウンド管理

ユーザー管理

 

ブログカテゴリー管理

 

ブログ管理

 コース管理

 カルーセル管理

 ニュース管理

コースチャプター管理

 

 カリキュラムリソース管理

Q&A管理

 

4番目、コアコード表示

package com.controller;

import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.Calendar;
import java.util.Map;
import java.util.HashMap;
import java.util.Iterator;
import java.util.Date;
import java.util.List;
import javax.servlet.http.HttpServletRequest;

import com.utils.ValidatorUtils;
import org.apache.commons.lang3.StringUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.transaction.annotation.Transactional;
import org.springframework.format.annotation.DateTimeFormat;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.mapper.Wrapper;
import com.annotation.IgnoreAuth;

import com.entity.KechengziyuanEntity;
import com.entity.view.KechengziyuanView;

import com.service.KechengziyuanService;
import com.service.TokenService;
import com.utils.PageUtils;
import com.utils.R;
import com.utils.MD5Util;
import com.utils.MPUtil;
import com.utils.CommonUtil;
import java.io.IOException;
import com.service.StoreupService;
import com.entity.StoreupEntity;

/**
 * 课程资源
 * 后端接口
 * @author 
 * @email 
 * @date 2022-07-23 18:58:54
 */
@RestController
@RequestMapping("/kechengziyuan")
public class KechengziyuanController {
    @Autowired
    private KechengziyuanService kechengziyuanService;

    @Autowired
    private StoreupService storeupService;

    


    /**
     * 后端列表
     */
    @RequestMapping("/page")
    public R page(@RequestParam Map<String, Object> params,KechengziyuanEntity kechengziyuan,
		HttpServletRequest request){
		String tableName = request.getSession().getAttribute("tableName").toString();
		if(tableName.equals("jiaoshi")) {
			kechengziyuan.setJiaoshigonghao((String)request.getSession().getAttribute("username"));
		}
        EntityWrapper<KechengziyuanEntity> ew = new EntityWrapper<KechengziyuanEntity>();
		PageUtils page = kechengziyuanService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, kechengziyuan), params), params));

        return R.ok().put("data", page);
    }
    
    /**
     * 前端列表
     */
	@IgnoreAuth
    @RequestMapping("/list")
    public R list(@RequestParam Map<String, Object> params,KechengziyuanEntity kechengziyuan, 
		HttpServletRequest request){
        EntityWrapper<KechengziyuanEntity> ew = new EntityWrapper<KechengziyuanEntity>();
		PageUtils page = kechengziyuanService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, kechengziyuan), params), params));
        return R.ok().put("data", page);
    }

	/**
     * 列表
     */
    @RequestMapping("/lists")
    public R list( KechengziyuanEntity kechengziyuan){
       	EntityWrapper<KechengziyuanEntity> ew = new EntityWrapper<KechengziyuanEntity>();
      	ew.allEq(MPUtil.allEQMapPre( kechengziyuan, "kechengziyuan")); 
        return R.ok().put("data", kechengziyuanService.selectListView(ew));
    }

	 /**
     * 查询
     */
    @RequestMapping("/query")
    public R query(KechengziyuanEntity kechengziyuan){
        EntityWrapper< KechengziyuanEntity> ew = new EntityWrapper< KechengziyuanEntity>();
 		ew.allEq(MPUtil.allEQMapPre( kechengziyuan, "kechengziyuan")); 
		KechengziyuanView kechengziyuanView =  kechengziyuanService.selectView(ew);
		return R.ok("查询课程资源成功").put("data", kechengziyuanView);
    }
	
    /**
     * 后端详情
     */
    @RequestMapping("/info/{id}")
    public R info(@PathVariable("id") Long id){
        KechengziyuanEntity kechengziyuan = kechengziyuanService.selectById(id);
        return R.ok().put("data", kechengziyuan);
    }

    /**
     * 前端详情
     */
	@IgnoreAuth
    @RequestMapping("/detail/{id}")
    public R detail(@PathVariable("id") Long id){
        KechengziyuanEntity kechengziyuan = kechengziyuanService.selectById(id);
        return R.ok().put("data", kechengziyuan);
    }
    



    /**
     * 后端保存
     */
    @RequestMapping("/save")
    public R save(@RequestBody KechengziyuanEntity kechengziyuan, HttpServletRequest request){
    	kechengziyuan.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
    	//ValidatorUtils.validateEntity(kechengziyuan);
        kechengziyuanService.insert(kechengziyuan);
        return R.ok();
    }
    
    /**
     * 前端保存
     */
    @RequestMapping("/add")
    public R add(@RequestBody KechengziyuanEntity kechengziyuan, HttpServletRequest request){
    	kechengziyuan.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
    	//ValidatorUtils.validateEntity(kechengziyuan);
        kechengziyuanService.insert(kechengziyuan);
        return R.ok();
    }

    /**
     * 修改
     */
    @RequestMapping("/update")
    @Transactional
    public R update(@RequestBody KechengziyuanEntity kechengziyuan, HttpServletRequest request){
        //ValidatorUtils.validateEntity(kechengziyuan);
        kechengziyuanService.updateById(kechengziyuan);//全部更新
        return R.ok();
    }
    

    /**
     * 删除
     */
    @RequestMapping("/delete")
    public R delete(@RequestBody Long[] ids){
        kechengziyuanService.deleteBatchIds(Arrays.asList(ids));
        return R.ok();
    }
    
    /**
     * 提醒接口
     */
	@RequestMapping("/remind/{columnName}/{type}")
	public R remindCount(@PathVariable("columnName") String columnName, HttpServletRequest request, 
						 @PathVariable("type") String type,@RequestParam Map<String, Object> map) {
		map.put("column", columnName);
		map.put("type", type);
		
		if(type.equals("2")) {
			SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
			Calendar c = Calendar.getInstance();
			Date remindStartDate = null;
			Date remindEndDate = null;
			if(map.get("remindstart")!=null) {
				Integer remindStart = Integer.parseInt(map.get("remindstart").toString());
				c.setTime(new Date()); 
				c.add(Calendar.DAY_OF_MONTH,remindStart);
				remindStartDate = c.getTime();
				map.put("remindstart", sdf.format(remindStartDate));
			}
			if(map.get("remindend")!=null) {
				Integer remindEnd = Integer.parseInt(map.get("remindend").toString());
				c.setTime(new Date());
				c.add(Calendar.DAY_OF_MONTH,remindEnd);
				remindEndDate = c.getTime();
				map.put("remindend", sdf.format(remindEndDate));
			}
		}
		
		Wrapper<KechengziyuanEntity> wrapper = new EntityWrapper<KechengziyuanEntity>();
		if(map.get("remindstart")!=null) {
			wrapper.ge(columnName, map.get("remindstart"));
		}
		if(map.get("remindend")!=null) {
			wrapper.le(columnName, map.get("remindend"));
		}

		String tableName = request.getSession().getAttribute("tableName").toString();
		if(tableName.equals("jiaoshi")) {
			wrapper.eq("jiaoshigonghao", (String)request.getSession().getAttribute("username"));
		}

		int count = kechengziyuanService.selectCount(wrapper);
		return R.ok().put("count", count);
	}
	







}
package com.controller;

import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.Calendar;
import java.util.Map;
import java.util.HashMap;
import java.util.Iterator;
import java.util.Date;
import java.util.List;
import javax.servlet.http.HttpServletRequest;

import com.utils.ValidatorUtils;
import org.apache.commons.lang3.StringUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.transaction.annotation.Transactional;
import org.springframework.format.annotation.DateTimeFormat;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.mapper.Wrapper;
import com.annotation.IgnoreAuth;

import com.entity.NewsEntity;
import com.entity.view.NewsView;

import com.service.NewsService;
import com.service.TokenService;
import com.utils.PageUtils;
import com.utils.R;
import com.utils.MD5Util;
import com.utils.MPUtil;
import com.utils.CommonUtil;
import java.io.IOException;

/**
 * 高校资讯
 * 后端接口
 * @author 
 * @email 
 * @date 2022-07-23 18:58:54
 */
@RestController
@RequestMapping("/news")
public class NewsController {
    @Autowired
    private NewsService newsService;


    


    /**
     * 后端列表
     */
    @RequestMapping("/page")
    public R page(@RequestParam Map<String, Object> params,NewsEntity news,
		HttpServletRequest request){
        EntityWrapper<NewsEntity> ew = new EntityWrapper<NewsEntity>();
		PageUtils page = newsService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, news), params), params));

        return R.ok().put("data", page);
    }
    
    /**
     * 前端列表
     */
	@IgnoreAuth
    @RequestMapping("/list")
    public R list(@RequestParam Map<String, Object> params,NewsEntity news, 
		HttpServletRequest request){
        EntityWrapper<NewsEntity> ew = new EntityWrapper<NewsEntity>();
		PageUtils page = newsService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, news), params), params));
        return R.ok().put("data", page);
    }

	/**
     * 列表
     */
    @RequestMapping("/lists")
    public R list( NewsEntity news){
       	EntityWrapper<NewsEntity> ew = new EntityWrapper<NewsEntity>();
      	ew.allEq(MPUtil.allEQMapPre( news, "news")); 
        return R.ok().put("data", newsService.selectListView(ew));
    }

	 /**
     * 查询
     */
    @RequestMapping("/query")
    public R query(NewsEntity news){
        EntityWrapper< NewsEntity> ew = new EntityWrapper< NewsEntity>();
 		ew.allEq(MPUtil.allEQMapPre( news, "news")); 
		NewsView newsView =  newsService.selectView(ew);
		return R.ok("查询高校资讯成功").put("data", newsView);
    }
	
    /**
     * 后端详情
     */
    @RequestMapping("/info/{id}")
    public R info(@PathVariable("id") Long id){
        NewsEntity news = newsService.selectById(id);
        return R.ok().put("data", news);
    }

    /**
     * 前端详情
     */
	@IgnoreAuth
    @RequestMapping("/detail/{id}")
    public R detail(@PathVariable("id") Long id){
        NewsEntity news = newsService.selectById(id);
        return R.ok().put("data", news);
    }
    



    /**
     * 后端保存
     */
    @RequestMapping("/save")
    public R save(@RequestBody NewsEntity news, HttpServletRequest request){
    	news.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
    	//ValidatorUtils.validateEntity(news);
        newsService.insert(news);
        return R.ok();
    }
    
    /**
     * 前端保存
     */
    @RequestMapping("/add")
    public R add(@RequestBody NewsEntity news, HttpServletRequest request){
    	news.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
    	//ValidatorUtils.validateEntity(news);
        newsService.insert(news);
        return R.ok();
    }

    /**
     * 修改
     */
    @RequestMapping("/update")
    @Transactional
    public R update(@RequestBody NewsEntity news, HttpServletRequest request){
        //ValidatorUtils.validateEntity(news);
        newsService.updateById(news);//全部更新
        return R.ok();
    }
    

    /**
     * 删除
     */
    @RequestMapping("/delete")
    public R delete(@RequestBody Long[] ids){
        newsService.deleteBatchIds(Arrays.asList(ids));
        return R.ok();
    }
    
    /**
     * 提醒接口
     */
	@RequestMapping("/remind/{columnName}/{type}")
	public R remindCount(@PathVariable("columnName") String columnName, HttpServletRequest request, 
						 @PathVariable("type") String type,@RequestParam Map<String, Object> map) {
		map.put("column", columnName);
		map.put("type", type);
		
		if(type.equals("2")) {
			SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
			Calendar c = Calendar.getInstance();
			Date remindStartDate = null;
			Date remindEndDate = null;
			if(map.get("remindstart")!=null) {
				Integer remindStart = Integer.parseInt(map.get("remindstart").toString());
				c.setTime(new Date()); 
				c.add(Calendar.DAY_OF_MONTH,remindStart);
				remindStartDate = c.getTime();
				map.put("remindstart", sdf.format(remindStartDate));
			}
			if(map.get("remindend")!=null) {
				Integer remindEnd = Integer.parseInt(map.get("remindend").toString());
				c.setTime(new Date());
				c.add(Calendar.DAY_OF_MONTH,remindEnd);
				remindEndDate = c.getTime();
				map.put("remindend", sdf.format(remindEndDate));
			}
		}
		
		Wrapper<NewsEntity> wrapper = new EntityWrapper<NewsEntity>();
		if(map.get("remindstart")!=null) {
			wrapper.ge(columnName, map.get("remindstart"));
		}
		if(map.get("remindend")!=null) {
			wrapper.le(columnName, map.get("remindend"));
		}


		int count = newsService.selectCount(wrapper);
		return R.ok().put("count", count);
	}
	







}

5. 関連作品の展示

Java開発、Python開発、PHP開発、C#開発等の関連言語をベースとした各種卒業設計業務

Nodejs、Vueなどのフロントエンド技術をベースに開発・設計したフロントエンド卒業設計作品

WeChatアプレットおよびAndroid APPアプリケーション開発に基づく関連作品

51個のシングルチップマイコンをベースとした組み込みIoTの開発と応用

さまざまなアルゴリズムに基づくAIインテリジェントアプリケーション

ビッグデータを活用した各種データ管理・レコメンドシステム

最先端の技術、ワンストップサービス、丁寧なアフターサービスでお悩みを解決します

 

 

おすすめ

転載: blog.csdn.net/whirlwind526/article/details/131371131