手撸一个在线学习在线教育小程序

最近有小伙伴找小孟开发了一个在线教育的小程序项目。

一，小程序介绍

微信小程序，它的简称是小程序，其英文名称叫做Mini Program，是一种不需要在手机应用商店里面下载就可以在微信平台当中立即使用的H5轻应用。用户只需要通过微信扫描二维码或者搜索小程序就可以体验小程序功能。
小程序开发技术的最主要目的就是通过最简洁的方式让开发者基于微信平台开发具有原生应用软件的服务。小程序框架系统分为视图层和逻辑层，其中视图层提供自身的视图层独有的描述语言WXML和WXSS，逻辑层框架则基于JavaScript。小程序框架的视图层（View）与逻辑层（APP Service）之间提供了数据传输和事件系统，使得数据和视图保持同步。方便让开发者聚集在数据和逻辑当中。

二，微信开发者工具介绍

微信开发者工作是微信官方提供的针对微信小程序的开发工具，集中了开发，调试，预览，上传等功能。微信团队发布了微信小程序开发者工具、微信小程序开发文档和微信小程序设计指南，全新的开发者工具，集成了开发调试、代码编辑及程序发布等功能，帮助开发者简单和高效地开发微信小程序。启动工具时，开发者需要使用已在后台绑定成功的微信号扫描二维码登录，后续所有的操作都会基于这个微信的帐号，程序调试主要有三大功能区：模拟器、调试工具和小程序操作区：模拟器模拟微信小程序在客户端真实的逻辑表现，对于绝大部分的 API 均能够在模拟器上呈现出正确的状态。调试工具分为 6 大功能模块：Wxml、Console、Sources、Network、Appdata、Storage以及WxmlPannel。微信小程序操作区帮助开发者模拟一些客户端的环境操作。例如当用户从微信小程序中回到聊天窗口，会触发一个微信小程序被设置为后台的api。

三，系统技术栈和功能介绍

系统的后端采用的SpringBoot进行开发，数据库采用Mysql，移动端采用的小程序，Web端前端采用的Vue进行开发。

系统的功能介绍如下所示：

四，系统演示

系统的视频演示如下所示：

手撸一个在线教育、在线学习小程序！酸爽！

五，系统核心代码

@RestController
@RequestMapping("/sys/chapter")
@CrossOrigin
public class ChapterController extends BaseController {
    @Resource
    private ChapterMapper chapterMapper;
    @Resource
    private HomeworkMapper homeworkMapper;
    @Resource
    private VideoMapper videoMapper;

    @RequestMapping(method= RequestMethod.POST,value="/page")
    public Result page(
        Integer pageNum,
        Integer pageSize,
        String coursesId) {
        Result result = new Result();
        Page<Chapter> page = new Page<Chapter>(pageNum, pageSize);
        Chapter parms = new Chapter();
        parms.setCoursesId(coursesId);
        QueryWrapper<Chapter> warpper = new QueryWrapper<Chapter>(parms);

        result.setdata(chapterMapper.selectPage(page, warpper));
        return result;
    }

    @RequestMapping(method= RequestMethod.POST,value="/save")
    public Result save(String chapterTitle,String coursesId) {
        Result result = new Result();
        Chapter chapter = new Chapter();
        chapter.setCoursesId(coursesId);
        chapter.setTitle(chapterTitle);
        if (chapterMapper.selectOne(new QueryWrapper<Chapter>(chapter)) == null) {
            chapterMapper.insert(chapter);
            result.success("添加成功");
        } else {
            result.fail("添加失败，该章节已存在");
        }
        return result;
    }

    @RequestMapping(method= RequestMethod.POST,value="/update")
    public Result update(String chapterTitle,String coursesId,String id) {
        Result result = new Result();
        Chapter haveChapter = new Chapter();
        haveChapter.setId(id);
        haveChapter.setCoursesId(coursesId);
        if (chapterMapper.selectOne(new QueryWrapper<Chapter>(haveChapter)) != null) {
            Chapter chapter = new Chapter();
            chapter.setId(id);
            chapter.setTitle(chapterTitle);
            chapter.setCoursesId(coursesId);
            chapterMapper.update(chapter,new QueryWrapper<Chapter>(haveChapter));
            Homework haveHomework = new Homework();
            haveHomework.setChapter(haveChapter.getTitle());
            haveHomework.setCourseId(coursesId);
            Homework homework = new Homework();
            homework.setChapter(chapter.getTitle());
            homework.setCourseId(coursesId);
            homeworkMapper.update(homework,new QueryWrapper<Homework>(haveHomework));
            result.success("修改成功");
        }
        return result;
    }

