基于SpringBoot和Vue实现的个人博客网站快速搭建(已开源)

JDK = 1.8 MySQL >= 5.7Maven >= 3.0Redis >= 6.0IntelliJ IDEA Xshell MySQL图形化操分别将前后端项目打包(jar、dist)将dist丢到nginx里，并配置nginx修改Dockerfile以及docker-compose.yml文件执行docker build -t myblog:1.0 .docker imagesdocke

Slcp

1197人浏览 · 2022-07-13 17:31:34

Slcp · 2022-07-13 17:31:34

在这里插入图片描述
Hello，你好呀，我是小炜，一个对生活追求诗意的程序猿。

上图是什么鬼？这个嘛，饿，总之Slcp v1.0 发布啦！！！

🎉Slcp v1.0 发布啦。

🌍
English ∙ 简体中文

github：获取源码

下载太慢？没事，GitHub加速插件
温馨提示：一定要点进去，该网站爽到爆炸，一个字相见恨晚

SlcpBlog：页面展示

基于SpringBoot 和 vue，实现的博客系统

前言

一直有小伙伴问我要代码，不是我不发而是代码真的out，我不知我大一怎么想能写出那样的代码。总之，看了让人不言而喻🤡。这段时间比较空闲，然后就对代码进行了大改并且加了redis缓存等等一系列功能，我就不一列举了哈。

好了，废话不多说，上车~

主要功能：

前端

后台管理系统采用Vue开发。
文章模块，支持文章内容、分类、标签对文章进行快速搜索，并且文本编辑支持Markdown。
首页模块，支持侧边栏模块、最新文章以及最热文章展示。
悠闲娱乐模块，支持听歌、相册等。
在线算法模块，可进行在线刷题以及题型分享功能等。
评论模块，所有文章都可进行评论，以及评论的邮件提醒。
实现留言板和友链展示，以及图库(给爱摄影的小伙伴们)。
集成了动态诗歌，生活不能没有诗意。
还有…

后端

后端是采用Spring boot实现。
拥有 Restful 风格的 Api，并且后台接口采用优美代码写法。
拥有图床功能，并且实现获取随机图片(当你在编写文章忘记赋予图片时,会给你温馨的添上)。
拥有发送QQ邮箱功能，给你的爱人每天定时发送彩虹屁哈哈哈。
拥有获取随机诗词功能，生活不能没有诗意。
拥有评论功能，当然后端功能是实现的哦，不过我最终改为了插件～
集成QQ登录以及支付宝支付功能，不过感觉后来用不上，代码就留在那了。
支持Redis缓存(基于注解实现，代码值得一看哈，说不定就因此涨薪了)。
还有…

基本环境

windows环境需求

后端

JDK = 1.8
MySQL >= 5.7
Maven >= 3.0
Redis >= 6.0
IntelliJ IDEA
Xshell
MySQL图形化操作工具

前端

Node.js
VsCode 前端工具
VUE

温馨提示:
该前端选项是可选，若不整合vue，可直接跳过前端(基于vue的后台管理系统，是我以前玩的出勤异常项目，目前还未完全替换本项目的后台管理，主要是本项目的后台太丑了! 我也不知道当时大一的我是怎么想的🤡)

JDK = 1.8

在官方网站上下载1.8版本中的最新版，下载完成后安装即可。

下载地址：https://www.oracle.com/java/technologies/javase/javase-jdk8-downloads.html
```
#环境变量配置(现在默认会自动配置好)
略

#打开CMD命令行工具，检查是否配置成功
java -version
```
Maven >= 3.0

从Maven官方网站上下载最新版的压缩包。

下载地址：https://maven.apache.org/download.cgi
```
#环境变量配置
略

#打开CMD命令行工具，检查是否配置成功
mvn -v
```
Mysql >= 5.7(最新版即可)

安装教程：https://www.runoob.com/mysql/mysql-install.html

下载地址：https://dev.mysql.com/downloads/mysql/

访问Mysql的可视化数据库开发工具： Navicat Premium 工具的安装教程可自行百度搜索。
Redis

下载地址：https://redis.io/download/

安装教程：解压，配置(密码，默认无密码)
```
#快捷启动命令.bat
redis-server.exe redis.windows.conf
pause
```
IntelliJ IDEA

安装教程：https://blog.csdn.net/Sunshine_Mr_Sun/article/details/123891067
Xshell

安装教程：https://blog.csdn.net/Sunshine_Mr_Sun/article/details/124320972
VSCode

下载地址：https://code.visualstudio.com/
Node.js

安装教程：https://www.runoob.com/nodejs/nodejs-install-setup.html

运行

后端启动步骤

启动数据库
创建对于的库和表
idea导入项目
配置yaml
启动redis
启动成功

温馨提示：

1.sql文件已提供，只需执行即可。myblog.sql

2.将项目导入idea(本项目使用的工具是idea，如果你用的ecplise一样可以使用，毕竟百度无所不能)

3.启动之前记得修改yml(连接数据库和redis的配置)

4.若控制台打印出访问路径，即OK

前端启动步骤

#打开windows命令行窗口，进入项目目录
cd 路径/topicUI

#强烈建议不要用直接使用 cnpm 安装，会有各种诡异的 bug，可以通过重新指定 registry 来解决 npm 安装速度慢的问题。
npm install --registry=https://registry.npm.taobao.org

#启动项目
npm run dev

打开浏览器，输入：http://localhost:81