【项目实战】谷粒学院项目回顾

在这里插入图片描述

本文作者: slience_me


谷粒学院

谷粒学院项目致力于打造一个B2C模式的职业技能在线教育系统平台,采用现阶段流行技术来实现,采用前后端分离编写。

GitHub 地址

项目学习资源

  • 项目文档

    slience_me的博客

  • 接口文档

    • 谷粒学院完整代码: https://github.com/slience-me/GuliEdu.git

项目介绍

谷粒学院项目是一套在线教育项目,包括前台系统以及后台管理系统,基于 SpringCloud、SpringCloud Alibaba、MyBatis Plus实现。前台系统包括:用户登录、注册、名师列表、名师详情、课程列表、课程详细、视频在线播放等模块。后台管理系统包括:首页、权限管理、讲师分类、课程分类、课程管理、统计分析等模块。

系统模块

系统架构

架构设计需要考虑的几个方面:

  • 性能: 主要考虑访问频率,每个用户每天的访问次数。项目初始阶段用户的访问量并不大,如果考虑做运营推广,可能会迎来服务器访问量骤增,因此要考虑 ** 分布式部署,引入缓存
  • 可扩展性: 系统功能会随着用户量的增加以及多变的互联网用户需求不断地扩展,因此考虑到系统的可扩展性的要求需要使用微服务架构,引入消息中间件
  • 高可用: 系统一旦宕机,将会带来不可挽回的损失,因此必须做负载均衡,甚至是异地多活这类复杂的方案。如果数据丢失,修复将会非常麻烦,只能靠人工逐条修复,这个很难接受,因此需要考虑存储高可靠。我们需要考虑多种异常情况:机器故障、机房故障,针对机器故障,我们需要设计 MySQL 同机房主备方案;针对机房故障,我们需要设计 MySQL 跨机房同步方案。
  • 安全性: 系统的信息有一定的隐私性,例如用户的个人身份信息,不包含强隐私(例如玉照、情感)的信息,因此使用账号密码管理、数据库访问权限控制即可。
  • 成本: 视频类网站的主要成本在于服务器成本、流量成本、存储成本、流媒体研发成本,中小型公司可以考虑使用云服务器和云服务。

在这里插入图片描述

项目演示

前台商品系统

首页

在这里插入图片描述

登录注册

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

课程详情

在这里插入图片描述

课程详情页

在这里插入图片描述

订单支付页面

在这里插入图片描述
在这里插入图片描述

名师列表功能

在这里插入图片描述

名师详情功能

在这里插入图片描述

视频播放

image-20210427235857418

后台管理系统

登录

image-20210427173911453

权限管理

用户管理

在这里插入图片描述

角色管理

image-20210427174108641

菜单管理

image-20210427174135611

其他系统

组织结构

完整结构

GuliEdu/
├── guli-admin
│   ├── build
│   ├── config
│   ├── favicon.ico
│   ├── index.html
│   ├── LICENSE
│   ├── package.json
│   ├── package-lock.json
│   ├── README.md
│   ├── README-zh.md
│   ├── src
│   └── static
├── guli-front
│   ├── api
│   ├── assets
│   ├── components
│   ├── layouts
│   ├── middleware
│   ├── nuxt.config.js
│   ├── package.json
│   ├── package-lock.json
│   ├── pages
│   ├── plugins
│   ├── README.md
│   ├── static
│   ├── store
│   └── utils
├── guli-parent
│   ├── 目录结构.md
│   ├── canal_clientedu
│   ├── common
│   ├── infrastructure
│   ├── pom.xml
│   └── service
├── README.md
└── sql├── guli_acl.sql├── guli_cms.sql├── guli_edu.sql├── guli_order.sql├── guli_statistics.sql└── guli_ucenter.sql

后端

GuliEdu/guli-parent/
├── 目录结构.md
├── canal_clientedu
│   ├── pom.xml
│   └── src
├── common
│   ├── common_utils
│   ├── pom.xml
│   ├── service_base
│   └── spring_security
├── infrastructure
│   ├── api_gateway
│   └── pom.xml
├── pom.xml
└── service├── pom.xml├── service_acl├── service_cms├── service_edu├── service_msm├── service_order├── service_oss├── service_statistics├── service_ucenter└── service_vod