    @RequestMapping(method= RequestMethod.POST,value="/remove")
    public Result delete( String id,String chapterTitle,String coursesId) {
        Result result = new Result();
        chapterMapper.deleteById(id);
        Homework homework = new Homework();
        homework.setChapter(chapterTitle);
        homework.setCourseId(coursesId);
        homeworkMapper.delete(new QueryWrapper<Homework>(homework));
        Video video = new Video();
        video.setZhangjie(chapterTitle);
        video.setCoursesId(coursesId);
        videoMapper.delete(new QueryWrapper<Video>(video));
        return result;
    }

    @RequestMapping(method= RequestMethod.POST,value="/getChapter")
    public Result getChpater(@RequestBody String coursesId){
        Result result = new Result();
        Chapter chapter = new Chapter();
        chapter.setCoursesId(coursesId);
        result.setdata(chapterMapper.selectList(new QueryWrapper<Chapter>(chapter)));
        return result;
    }
}

/**
 * 

 *  前端控制器 chrime
 * 
 *
 * @author 小孟vx：jishulearn
 * @since 2022
 */
@RestController
@RequestMapping("/sys/comment")
@CrossOrigin
public class CommentController extends BaseController {
    @Autowired
    @Resource
    private CommentMapper commentMapper;

    @RequestMapping(method= RequestMethod.POST,value="/page")
    public Result page(
            Integer pageNum,
            Integer pageSize) {
        Result result = new Result();
        Page<Comment> page = new Page<Comment>(pageNum, pageSize);
        Comment parms = new Comment();
        QueryWrapper<Comment> warpper = new QueryWrapper<Comment>(parms);

        result.setdata(commentMapper.selectPage(page, warpper));
        return result;
    }

    @RequestMapping(method= RequestMethod.POST,value="/getCommentList")
    public Result list(@RequestBody Comment comment) {
        Result result = new Result();
        List<Comment> commentList = new ArrayList<>();
        commentList = commentMapper.selectList(new QueryWrapper<Comment>(comment));
        result.setdata(commentList);
        return result;
    }

    @RequestMapping(method= RequestMethod.POST,value="/save")
    public Result save(@RequestBody Comment entity) {
        Result result = new Result();
        if (entity.getId() == null) {
            String time= LocalDateTime.now().format(DateTimeFormatter.ofPattern("yyyy-MM-dd HH:mm:ss"));
            entity.setCreateTime(time);
            commentMapper.insert(entity);
            result.success("添加评论成功！");
        } else {
            commentMapper.updateById(entity);
        }
        return result;
    }

    @RequestMapping(method= RequestMethod.DELETE,value="/delete")
    public Result delete( String ids) {
        Result result = new Result();
        List<String> deleteIds = new ArrayList<String>();
        for (String id : ids.split(",")) {
            deleteIds.add(id);
        }
        commentMapper.deleteBatchIds(deleteIds);
        return result;
    }

}

/**
 * 

 *  前端控制器 chrimer
 * 
 *
 * @author 小孟vx：jishulearn
 * @since 2022-06-22
 */
@RestController
@RequestMapping("/sys/course")
@CrossOrigin
public class CourseController extends BaseController {
    @Autowired
    private CourseMapper courseMapper;


    @RequestMapping(method= RequestMethod.POST,value="/page")
    public Result page(
        Integer pageNum,
        Integer pageSize) {
        Result result = new Result();
        Page<Course> page = new Page<Course>(pageNum, pageSize);
        Course parms = new Course();
     QueryWrapper<Course> warpper = new QueryWrapper<Course>(parms);

//        Course course=new Course();
//        warpper.eq("url",course.getId());
//
//
//        List listur = courseMapper.selectList(warpper);
//        System.out.println("lis"+listur);
        result.setdata(courseMapper.selectPage(page, warpper));
        return result;
    }


    @RequestMapping(method= RequestMethod.POST,value="/save")
    public Result save(@RequestBody Course entity) {
        Result result = new Result();
        if (entity.getId() == null) {
            courseMapper.insert(entity);
        } else {
            courseMapper.updateById(entity);
        }
        return result;
    }

