【若依】前后端分离版快速上手

本文涉及的产品
云数据库 Redis 版,社区版 2GB
推荐场景:
搭建游戏排行榜
简介: 【若依】前后端分离版快速上手

一、什么是若依

  • 若依框架(RuoYi)是一个基于Spring Boot和Vue.js的快速开发平台,它提供了一套前后端分离的解决方案,能够帮助开发人员快速构建企业级应用程序。该框架包含了许多常用的功能模块,如用户管理、角色权限、数据字典、系统监控、定时任务等,同时也提供了丰富的插件和扩展机制,可以方便地进行定制开发。
  • 对于开发人员来说,若依框架提供了一套完整的开发工具和解决方案,可以大大提高开发效率。开发人员可以利用框架提供的模块和组件快速搭建起一个基础的系统框架,然后根据具体业务需求进行定制开发。同时,若依框架还提供了丰富的文档和示例代码,可以帮助开发人员快速上手和学习框架的使用方法。

二、运行若依项目

2.1 官网下载

官网地址:https://www.ruoyi.vip/

在官网中提供了若依框架的源代码,点击源码地址,就可以进入到对应的gitee界面

在gitee界面中进行克隆/下载到本地

2.2 前置条件

  • 因为若依框架是一个基于Spring Boot和Vue.js的快速开发平台,所以需要有Spring Boot的基础
  • 环境要求:
  • JDK1.8+
  • MySQL
  • Redis(Windows/Linux均可)
  • Maven
  • Vue

2.3 使用若依

2.3.1 打开项目

2.3.2 模块介绍

  • ruoyi-admin 模块:
  • 用户管理:提供了用户的增删改查等基本管理功能,包括用户的角色分配、密码重置等操作。
  • 角色管理:用于管理系统中的角色信息,包括角色的权限分配、角色的数据范围等。
  • 菜单管理:提供了系统菜单的管理功能,包括菜单的增删改查、菜单的显示顺序等。
  • 部门管理:用于管理系统中的部门信息,包括部门的层级结构、部门的负责人等。
  • 字典管理:提供了数据字典的管理功能,用于管理系统中的数据字典信息。
  • 登录日志:记录了用户的登录日志信息,包括登录时间、登录地点等。
  • 操作日志:记录了用户的操作日志信息,包括用户的操作行为、操作时间等。
  • ruoyi-common 模块:
  • 基础功能:提供了系统中常用的基础功能,如常量定义、异常处理、数据校验等。
  • 工具类:包括了系统中常用的工具类,如日期工具类、字符串工具类、加密解密工具类等。
  • 配置管理:用于管理系统中的配置信息,包括系统参数配置、文件上传配置等。
  • ruoyi-framework 模块:
  • 框架核心:提供了系统的核心功能和基础设施,包括权限控制、数据访问、日志记录等。
  • 插件机制:支持插件化开发,可以方便地进行定制开发和功能扩展。
  • ruoyi-generator 模块:
  • 代码生成:提供了代码生成器,可以根据数据库表自动生成对应的CRUD代码,加快开发速度。
  • ruoyi-quartz 模块:
  • 定时任务:提供了定时任务的管理和执行功能,可以方便地配置和管理系统中的定时任务。
  • ruoyi-recruiting 模块:
  • 招聘管理:提供了招聘信息的管理功能,包括职位发布、简历管理等。
  • ruoyi-system 模块:
  • 系统管理:包括用户管理、角色管理、菜单管理、部门管理等功能,用于管理系统中的用户和权限。
  • 系统监控:提供了系统日志、在线用户、性能监控等功能,用于监控系统的运行状态和性能。

2.3.3 创建数据库

在下载的代码中有一个sql文件夹,执行其中的两个sql脚本,创建好数据库,并在工程中的application-druid.yml文件中配置数据库信息

**



2.3.4 启动Redis



  • 在Redis的安装文件夹下打开cmd窗口,并输入命令redis-server.exe redis.windows.conf依据配置文件启动Redis


  • 重新打开一个cmd,之前的不要关闭,输入redis-cli.exe,启动成功


  • 在工程中配置redis

2.3.5 启动项目

在ruiyi-admin模块中运行启动类即可






三、启动前端

  1. 安装依赖
npm install
  • 2.建议不要直接使用 cnpm 安装依赖,会有各种诡异的 bug。可以通过如下操作解决 npm 下载速度慢的问题
npm install --registry=https://registry.npmmirror.com
  1. 启动服务
