基于Springboot和Vue前后端分离的博客项目

基于Springboot和Vue前后端分离的博客项目 1,项目简介 1,1 前言 学习Java也有一段时间,期间更多的是理论的学习和一些Demo代码编写

本文包含相关资料包-----> 点击直达获取<-------

基于Springboot和Vue前后端分离的博客项目

1.项目简介

1.1 前言

学习Java也有一段时间,期间更多的是理论的学习和一些Demo代码编写,知识还比较分散、浅薄,所以我做了这么一个实战项目,把已学的知识应用到实践中,通过从零实现一个完整项目,建立一个Java Web应用开发的基本认知,同时也能更加深入的理解各个技术的细节。除此之外,也是为了锻炼自己的编码能力和遇到问题的解决能力。

这个是我第一个练手的SpringBoot小项目,以前学习写的都是一些小Demo,所以这个项目在各方面可能都还很稚嫩,欢迎大家多多指教。如果本项目对您有帮助,可以点个赞鼓励一下,谢谢。

另外,本文只是对项目做一个简单的介绍,如果后续有时间或者有必要,我会复盘出一个比较详细的系列文章。

作者是文章写作小白,如文章结构混乱,语言不通,请见谅,我会学习并慢慢进步的。

1.2 项目介绍

MyBlog主要是基于 SpringBoot + Vue 前后端分离开发的一款动态个人博客系统,后台和前台均通过JSON数据做交互,主要功能有文章管理、分类管理、标签管理、附件管理、评论管理、友链管理、个人资料/博客信息管理等。

1.3 技术栈

前端采用 Vue2.9.6 绘制页面,博客样式借鉴李仁密的小而美博客,涉及到的技术点为:

  • router路由

  • filter全局过滤器

  • service代码封装

  • axios异步请求

  • Restful风格请求

  • layer弹窗

  • semantic美化框架

  • aes加解密

  • markdorn编辑器集成

  • tocbot目录生成

  • highlight.js代码高亮

后端采用的是 Springboot2.4.0 编写后台,涉及到的技术点为:

  • MyBatisPlus持久化框架

  • Restful风格请求

  • AOP实现的AES加解密

  • @ControllerAdvice实现的AES解密

  • 全局异常处理

  • JWT登录验证

  • 跨域请求处理

  • 七牛云、阿里云对象存储

  • Markdown转HTML

2.数据库设计

2.1 表结构设计

博客表

字典表

友情链接表

留言表

类型表

2.2 E-R图

3.项目实现

3.1 业务代码

```java @AESDecrypt @GetMapping("/blog") public R selectList(@RequestParam HashMap param) { // 获取参数 Integer pageNum = BlogUtil.objToInt(param.get("pageNum")); Integer pageSize = BlogUtil.objToInt(param.get("pageSize")); Integer commend = BlogUtil.objToInt(param.get("commend")); String typeId = param.get("typeId").toString(); String title = param.get("title").toString(); commend = commend == 0 ? null : commend; typeId = typeId.equals("0") ? null : typeId; // 查询所有博客列表 PageInfo info = blogService.selectListByWrapperPage(pageNum, pageSize, title, typeId, commend); // 查询所有分类列表 List types = typeService.selectList(); return R.success("博客列表获取成功") .setAttribute("info", info) .setAttribute("types", types); }

@GetMapping("/blog/{id}") public R selectOneBlog(@PathVariable String id) { BlogEntity entity = blogService.adminSelectOneById(id); List types = typeService.selectList(); return R.success("博客获取成功!") .setAttribute("blog", entity) .setAttribute("types", types); }

@AESDecrypt @DeleteMapping("/blog") public R deleteById(@RequestParam HashMap param) { String id = param.get("id").toString(); blogService.deleteById(id); return R.success("删除成功!"); }

@AESDecrypt @PostMapping("/blog") public R releaseBlog(@RequestBody BlogEntity entity) { blogService.releaseBlog(entity); return R.success("博客发布成功!"); }

@PutMapping("/blog/{id}/release/{release}") public R updateRelease( @PathVariable String id, @PathVariable Integer release) { BlogEntity entity = new BlogEntity(); entity.setId(id); entity.setRelease(release); blogService.updateRelease(entity); return R.success("发布状态更新成功!"); }

@PutMapping("/blog/{id}/commend/{commend}") public R updateCommend( @PathVariable String id, @PathVariable Integer commend) { BlogEntity entity = new BlogEntity(); entity.setId(id); entity.setCommend(commend); blogService.updateCommend(entity); return R.success("推荐状态更新成功!"); }

@AESDecrypt @PutMapping("/blog") public R updateBlog(@RequestBody BlogEntity entity) { blogService.updateBlog(entity); return R.success("博客更新成功!"); } ```

3.2 前端代码

```html template>

# 标题 分类 发布时间 操作
{{index+1}} {{item.title}} {{item.typeName}} {{item.createTime | dateFormat}} 编辑 推荐 撤销 发布 下架 删除

```

4.项目展示

4.1 用户访问页面

主页

分类

留言板

作者信息

搜索功能

查看博客

4.2 管理员页面

登录

首页

添加博客

分类管理

留言管理

系统设置

5.部署网站

  • 执行blog.sql创建数据库表

  • 修改一些配置信息

  • Springboot
    • application.yml中的数据库连接配置
    • utils包下的AES秘钥
    • utils包下的OSS对象存储配置(七牛、阿里)
  • Vue

    • service下的constant中的AES秘钥
    • service下的constant中的请求地址
  • 执行 npm run build 将vue项目进行打包,然后放到Springboot的 public 目录下,就大功告成了

