前后端分离Blog系统,基于 Spring Boot + Vue 前后端分离博客前端
- 核心框架:Spring Boot
- 安全框架:Spring Security
- Token 认证:jjwt
- 持久层框架:MyBatis
- 分页插件:PageHelper
- NoSQL缓存:Redis
- Markdown 转 HTML:commonmark-java
- 离线 IP 地址库:ip2region
- 定时任务:quartz
- UserAgent 解析:yauaa
邮件模板参考自Typecho-CommentToMail-Template
基于 JDK8 开发,8以上要添加依赖:
<dependency>
<groupId>javax.xml.bind</groupId>
<artifactId>jaxb-api</artifactId>
<version>2.3.0</version>
</dependency>
核心框架:Vue2.x、Vue Router、Vuex
Vue 项目基于 @vue/cli4.x 构建
JS 依赖及参考的 css:axios、moment、nprogress、v-viewer、prismjs、APlayer、MetingJS、lodash、mavonEditor、echarts、tocbot、iCSS
Element UI:后台 CMS 部分完全基于 Element UI 开发
Semantic UI:主要使用,页面布局样式,语义化的 css,该框架 Vue 版的开发完成度不高,见 Semantic UI Vue
Element UI:部分使用,一些小组件,弥补了 Semantic UI 的不足,便于快速实现效果
文章排版:基于 typo.css 修改
- 创建 MySQL 数据库
blog
,并运行blog.sql
初始化表数据 - 修改配置信息
blog-api/src/main/resources/application.yml
- 安装 Redis 并启动
- 启动后端SpringBoot服务
- 分别在
blog-ms
和blog-view
目录下执行npm install
安装依赖 - 分别在
blog-ms
和blog-view
目录下执行npm run serve
启动前后台页面
- 本人使用的 MySQL 版本为5.5.61
- 数据库中默认用户名密码为
admin
,admin
,因为是个人博客,没打算做修改密码的页面,可在util.HashUtils
下的main
方法手动生成密码存入数据库 - 注意修改
application-dev.yml
的配置信息- Redis 若没有密码,留空即可
- 注意修改
token.secretKey
,否则无法保证 token 安全性