如果你已经会写 Vue 单页应用,也能用 Spring Boot 写出增删改查,但一让你从零搭一套「带权限、带菜单、带代码生成」的后台系统,就还是得翻半天文档、拼半天的轮子——那这门若依(RuoYi-Vue 前后端分离版)教程,正好补的就是这一块。

它讲的不是 Vue 语法,也不是 Spring Boot 入门,而是一套已经被大量中小项目验证过的工程组织方式:权限怎么切分、菜单怎么下发、接口怎么对齐、重复代码怎么交给生成器。下面按「你缺什么、课里练什么、学完能答什么」来说。

一、先确认缺口:你卡在哪一层

若依这类脚手架最容易让人产生「看着都会、动手就懵」的错觉,因为它的门槛不在单个技术点,而在几层约定的叠加:

  • 认证层:Token 怎么签发、怎么带到每次请求、后端怎么校验、前端路由怎么按权限拦截;
  • 权限层:角色、菜单、按钮权限三级怎么落库,前端拿到的权限标识怎么驱动按钮显隐;
  • 数据层:分页、通用返回体、异常统一处理、多数据源这些横切逻辑放在哪;
  • 生成层:代码生成器读的是哪张表、生成出来的前后端文件各自该放哪里、生成完还要改什么。

只要有一层没打通,你在真实项目里就会反复出现「接口通了但没权限」「页面出来了但菜单不显示」这类问题。这门课的价值,就是把这四层一次性摊开讲清楚。

二、课程围绕的主线

整体是从环境搭建起步,先把前后端两个工程跑起来,再顺着一条业务链路往下走:登录认证 → 权限与菜单 → 用户/角色/部门等基础模块 → 代码生成器 → 业务功能落地。重点不在「把每个菜单点一遍」,而在每一步背后的设计取舍:为什么分离部署、为什么权限标识要和前端指令一一对应、为什么基础模块要抽成可复用的结构。

配套练习该怎么用

看这类框架教程,光看必懵。建议边看边做三件事:

  • 跟着跑通一次登录全流程,自己抓一次请求,确认 Token 从哪来、存哪、怎么过期;
  • 新建一张业务表,走一遍代码生成,然后手动改一处生成结果,看它是否还能正常跑;
  • 给某个角色单独勾一组菜单和按钮权限,用另一个账号登录验证差异。

这三步做完,你对框架的掌控感会明显不同——从「照着敲」变成「知道改哪里」。

三、学完应该能回答的问题

  • 前后端分离后,前端如何在不刷新页面的情况下完成鉴权与权限校验?
  • 菜单权限和按钮权限在数据库和前端分别以什么形式存在?新增一个按钮权限要动哪几处?
  • 代码生成器生成的代码,哪些是可以直接用的,哪些几乎一定要改?
  • 如果要把若依当作公司内部项目的底座,哪些模块该保留、哪些该替换?

四、适合谁,不适合谁

适合有 Vue 基础和一定后端基础、正在做或即将做后台管理系统的开发者,也适合想通过一个成熟项目反推工程规范的人。如果你连 Vue 组件通信和 Spring Boot 的 Controller 都还没写过,建议先补这两块再看,否则容易停在「配置能跑、原理不清」的状态。

把它当成一次对已有知识的整理:你已经会写代码,现在需要的是把它们按一套靠谱的约定组织起来。

若依框架系列教程(RuoYi-Vue前后端分离版)

RuoYi-Vue前后端分离版深度解析

编辑点评

系统讲解RuoYi-Vue框架,涵盖前后端分离架构,适合有Vue和后端开发基础的学习者。

⭐ 编辑推荐

全面解析RuoYi-Vue框架,从环境搭建到功能实现,助你快速掌握前后端分离开发。

课程亮点

• RuoYi-Vue框架深度解析
• 前后端分离架构
• Vue和后端开发实战

课程目录