参考文献

  • 基于Web前端组件化的个人博客系统的设计与实现(华中科技大学·曾广海)
  • 集成WSH架构技术的Web应用研究与实现(西南交通大学·马崇启)
  • 基于Spring Boot的校园轻博客系统的设计与实现(华中科技大学·邓笑)
  • 基于Spring Boot的多用户博客系统的设计研究(青海师范大学·罗涛)
  • 基于SSH2的轻博客系统的研究与实现(吉林大学·杨雪梅)
  • 基于Spring Boot的校园轻博客系统的设计与实现(华中科技大学·邓笑)
  • 基于Spring Boot的校园轻博客系统的设计与实现(华中科技大学·邓笑)
  • 基于SSH2的轻博客系统的研究与实现(吉林大学·杨雪梅)
  • 基于个性化搜索推荐的技术论坛的设计与实现(吉林大学·赵佳慧)
  • 一种Web应用框架的设计与实现(·河北师范大学)
  • 基于J2EE的Web应用研究(河海大学·朱春江)
  • 基于SSH框架模式的博客系统的设计与实现(西北师范大学·王刚成)
  • 基于Web前端组件化的个人博客系统的设计与实现(华中科技大学·曾广海)
  • 基于SSH框架模式的博客系统的设计与实现(西北师范大学·王刚成)
  • 基于SSH2的轻博客系统的研究与实现(吉林大学·杨雪梅)

本文内容包括但不限于文字、数据、图表及超链接等)均来源于该信息及资料的相关主题。发布者:毕设助手 ,原文地址:https://m.bishedaima.com/yuanma/35532.html

相关推荐

  • 基于SpringBoot框架的美食推荐商城

    这是一个采用Java编程语言,基于SpringBoot框架构建的美食推荐电商平台的源代码项目,该项目运用了SpringBoot和Vue技术栈,适用于Idea或Eclipse开发环境
    2024年05月23日
    5 1 2
  • 基于JSP实现的校园师生交流系统

    基于JSP实现的校园师生交流系统 第1章 课设任务 1,1 课程题目 师生交流系统的设计与开发 1,2 课设目的 复习,巩固JavaWeb的基础知识
    2024年05月14日
    12 1 3
  • 精准扶贫管理系统

    这是一个🔥🔥基于SpringBoot框架的精准扶贫管理系统设计与实现🔥🔥的项目源码,开发语言Java,框架使用的SpringBoot+vue技术,开发环境Idea/Eclipse
    2024年05月23日
    2 1 2
  • 基于python实现的消消乐记分小游戏

    基于python实现的消消乐记分小游戏 1,文件结构规划 定义config,py文件存储相关参数:包括界面的宽高,整个方格行列个数,总格数等等
    2024年05月14日
    1 1 1
  • 学生心理咨询评估系统

    这是一个🔥🔥基于SpringBoot框架的学生心理咨询评估系统设计与实现🔥🔥的项目源码,开发语言Java,框架使用的SpringBoot+vue技术,开发环境Idea/Eclipse
    2024年05月23日
    2 1 1
  • 基于springboot的办公oa系统实现源代码

    在当今数字化时代,办公自动化系统(OA)已成为企业提升运行效率,管理流程的重要工具,随着信息技术的不断发展,基于Spring Boot的办公OA系统的开发变得愈发重要,该系统集成了MySQL数据库
    2024年05月07日
    5 1 2
  • 基于JSP+Servlet+Sqlserver的影视论坛交流网站毕设(源码+论文+任务书+中期报告+答辩PPT)

    项目背景: 随着互联网的发展,电影产业也逐渐成为人们生活中不可或缺的一部分,电影创作者之间的交流与合作日益频繁,因此建立一个电影创作者交流论坛网站具有重要意义,本论文旨在利用JSP+Servlet+Sqlserver等技术
    2024年05月07日
    10 1 3
  • 基于ssm框架的在线医院挂号系统

    HospitalSystem 参考文献 医疗挂号系统服务端的设计与实现(北京邮电大学·郑朝杰) 基于MVC模式的医院预约挂号管理系统的设计与实现(广西大学·戴铭孚) 基于SSM的综合医养平台的设计与实现(吉林大学·宋恩旭) 网上预约挂号系统的设计与实现(华中科技大学·游国强) 基于Android平台的预约挂号系统的设计与实现(江西财经大学·赵震) 在线医疗管理系统的研究与实现(辽宁科技大学·薄翔) 基于J2EE架构的医疗信息服务平台的设计与实现(北京交通大学·张颖彬) 医疗挂号系统运营支撑平台的设计与实现(北京邮电大学·孟祥建) 基于Android平台的预约挂号系统的设计与实现(江西财经大学·赵震) 基于J2EE架构的医疗信息服务平台的设计与实现(北京交通大学·张颖彬) 基于
    2024年05月14日
    5 1 1
  • Java+SSH框架实现论坛系统、javaweb+mysql

    这是一个🔥🔥SSH框架实现论坛系统,javaweb+mysql🔥🔥的项目源码,开发语言Java,开发环境Idea/Eclipse,这个 框架实现论坛系统开发技术栈为SSH项目
    2024年05月23日
    2 1 1
  • 求解多极小函数之Python

    求解多极小函数 求解多极值函数问题中,我们需要求出函数的最值,我们以函数 f(x0,x1) = x1sin(x0) x0 cos(x1) 为例,求它在 x0,x1 ∈ [10
    2024年05月14日
    1 1 1

发表回复

登录后才能评论