前端guli_admin

GuliEdu/guli-admin/
├── build
│   ├── build.js
│   ├── check-versions.js
│   ├── logo.png
│   ├── utils.js
│   ├── vue-loader.conf.js
│   ├── webpack.base.conf.js
│   ├── webpack.dev.conf.js
│   └── webpack.prod.conf.js
├── config
│   ├── dev.env.js
│   ├── index.js
│   └── prod.env.js
├── favicon.ico
├── index.html
├── LICENSE
├── package.json
├── package-lock.json
├── README.md
├── README-zh.md
├── src
│   ├── api
│   ├── App.vue
│   ├── assets
│   ├── components
│   ├── icons
│   ├── main.js
│   ├── permission.js
│   ├── router
│   ├── store
│   ├── styles
│   ├── utils
│   └── views
└── static├── 01.jpg├── 01.xlsx└── tinymce4.7.5

前端guli_front

GuliEdu/guli-front/
├── api
│   ├── banner.js
│   ├── commonedu.js
│   ├── course.js
│   ├── index.js
│   ├── login.js
│   ├── orders.js
│   ├── register.js
│   ├── teacher.js
│   └── vod.js
├── assets
│   ├── css
│   ├── img
│   ├── js
│   ├── photo
│   └── README.md
├── components
│   ├── AppLogo.vue
│   └── README.md
├── layouts
│   ├── default.vue
│   ├── README.md
│   ├── sign.vue
│   └── video.vue
├── middleware
│   └── README.md
├── nuxt.config.js
├── package.json
├── package-lock.json
├── pages
│   ├── article
│   ├── course
│   ├── index.vue
│   ├── login.vue
│   ├── orders
│   ├── pay
│   ├── player
│   ├── qa
│   ├── README.md
│   ├── register.vue
│   └── teacher
├── plugins
│   ├── nuxt-swiper-plugin.js
│   └── README.md
├── README.md
├── static
│   ├── favicon.ico
│   └── README.md
├── store
│   └── README.md
└── utils└── request.js

技术选型

后端技术

技术说明官网
SpringBoot容器+MVC框架https://spring.io/projects/spring-boot
SpringCloud微服务架构https://spring.io/projects/spring-cloud
SpringCloudAlibaba一系列组件https://spring.io/projects/spring-cloud-alibaba
MyBatis-PlusORM框架https://mp.baomidou.com
OSS对象云存储https://github.com/aliyun/aliyun-oss-java-sdk
EasyExcel处理Excel工具https://www.yuque.com/easyexcel/doc
Docker应用容器引擎https://www.docker.com
jenkins自动化部署https://www.jenkins.io/

前端技术

技术说明官网
Vue前端框架https://vuejs.org
Element-ui前端UI框架https://element.eleme.cn/#/zh-CN
Nuxt前端UI框架https://zh.nuxtjs.org/
node.js服务端的jshttps://nodejs.org/en
Echarts数据可视化图表https://echarts.apache.org/zh/index.html

环境搭建

开发工具

工具说明官网
IDEA开发Java程序https://www.jetbrains.com/idea/download
RedisDesktopredis客户端连接工具https://redisdesktop.com/download
X-shellLinux远程连接工具http://www.netsarang.com/download/software.html
Navicat数据库连接工具http://www.formysql.com/xiazai.html
PowerDesigner数据库设计工具http://powerdesigner.de
PostmanAPI接口调试工具https://www.postman.com
TyporaMarkdown编辑器https://typora.io

开发环境

工具版本号下载
JDK1.8https://www.oracle.com/java/technologies/javase/javase-jdk8-downloads.html
Mysql5.7https://www.mysql.com
RedisRedishttps://redis.io/download
Nginx1.1.6http://nginx.org/en/download.html

注意:以上的除了jdk都是采用docker方式进行安装,详细安装步骤可参考百度!!!

​ Nginx 可以不使用,本项目后期都替换了使用GateWay 来作为网关

搭建步骤

准备工作

IDEA,Visual Studio Code,JDK >= 1.8 (推荐1.8版本), Mysql >= 5.7, Maven

Windows环境部署

  • 必须先启动 先启动 nacos 注册中心

    在这里插入图片描述

