首页 > 其他分享 >【电影推荐系统】Spring Boot + Vue3 前后端分离项目

【电影推荐系统】Spring Boot + Vue3 前后端分离项目

时间:2023-12-30 20:33:23浏览次数:20  
标签:... 项目 Spring 1.3 电影 用户 Boot Vue3 2.1

目录

0 前言

总项目名称:电影推荐系统

项目采用前后端分离

  1. 前端:
  2. 后端:
  3. 数据爬虫:
    • 简介:爬取项目所需的电影基本信息数据和用户评价数据等并存储。
    • 仓库地址:正在路上...
    • 技术栈:正在路上...

系统功能模块总览:

系统功能模块.png

1 项目前端介绍

项目地址:movie_recommendation_system_vue

1.1 项目启动和编译

1.1.1 项目启动

Compiles and hot-reloads for development:

npm run serve

1.1.2 项目编译

Compiles and minifies for production:

npm run build

1.2 前端技术栈

  • Vue3框架
  • Element Plus组件库(基于 Vue 3,面向设计师和开发者的组件库)
  • Axios库(一个基于 promise 的网络请求库)
  • Echarts库(一个基于 JavaScript 的开源可视化图表库)
  • vue-copper库(基于vue的优雅图片裁剪插件)
  • ...

1.3 功能模块前端界面展示

1.3.1 基础功能模块

主要是游客可以查看的页面信息。

  1. 主页面

系统主页.png
2. 电影分类

电影分类.png

  1. 搜索电影

搜索电影.png

  1. 查看电影详情

查看电影详情.png

1.3.2 用户模块

主要包括用户登录、注册、修改个人信息、账号设置、查看电影评价、进行电影评价等功能。

  1. 用户登录

用户登录.png

  1. 用户注册

用户注册.png

  1. 修改个人信息(包括头像、昵称、性别、电影特征偏好等)

修改个人信息.png

  1. 账号设置(包括密码修改、绑定邮箱等)

账号设置.png

  1. 查看电影评价

    • 用户点赞:点赞功能在前端通过节流,来防止用户恶意点击。
    • 滚动置底加载:当滚轮滚动至底部时,加载新的评论。

查看电影评价.png

  1. 进行电影评价

进行电影评价.png

  1. 用户主页

用户主页.png

1.3.3 特色功能展示

  1. 电影星球

主要展示用户看过电影和系统推荐电影之间的关系,用户可以点击电影结点,查看电影的详情页面。电影星球.png

  1. 评论词云图

将电影评论进行分词后,去除无关符号和词语,通过词云图展示电影的一些关键字信息。

评论词云图.png

1.3.4 界面自适应实现

  1. 手机端展示
手机端自适应_1 手机端自适应_2 手机端自适应_3
  1. 平板端展示
平板端自适应_1 平板端自适应_2 平板端自适应_1 平板端自适应_2

2 项目后端介绍

仓库地址:movie_recommendation_system_server

2.1 项目打包部署

2.1.1 项目打包

IDEA右边栏中选择Maven → 按住Ctrl → 选择Lifecycle下的cleanpackage → 点击上方的绿色运行按钮 → 等待项目打包成jar包 → 打包好的jar包会在项目的target目录中

项目打包.png

2.1.2 项目部署

  1. 将打包好的项目jar包上传到自己的服务器上。

  2. 通过以下命令时项目在服务器后台运行,并且输出日志到out.txt文件(可修改):

    nohup java -jar 项目名.jar >out.txt &

2.2 后端功能实现

  1. 用户登录、注册、个人信息修改等接口实现。
  2. 基于内容推荐和基于用户协同过滤推荐等推荐算法实现,整合两种算法实现混合式推荐,并解决冷启动问题。
  3. 查询各种电影信息接口实现(如电影搜索、推荐给用户的电影信息查询等)。
  4. 用户点赞功接口实现(点赞信息暂存,再按时持久化到数据库)。
  5. ...

3 数据爬虫介绍

  • 简介:爬取项目所需的电影基本信息数据和用户评价数据等并存储。
  • 仓库地址:正在路上...
  • 技术栈:正在路上...

转载声明:该博客来源于vanish丶的博客园