若依框架系列视频教程(RuoYi-Vue前后端分离版本)必看.png  [493.5 KB]
43 定时任务代码详解.mp4  [147.9 MB]
44 服务监控讲解.mp4  [39.6 MB]
05 开发环境运行.mp4  [34.8 MB]
25 数据源配置详解.mp4  [59.2 MB]
02 项目运行.mp4  [54.4 MB]
37 数据权限代码详解.mp4  [72.3 MB]
07 目录文件介绍.mp4  [65.5 MB]
56 vue.config.js详解.mp4  [98.9 MB]
40 代码生成使用(树表).mp4  [47.6 MB]
60 侧边栏.mp4  [60.0 MB]
18 JWT 实现.mp4  [72.0 MB]
26 数据源代码详解.mp4  [46.8 MB]
04 系统菜单介绍.mp4  [64.4 MB]
30 多数据源代码详解.mp4  [19.5 MB]
87 3.0版本更新介绍.mp4  [134.0 MB]
19 JWT 过滤器.mp4  [34.6 MB]
114 限流控制详解.mp4  [37.6 MB]
65 路由跳转的两种方式.mp4  [13.4 MB]
32 事务使用.mp4  [100.5 MB]
64 scoped样式穿透.mp4  [15.1 MB]
113 3.6.0版本更新介绍.mp4  [113.1 MB]
22 分页配置详解.mp4  [64.8 MB]
53 下载详解.mp4  [29.6 MB]
38 数据权限业务实现.mp4  [80.2 MB]
108 实现数据库密码加密.mp4  [29.3 MB]
52 上传详解.mp4  [58.7 MB]
104 实现swagger文档增强.mp4  [14.8 MB]
59 导航栏.mp4  [54.4 MB]
67 开发规范&流程.mp4  [32.3 MB]
102 使用undertow容器.mp4  [23.3 MB]
70 注册组件.mp4  [31.3 MB]
68 请求流程.mp4  [54.5 MB]
107 实现离线IP地址定位.mp4  [35.4 MB]
84 2.3版本更新介绍.mp4  [121.4 MB]
55 package.json详解.mp4  [52.2 MB]
110 实现分库分表.mp4  [75.8 MB]
58 布局设置.mp4  [51.8 MB]
35 操作日志实现.mp4  [39.3 MB]
99 多数据源事务的一致性.mp4  [135.3 MB]
41 代码生成实现详解.mp4  [152.2 MB]
112 使用docker实现一键部署.mp4  [95.5 MB]
72 页面权限.mp4  [68.9 MB]
33 登录日志.mp4  [51.3 MB]
96 静态资源整合到后端访问.mp4  [64.0 MB]
20 Mybatis配置详解.mp4  [61.9 MB]
82 集成Oauth2.0.mp4  [98.2 MB]
57 main.js详解.mp4  [52.2 MB]
103 实现优雅关闭应用.mp4  [13.4 MB]
10 Spring Security 简介.mp4  [18.4 MB]
03 构建发布到Linux.mp4  [41.7 MB]
12 Spring Security 密码加密.mp4  [54.9 MB]
51 日志配置详解.mp4  [54.7 MB]
111 3.5.0版本更新介绍.mp4  [122.1 MB]
01 项目概述.mp4  [82.3 MB]
62 顶部栏.mp4  [37.7 MB]
61 侧边栏默认展开.mp4  [11.3 MB]
63 scoped作用域.mp4  [11.2 MB]
08 主配置文件介绍.mp4  [69.6 MB]
11 Spring Security 配置介绍.mp4  [40.0 MB]
31 事务简介.mp4  [23.8 MB]
91 3.1版本更新介绍.mp4  [162.9 MB]
71 组件通信.mp4  [20.2 MB]
83 构建发布到Tomcat.mp4  [40.0 MB]
54 前端框架介绍.mp4  [41.3 MB]
36 数据权限使用详解.mp4  [49.4 MB]
86 开发自己的业务(多模块).mp4  [32.5 MB]
92 部署应用到子路径.mp4  [35.0 MB]
97 3.3.0版本更新介绍.mp4  [153.6 MB]
29 新增多数据源(不同数据库).mp4  [55.9 MB]
09 Spring Boot 简介.mp4  [32.7 MB]
34 操作日志详解.mp4  [65.8 MB]
88 文件上传(前端).mp4  [68.0 MB]
116 3.8.0版本更新介绍.mp4  [174.7 MB]
47 XSS脚本过滤详解.mp4  [48.8 MB]
105 实现excel表格增强.mp4  [45.8 MB]
23 分页插件使用.mp4  [33.9 MB]
50 框架验证详解.mp4  [31.8 MB]
93 3.2版本更新介绍.mp4  [129.7 MB]
74 页签缓存.mp4  [30.9 MB]
77 使用字典(dicts方式).mp4  [55.2 MB]
66 动态路由的跳转方式.mp4  [13.8 MB]
106 实现mybatis增强.mp4  [67.4 MB]
117 3.8.1版本更新介绍.mp4  [143.1 MB]
78 使用参数.mp4  [17.2 MB]
101 3.4.0版本更新介绍.mp4  [122.8 MB]
16 Spring Security 权限注解.mp4  [62.0 MB]
28 新增多数据源(相同数据库).mp4  [34.4 MB]
98 使用加密方式传输密码.mp4  [67.6 MB]
27 多数据源使用.mp4  [36.7 MB]
42 定时任务使用详解.mp4  [84.9 MB]
75 使用图标.mp4  [39.7 MB]
14 Spring Security 登录配置.mp4  [51.8 MB]
49 全局异常处理器.mp4  [35.5 MB]
45 系统接口使用详解.mp4  [31.2 MB]
24 分页代码详解.mp4  [34.1 MB]
94 禁止多终端同时登录实现.mp4  [85.6 MB]
81 开发文档介绍和部署.mp4  [66.0 MB]
46 系统接口实现详解.mp4  [98.8 MB]
69 引入依赖.mp4  [21.1 MB]

适合人群

  • Vue开发者
  • 后端开发者
  • 全栈工程师

学习收获

掌握RuoYi-Vue框架
实现前后端分离开发
提升项目开发效率

祝您学习愉快!

学有所成,前程似锦!