后端启动

  • 克隆整个后端项目 GuliEdu,并导入 IDEA 中完成编译
git clone https://github.com/slience-me/GuliEdu.git
  • 创建数据库guli_edu并导入数据脚本sql / **
    在这里插入图片描述

  • 修改各个模块的application.properties文件的MySQL配置信息

spring.datasource.driver-class-name=com.mysql.cj.jdbc.Driver
spring.datasource.url=jdbc:mysql://localhost:3306/你的数据库名称?autoReconnect=true&useUnicode=true&characterEncoding=utf8&serverTimezone=GMT%2B8
spring.datasource.username=root
spring.datasource.password=你的密码
  • 修改guli-teacher、guli-acl、guli_cms、guli_msm、guli_order、guli_ucenter模块的application.properties文件的Redis配置信息
spring.redis.host=redis IP 地址
spring.redis.port=6379
spring.redis.database= 0
spring.redis.timeout=1800000
  • 修改 guli_oss 模块的application.properties文件,阿里OSS的 endpoint、 keyid、keysecret、bucketname、filehost
#阿里云 OSS
#不同的服务器,地址不同
aliyun.oss.file.endpoint=oss-cn-shenzhen.aliyuncs.com
aliyun.oss.file.keyid=<you keyid>
aliyun.oss.file.keysecret=<you keysecret>
#bucket可以在控制台创建,也可以使用java代码创建
aliyun.oss.file.bucketname=oypicbed
aliyun.oss.file.filehost=ossTest

获取方式
在这里插入图片描述

  • 修改 guli_msm 模块的 MsmServiceImpll 类中的短信模板以及keyid、keysecret,模板的话需要自己去阿里云短信服务自己申请
DefaultProfile profile = DefaultProfile.getProfile("default", "<you keyid>", "<you keysecret>");DefaultAcsClient client = new DefaultAcsClient(profile);// 设置相关固定的参数CommonRequest request = new CommonRequest();request.setMethod(MethodType.POST);request.setDomain("dysmsapi.aliyuncs.com");request.setVersion("2017-05-25");request.setAction("SendSms");// 设置相关的参数request.putQueryParameter("PhoneNumbers",phone); // 手机号request.putQueryParameter("SignName","<签名>"); // 申请阿里云 签名失败request.putQueryParameter("TemplateCode","<模板>" ); //申请阿里云 模板coderequest.putQueryParameter("TemplateParam", JSONObject.toJSONString(param)); //验证码数据,转换json数据传递

在这里插入图片描述

  • 修改 guli_vod 模块的application.properties文件,阿里视频点播 的 keyid、keysecret
#阿里云 vod
#不同的服务器,地址不同
aliyun.vod.file.keyid=<you keyid>
aliyun.vod.file.keysecret=<you keysecret>

谷粒学院相关环境

链接:https://pan.baidu.com/s/1oRCwM0voI7Mfmkl_1ueQyQ?pwd=eyfv
提取码:eyfv --来自百度网盘超级会员V5的分享

侵权联系,立即删除


问题汇总

node版本管理工具见nvm

1. guli-admin项目相关

注意node版本问题,我使用了node版本为10.14.2,相关安装包见百度网盘

"dependencies": {"axios": "0.18.0","echarts": "^4.3.0","element-ui": "^2.4.6","js-cookie": "2.2.0","normalize.css": "7.0.0","nprogress": "0.2.0","vue": "2.5.17","vue-router": "3.0.1","vuex": "3.0.1","vuex-persistedstate": "^4.1.0"},

2. guli-front项目相关

注意node版本问题,我使用了node版本为18.19.0,相关安装包见百度网盘

 "dependencies": {"axios": "^0.21.1","element-ui": "^2.15.1","js-cookie": "^2.2.1","nuxt": "^2.0.0","vue-awesome-swiper": "^3.1.3","vue-qriously": "^1.1.1"},

文档参考链接

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/251152.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

使用ChatGPT学习大象机器人六轴协作机械臂mechArm