    @RequestMapping(method= RequestMethod.DELETE,value="/delete")
    public Result delete( String ids) {
        Result result = new Result();
        List<String> deleteIds = new ArrayList<String>();
        for (String id : ids.split(",")) {
            deleteIds.add(id);
        }
        courseMapper.deleteBatchIds(deleteIds);
        return result;
    }

}

六，数据库核心SQL

SET NAMES utf8mb4;
SET FOREIGN_KEY_CHECKS = 0;

-- ----------------------------
-- Table structure for chapter
-- ----------------------------
DROP TABLE IF EXISTS `chapter`;
CREATE TABLE `chapter`  (
  `id` varchar(150) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL COMMENT '章节ID',
  `courses_id` varchar(150) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL COMMENT '课程ID',
  `title` varchar(50) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL COMMENT '章节名称',
  `sort` int(10) UNSIGNED NULL DEFAULT 0 COMMENT '显示排序',
  `gmt_create` datetime NULL DEFAULT NULL COMMENT '创建时间',
  `gmt_modified` datetime NULL DEFAULT NULL COMMENT '更新时间',
  PRIMARY KEY (`id`) USING BTREE,
  INDEX `idx_course_id`(`courses_id`) USING BTREE
) ENGINE = InnoDB CHARACTER SET = utf8 COLLATE = utf8_general_ci COMMENT = '课程' ROW_FORMAT = COMPACT;

-- ----------------------------
-- Records of chapter
-- ----------------------------
INSERT INTO `chapter` VALUES ('03ccb244cd36837f41928caddbe44be7', '63ee2f927b7cb73801b97519f4a397d0', '第一节', 0, NULL, NULL);
INSERT INTO `chapter` VALUES ('08103771cbd786fd25c08c7e228a1cf7', '7231d9979f93ee3828d2d4293ab43e22', '1-1 java123', 0, NULL, NULL);
INSERT INTO `chapter` VALUES ('1', '1', '第一章', 0, NULL, NULL);
INSERT INTO `chapter` VALUES ('1276061184981819394', '1276061153113497601', '1', 0, '2020-06-25 15:54:29', '2020-06-25 15:54:29');
INSERT INTO `chapter` VALUES ('15', '18', '第一章：Java入门', 1, '2019-01-01 12:27:40', '2019-01-01 12:27:40');
INSERT INTO `chapter` VALUES ('2', '1', '第二章', 0, NULL, NULL);
INSERT INTO `chapter` VALUES ('3', '14', '第二章：CSS', 2, '2019-01-01 12:55:35', '2019-01-01 12:27:40');
INSERT INTO `chapter` VALUES ('32', '18', '第二章：控制台输入和输出', 2, '2019-01-01 12:27:40', '2019-01-01 12:27:40');
INSERT INTO `chapter` VALUES ('44', '18', '第三章：控制流', 3, '2019-01-01 12:27:40', '2019-01-01 12:27:40');
INSERT INTO `chapter` VALUES ('46', '14', '第一章：HTML', 1, '2019-01-01 12:27:40', '2019-01-01 12:55:30');
INSERT INTO `chapter` VALUES ('48', '18', '第四章：类的定义', 4, '2019-01-01 12:27:40', '2019-01-01 12:27:40');
INSERT INTO `chapter` VALUES ('5cd4d656c4f5403a583da2efe3c39be6', '10', '第二章', 0, NULL, NULL);
INSERT INTO `chapter` VALUES ('63', '18', '第五章：数组', 5, '2019-01-01 12:27:40', '2019-01-01 12:27:40');
INSERT INTO `chapter` VALUES ('64', '18', '第六章：继承', 6, '2019-01-01 12:27:40', '2019-01-01 12:27:40');
INSERT INTO `chapter` VALUES ('65', '18', '第七章：多态性和抽象类', 7, '2019-01-01 12:27:40', '2019-01-01 12:27:40');
INSERT INTO `chapter` VALUES ('c236a2a2bc12a25c71c112eec9b2490b', '10', '第一章', 0, NULL, NULL);