npm run dev
  • 在cmd中运行如果启动失败,可以先执行set NODE_OPTIONS=--openssl-legacy-provider ,然后再尝试运行启动服务,启动成功后,会自动打开浏览器中若依的前端登录页面


四、代码自动生成

  • 若依框架提供了代码自动生成的功能,通过 ruoyi-generator 模块实现。这个模块可以根据数据库表结构自动生成对应的增删改查(CRUD)代码,包括实体类、Mapper接口、Service接口、Controller等,从而加快开发速度,减少重复劳动。

4.1 创建数据表

use my_test;
# 测试数据表
create table ruoyi_table(
    id int primary key auto_increment comment "主键",
    name varchar(11) comment "姓名",
    password varchar(11) comment "密码"
);

4.2 代码生成

在前端页面中点击系统工具–>代码生成



  • 点击导入(选择刚才创建的数据表)


  • 点击预览,就能看到每一层的代码

  • 点击编辑可以修改注释


  • 填写基本信息(否则无法提交)

  • 生成信息

  • 提交后点击生成代码

  • 生成代码会下载一个压缩包,进行解压,解压后,会有两个文件夹和一个sql文件,一个是main文件夹,其中是Java的代码,还有一个是vue文件夹,存放的是Vue前端代码,sql文件是菜单的SQL语句
  • 导入代码,重启项目
  • 前端:

  • 执行sql


  • 重启项目



相关实践学习
基于Redis实现在线游戏积分排行榜
本场景将介绍如何基于Redis数据库实现在线游戏中的游戏玩家积分排行榜功能。
云数据库 Redis 版使用教程
云数据库Redis版是兼容Redis协议标准的、提供持久化的内存数据库服务,基于高可靠双机热备架构及可无缝扩展的集群架构,满足高读写性能场景及容量需弹性变配的业务需求。 产品详情:https://www.aliyun.com/product/kvstore     ------------------------------------------------------------------------- 阿里云数据库体验:数据库上云实战 开发者云会免费提供一台带自建MySQL的源数据库 ECS 实例和一台目标数据库 RDS实例。跟着指引,您可以一步步实现将ECS自建数据库迁移到目标数据库RDS。 点击下方链接,领取免费ECS&RDS资源,30分钟完成数据库上云实战!https://developer.aliyun.com/adc/scenario/51eefbd1894e42f6bb9acacadd3f9121?spm=a2c6h.13788135.J_3257954370.9.4ba85f24utseFl
相关文章
|
7月前
|
资源调度 关系型数据库 MySQL
若依框架部署从零开始2023版(前后端分离)
电脑最近重装了一次系统,目前什么都没有安装,记录一下从零开始部署前后端分离版本的若依框架系统先去官网把若依源码拉下来。
420 0
|
1月前
|
弹性计算 NoSQL Java
若依框架---前后端分离项目部署实践
若依框架---前后端分离项目部署实践
166 0
|
2天前
|
前端开发 JavaScript API
现代Web开发中的前后端分离架构
本篇文章探讨了前后端分离架构在现代Web开发中的应用与优势。
|
4天前
|
XML 前端开发 Java
基于Springboot的web后端开发三层架构上手实操
基于Springboot的web后端开发三层架构上手实操
9 0
|
1月前
|
前端开发 NoSQL Java
1、若依(前后端分离)框架的使用
1、若依(前后端分离)框架的使用
149 0
|
1月前
|
前端开发 JavaScript NoSQL
开源!!!前后端分离微图书管理系统!!!附源码!!!
开源!!!前后端分离微图书管理系统!!!附源码!!!
|
10月前
|
Java Maven
后端开发1.项目的搭建
后端开发1.项目的搭建
79 0
|
存储 开发框架 资源调度
UniApp下的前后端分离实践-使用API接口实战
UniApp下的前后端分离实践-使用API接口实战
544 0
UniApp下的前后端分离实践-使用API接口实战
|
开发框架 数据可视化 JavaScript
一套.NetCore+Vue+Uniapp前后端分离的低代码快速开发框架
一个基于.Net Core构建的简单、跨平台快速开发框架。前后端封装了上千个常用类,方便扩展;集成了代码生成器,支持前后端业务代码生成,实现快速开发,提升工作效率;框架集成了表单、表格、图表等各种常用的Demo方便直接使用;后端框架支持Vue2、Vue3。
965 0
一套.NetCore+Vue+Uniapp前后端分离的低代码快速开发框架