引言 我是一名机器人方向的大学生&#xff0c;近期学校安排自主做一个机器人方面相关的项目。学校给我们提供了一个小型的六轴机械臂&#xff0c;mechArm 270M5Stack&#xff0c;我打算使用ChatGPT让它来辅助我学习如何使用这个机械臂并且做一个demo。 本篇文章将记录我是如何使…

模型单体化真的有那么重要吗?

模型单体化是三维建模绕不开的一关&#xff0c;日常想要实现模型单体化可以使用一些软件加以辅助。 比如【云端地球&#xff08;Das Earth&#xff09;】 这是一款集中于实景三维建模与展示、建模数据分析、个性化服务选择于一体的云平台&#xff1b;在线建模&#xff0c;具有…

MySQL进阶之锁(表级锁,元数据锁,意向锁)

表级锁 介绍 表级锁&#xff0c;每次操作锁住整张表。锁定粒度大&#xff0c;发生锁冲突的概率最高&#xff0c;并发度最低。应用在MyISAM、 InnoDB、BDB等存储引擎中。 对于表级锁&#xff0c;主要分为以下三类&#xff1a; 表锁 元数据锁&#xff08;meta data lock&…

微信小程序(二十九)交互提示-界面加载框和提示框

注释很详细&#xff0c;直接上代码 上一篇 新增内容&#xff1a; 1.showLoading加载框示范 2.showToast提示框示范 源码&#xff1a; index.wxml <!-- 列表渲染基础写法&#xff0c;不明白的看上一篇 --> <view class"students"><view class"it…

浅谈WPF之UniformGrid和ItemsControl

在日常开发中&#xff0c;有些布局非常具有规律性&#xff0c;比如相同的列宽&#xff0c;行高&#xff0c;均匀的排列等&#xff0c;为了简化开发&#xff0c;WPF提供了UniformGrid布局和ItemsControl容器&#xff0c;本文以一个简单的小例子&#xff0c;简述&#xff0c;如何…

RabbitMQ控制台的基本使用

启动RabbitMQ后&#xff0c;浏览器 http://localhost:15672 打开RabbitMQ的控制台页面后&#xff0c;登录默认账户guest。 一. 添加队列 控制台选择队列&#xff0c;然后选择添加队列&#xff0c;队列类型默认经典类型&#xff0c;然后输入队列名称&#xff0c;最后添加队列。…

Kore.ai获10亿元融资,提供定制化类ChatGPT助手

1月31日&#xff0c;生成式AI和企业对话平台Kore.ai在官网宣布&#xff0c;获得1.5 亿美元&#xff08;约10.7亿元&#xff09;融资。本次由FTV Capital 领投&#xff0c;英伟达等跟投。 Kore.ai主要提供银行、医疗、零售、营销、人力资源等多种领域的&#xff0c;定制化类Cha…

Leetcode的AC指南 —— 栈与队列 :1047.删除字符串中的所有相邻重复项

摘要&#xff1a; **Leetcode的AC指南 —— 栈与队列 &#xff1a;1047.删除字符串中的所有相邻重复项 **。题目介绍&#xff1a;给出由小写字母组成的字符串 S&#xff0c;重复项删除操作会选择两个相邻且相同的字母&#xff0c;并删除它们。 在 S 上反复执行重复项删除操作&a…

RHCE DNS域名解析服务器

目录 1. 正向解析 1.1 安装必要软件 1.2 配置静态ip 1.3 DNS配置 1.4 测试 2. 反向解析 2.1 关闭安全软件&#xff0c;安装必要软件 2.2 配置静态ip 2.3 DNS配置 2.4 测试 1. 正向解析 1.1 安装必要软件 1.2 配置静态ip 服务器配置 nmcli c modify ens32 ipv4.method man…

【乳腺肿瘤诊断分类及预测】基于PNN概率神经网络

课题名称&#xff1a;基于PNN的乳腺肿瘤诊断分类及预测 版本日期&#xff1a;2023-06-15 运行方式: 直接运行PNN0501.m 文件即可 代码获取方式&#xff1a;私信博主或QQ&#xff1a;491052175 模型描述&#xff1a; 威斯康辛大学医学院经过多年的收集和整理&#xff0c;建…

mysql 锁知识汇总