-- ----------------------------
-- Table structure for comment
-- ----------------------------
DROP TABLE IF EXISTS `comment`;
CREATE TABLE `comment`  (
  `id` varchar(150) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL,
  `courses_id` varchar(150) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL,
  `user_id` varchar(150) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL,
  `username` varchar(45) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL COMMENT '用户名',
  `content_text` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL COMMENT '评价内容',
  `rate` int(10) UNSIGNED ZEROFILL NOT NULL COMMENT '评分1-5星',
  `like_num` int(10) UNSIGNED ZEROFILL NOT NULL COMMENT '点赞数',
  `create_time` varchar(45) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL COMMENT '评论时间',
  `header_img` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '用户头像url',
  `imgs` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '评论附图时的图片url',
  PRIMARY KEY (`id`) USING BTREE
) ENGINE = InnoDB CHARACTER SET = utf8 COLLATE = utf8_general_ci ROW_FORMAT = Dynamic;

-- ----------------------------
-- Records of comment
-- ----------------------------
INSERT INTO `comment` VALUES ('1', '1', '001ab27d478d04cba95fedd4300cdb00', 'test', 'xxxxxxx', 0000000000, 0000000000, '2020-9-10', NULL, NULL);
INSERT INTO `comment` VALUES ('2', '2', '1234', '123', '123', 0000000000, 0000000000, '2020-9-10', NULL, NULL);
INSERT INTO `comment` VALUES ('3', '1', '4f814c9477ca3b8a00ce2966fe9dcad8', 'test1', 'xxxxxxxxxxx', 0000000003, 0000000000, '2020-9-10', NULL, NULL);
INSERT INTO `comment` VALUES ('52280b8a8554858f2deb96299f736d77', '1', '001ab27d478d04cba95fedd4300cdb00', 'test', '11', 0000000003, 0000000000, '2020-09-14 08:45:50', NULL, NULL);

-- ----------------------------
-- Table structure for course
-- ----------------------------
DROP TABLE IF EXISTS `course`;
CREATE TABLE `course`  (
  `id` varchar(45) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL COMMENT 'id',
  `url` varchar(225) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL COMMENT '图片url',
  `name` varchar(45) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL COMMENT '课程名字',
  PRIMARY KEY (`id`) USING BTREE
) ENGINE = MyISAM CHARACTER SET = latin1 COLLATE = latin1_swedish_ci ROW_FORMAT = DYNAMIC;

-- ----------------------------
-- Records of course
-- ----------------------------
INSERT INTO `course` VALUES ('1', 'https://edu-image.nosdn.127.net/401b122428424831adc9991bd6904be5.png?imageView&quality=100&thumbnail=230y130&type=webp', 'c++设计');
INSERT INTO `course` VALUES ('2', '', 'spring boot');

-- ----------------------------
-- Table structure for courses
-- ----------------------------
DROP TABLE IF EXISTS `courses`;
CREATE TABLE `courses`  (
  `id` varchar(150) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL COMMENT 'ID',
  `curriculumname` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '鍚嶅瓧',
  `URL` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT 'URL',
  `school_of_the_course` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '瀛︽牎',
  `opening_teacher` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '鏁欏笀濮撳悕',
  `curriculum_type` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '绫诲埆',
  `useful` int(11) NULL DEFAULT NULL COMMENT '鍙敤鎬?',
  `introduction` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '课程简介',
  `hour` int(11) NULL DEFAULT NULL COMMENT '璇炬椂',
  `start_time` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '寮€濮嬫椂闂?',
  `end_time` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '缁撴潫鏃堕棿',
  `price` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT '0',
  `sales` varchar(255) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT '0',
  PRIMARY KEY (`id`) USING BTREE
) ENGINE = InnoDB CHARACTER SET = utf8 COLLATE = utf8_general_ci ROW_FORMAT = DYNAMIC;

本系统采用的框架是SpringBoot是一种全新的框架，目的是为了简化Spring应用的初始搭建以及开发过程。该框架使用特定的方式(集成starter，约定优于配置)来进行配置，从而使开发人员不需要再定义样板化的配置。SpringBoot提供了一种新的编程范式，可以更加快速便捷地开发Spring项目，在开发过程当中可以专注于应用程序本身的功能开发，而无需在Spring配置上花太大的工夫。SpringBoot基于Sring4进行设计，继承了原有Spring框架的优秀基因。SpringBoot并不是一个框架，而是一些类库的集合。maven或者gradle项目导入相应依赖即可使用SpringBoot，而无需自行管理这些类库的版本。

我是程序员小孟，欢迎点赞关注，后面点赞超过500，需要的小伙伴多，会把源码开源给大家学习。