一、前言

主要通过SpringBoot和Vue来实现一个前后端分离的在线工具平台,包含PDF转换、图片处理、文本处理、图表展示、二维码工具等功能。

为了更直观展示项目效果,也给大家提供了在线体验地址:​​http://49.234.28.149​​, 源码资源见文末。

通过此项目大家可以了解和学习到以下知识,包括但不限于:

  • springboot + mybatis + mysql 等后端知识
  • 基础的前后端增删改查交互流程
  • 前端如何请求后端接口
  • 前端如何请求三方接口
  • 前端请求拦截器实现
  • 前端组件的封装&使用
  • 动态权限菜单实现
  • 打字机效果实现
  • 爬虫实现
  • 悬浮球实现
  • 文件流操作
  • 抽奖效果
  • 滚动字幕效果
  • excel导入&导出
  • 前后端分离项目打包部署生产环境全流程

二、开发栈

前端
开发工具:IDEA + vue.js插件
开发框架:Vue CLI 2.0
包管理工具: npm
依赖打包:webpack

后端
开发工具:IDEA
开发框架:SpringBoot + MyBatis
依赖打包:Maven
数据库: MySQL

三、项目截图(部分)

SpringBoot 和 Vue前后端分离在线工具项目实战,源码+超详细讲解_spring

SpringBoot 和 Vue前后端分离在线工具项目实战,源码+超详细讲解_spring boot_02

SpringBoot 和 Vue前后端分离在线工具项目实战,源码+超详细讲解_java_03

SpringBoot 和 Vue前后端分离在线工具项目实战,源码+超详细讲解_java_04

SpringBoot 和 Vue前后端分离在线工具项目实战,源码+超详细讲解_vue.js_05


SpringBoot 和 Vue前后端分离在线工具项目实战,源码+超详细讲解_ide_06


SpringBoot 和 Vue前后端分离在线工具项目实战,源码+超详细讲解_java_07

四、项目规划

  1. 丰富在线工具种类:项目的特点是业务边界是那么绝对,各种工具都可以继续迭代添加上去
  2. 埋点信息:对每个工具进行埋点信息搜集统计,可以评估每个工具的使用情况

五、项目详细教程&源码地址

​https://www.bilibili.com/video/BV1mg41167Lh?spm_id_from=333.337.search-card.all.click​

讲解详细,资料齐全。