目录 一、锁1.1 什么是锁&#xff1f;1.2 全局锁1.2.1 定义1.2.2 应用场景1.2.3 会出现的问题1.2.4 解决方法 1.3 表级锁1.3.1 表锁1.3.2 元数据锁&#xff08;MDL&#xff09;1.3.3 意向锁1.3.4 AUTO-INC锁 1.4 行级锁1.4.1 记录锁(Record Lock)1.4.2 间隙锁(Gap Lock)1.4.3 N…

国家组织考试并唯一认可的IT类资格证书:计算机技术与软件专业技术资格(水平)考试证书

目录 一、这么多IT类证书为什么只有软考证书权威 1.根据身份选择并考证 2.根据需要选择考试 3.要根据证书的出身选择考试 二、软考的考试内容 三、证书样张 计算机技术与软件专业技术资格&#xff08;水平&#xff09;考试&#xff0c;简称“软考”&#xff0c;是人力资源…

HBase 数据导入导出

HBase 数据导入导出 1. 使用 Docker 部署 HBase2. HBase 命令查找3. 命令行操作 HBase3.1 HBase shell 命令3.2 查看命名空间3.3 查看命名空间下的表3.4 新建命名空间3.5 查看具体表结构3.6 创建表 4. HBase 数据导出、导入4.1 导出 HBase 中的某个表数据4.2 导入 HBase 中的某…

基于nginx的虚拟主机配置

目录 一.基于不同ip的虚拟主机 二.基于不同端口的虚拟主机 三.基于不同域名的虚拟主机 一.基于不同ip的虚拟主机 1.关闭 SELinux和防火墙 2.在/data目录中创建三个目录&#xff0c;分别为nginx1、nginx2 和nginx3,具体名为: 3.分别在三个目录中创建index.html,并输入内容“…

Linux下新建用户

新建用户 sudo adduser -m username添加密码 sudo passwd username设置权限 sudo vi /etc/sudoers在user privilege这一行&#xff0c;仿照root&#xff0c;另起一行&#xff0c;添加上 设置命令解释器 sudo vi /etc/passwd找到新建用户名&#xff0c;将sh改为bash vi中…

微信小程序(三十三)promise异步写法

注释很详细&#xff0c;直接上代码 上一篇 新增内容&#xff1a; 1.promise异步与普通异步的写法区别 2.promise异步的优势 源码&#xff1a; index.wxml <view class"preview" bind:tap"onChoose"><image src"{{avatar}}" mode"…

爬虫入门到精通_基础篇4(BeautifulSoup库_解析库,基本使用,标签选择器,标准选择器,CSS选择器)

1 Beautiful说明 BeautifulSoup库是灵活又方便的网页解析库&#xff0c;处理高效&#xff0c;支持多种解析器。利用它不用编写正则表达式即可方便地实线网页信息的提取。 安装 pip3 install beautifulsoup4解析库 解析器使用方法优势劣势Python标准库BeautifulSoup(markup,…

【Python】【完整代码】解析Excel 文件中的内容并检查是否包含某字符串,并返回判断结果

示例&#xff1a; 开发需求&#xff1a;解析Excel 文件中的内容并检查是否包含 "Fail" 字符&#xff0c;若没有则返回True&#xff0c;若有则返回False 实现代码&#xff1a; #!/usr/bin/env python3 # -*- encoding: utf-8 -*-File : check_excel_for_fail.py Ti…

Mysql运维篇(四) MySQL常用命令

一路走来&#xff0c;所有遇到的人&#xff0c;帮助过我的、伤害过我的都是朋友&#xff0c;没有一个是敌人。如有侵权&#xff0c;请留言&#xff0c;我及时删除&#xff01; 一、MySQL命令速查表 https://www.cnblogs.com/pyng/p/15560059.html Mysql DBA运维命令大全 - 墨…

多维时序 | Matlab实现CNN-RVM卷积神经网络结合相关向量机多变量时间序列预测

多维时序 | Matlab实现CNN-RVM卷积神经网络结合相关向量机多变量时间序列预测 目录 多维时序 | Matlab实现CNN-RVM卷积神经网络结合相关向量机多变量时间序列预测效果一览基本介绍程序设计参考资料 效果一览 基本介绍 Matlab实现CNN-RVM卷积神经网络结合相关向量机多变量时间序…