标签:...,项目,Spring,1.3,电影,用户,Boot,Vue3,2.1
From: https://www.cnblogs.com/vanishzeng/p/17936771

相关文章

  • vue3的ref、reactive、toRef、toRefs
    用处:用于在setup中创建响应式变量导出:import{ref,reactive,toRef,toRefs}from'vue'区别:ref用来定义基础数据类型,String,Number,Boolean,Symbol;通过Object.defineProperty()的get和set来实现响应式;js操作数据需要.value,模版中读取不需要.valuereactive用来定义......
  • SpringBoot 集成 Dubbo
    分布式、微服务与RPC什么是分布式?分布式就是将一个应用程序的功能拆分到多个独立的进程中,每个进程都运行在不同的机器上,通过网络连接起来,这样就形成了一个分布式的系统。什么是微服务架构?微服务架构将应用程序拆分成一组小的服务(微服务),每个服务运行在自己的进程中,服务之间通过......
  • Spring学习记录之命名空间注入
    Spring学习记录之命名空间注入前言这篇文章是我第二次学习b站老杜的spring相关课程所进行的学习记录,算是对课程内容及笔记的二次整理,以自己的理解方式进行二次记录,其中理解可能存在错误,欢迎且接受各位大佬们的批评指正;关于本笔记,只是我对于相关知识遗忘时快速查阅了解使用,至于......
  • Spring 事务快速上手
    Spring事务与数据库事务关系spring事务本质上使用数据库事务,而数据库事务本质上使用数据库锁,所以spring事务本质上使用数据库锁,开启spring事务意味着使用数据库锁。spring事务是对数据库事务的封装,最后本质的实现还是在数据库,如果数据库不支持事务,spring的事务是不起作用的。数......
  • 在Vue3中实现前端导出Excel功能
    在Vue3中,可以使用第三方库如xlsx来导出Excel文件。以下是一个基本示例:一、Vue3常规写法安装xlsx库首先,你需要安装xlsx库。使用以下命令进行安装:npminstallxlsx导入函数在Vue组件中,导入所需的函数:import{writeFile}from'xlsx';创建模拟数据创建一个函数来生成Excel文件的数......
  • SpringBoot2 全局捕获异常实例
    1. SpringBoot全局捕获异常首先写一个会抛出异常的 Controller 类 如下所示,i=1/0,0不能作为除数,显然这个 Controller 类 ErrorController.java会抛出异常。@EnableAutoConfiguration@RestControllerpublicclassErrorController{@RequestMapping("/errorTest......
  • SpringBoot2 读取不同环境的配置文件实例
    SpringBoot 可以在application.properties 中配置信息spring.profiles.active来读取不同环境的配置文件。1.  SpringBoot2读取不同环境的配置文件工程运行环境可能有:开发环境、测试环境和生产环境,可以通过修改application.properties 来获取不同环境的的配置信息。首先我......
  • Spring的事务管理
    1. 事务概述1.1事务的四个特性 ACID 原子性(Automic): 事务作为一个整体被执行,包含在事务中对数据库的操作,要么全部被执行,要么全部不被执行。一致性(Consistency):事务应该保证数据库从一个一致状态转变为另外一个状态。隔离性(Isolation):多个事务并发执行时,一个事务的执行不应......
  • Spring 中控制反转 和 依赖注入 的区别和关系
    控制反转(IOC),面向对象的一种设计原则,目的是降低耦合度。依赖注入(DI)是实现控制反转的常见方式,控制反转的另外一种实现方式是 依赖查找。控制反转中的控制指的是自己控制(创建)自己的成员变量,反转指的是由通过自己去控制(创建)成员变量变成由第三方来传递给自身,也就是第三方将自己的依赖......
  • IDEA 中 SpringBoot2 整合 Mybatis 实例实例
    记录在IDEA中 使用SpringBoot2整合Mybatis的实例,环境:Java8+Maven+MySQL8。1. 添加依赖 添加MyBatis依赖,MySQL连接依赖,,数据库用的MySQL8。<!--MyBatis依赖--><dependency><groupId>org.mybatis.spring.boot</groupId><artifactId>mybatis-s......