- clone 项目,加载 maven。
- 还原数据库,导入 sql 文件夹下的 light-blog.sql 文件。
- 运行,大功告成。
- frontend-design 文件夹下为原型设计图及设计好的原始 HTML 文件,需要自取。
- 如果觉得有用欢迎 follow & star 哦~
技术组合:
- 后端:Spring Boot + JPA + thymeleaf模板
- 数据库:MySQL
- 前端UI:Semantic UI框架
工具与环境:
- IDEA
- Maven 3
- JDK 8
- Axure RP 8
课程内容模块:
- 需求分析与功能规划
- 页面设计与开发
- 技术框架搭建
- 后端管理功能实现
- 前端管理功能实现
你能学得什么?
- 基于Spring Boot的完整全栈式的开发套路
- Semantic UI框架的使用
- 一套博客系统的源代码与设计
用户故事是敏捷框架中的一种开发方法。可以帮助开发者转换视角,以用户的角度更好的把握需求,从而实现具有商业价值的功能。
用户故事最好是用户团队编写
用户故事模板:
- As a (role of user), I want (some feature) so that (some business value).
- 作为一个(某个角色) 使用者,我可以做(某个功能) 事情,如此可以有(某个商业价值) 的好处
关键点:角色、功能、商业价值
举例:
- 作为一个招聘网站注册用户,我想查看最近3天发布的招聘信息,以便于了解最新的招聘信息。
- 作为公司,可以张贴新工作。
个人博客系统的用户故事:
角色:普通访客,管理员(我)
- 访客,可以分页查看所有的博客
- 访客,可以快速查看博客数最多的6个分类
- 访客,可以查看所有的分类
- 访客,可以查看某个分类下的博客列表
- 访客,可以快速查看标记博客最多的10个标签
- 访客,可以查看所有的标签
- 访客,可以查看某个标签下的博客列表
- 访客,可以根据年度时间线查看博客列表
- 访客,可以快速查看最新的推荐博客
- 访客,可以用关键字全局搜索博客
- 访客,可以查看单个博客内容
- 访客,可以对博客内容进行评论
- 访客,可以赞赏博客内容
- 访客,可以微信扫码阅读博客内容
- 访客,可以在首页扫描公众号二维码关注我
- 我,可以用户名和密码登录后台管理
- 我,可以管理博客
- 我,可以发布新博客
- 我,可以对博客进行分类
- 我,可以对博客打标签
- 我,可以修改博客
- 我,可以删除博客
- 我,可以根据标题,分类,标签查询博客
- 我,可以管理博客分类
- 我,可以新增一个分类
- 我,可以修改一个分类
- 我,可以删除一个分类
- 我,可以根据分类名称查询分类
- 我,可以管理标签
- 我,可以新增一个标签
- 我,可以修改一个标签
- 我,可以删除一个标签
- 我,可以根据名称查询标签
页面规划:
前端展示:首页、详情页、分类、标签、归档、关于我
后台管理:模板页
1、引入Spring Boot模块:
- web
- Thymeleaf
- JPA
- MySQL
- Aspects
- DevTools
2、application.yml配置
-
使用 thymeleaf 3
pom.xml:
<thymeleaf.version>3.0.2.RELEASE</thymeleaf.version>
<thymeleaf-layout-dialect.version>2.1.1</thymeleaf-layout-dialect.version>
application.yml:
spring:
thymeleaf:
mode: HTML
- 数据库连接配置
spring:
datasource:
driver-class-name: com.mysql.jdbc.Driver
url: jdbc:mysql://localhost:3306/light-blog?useUnicode=true&characterEncoding=utf-8
username: root
password:
jpa:
hibernate:
ddl-auto: update
show-sql: true
-
日志配置
application.yml:
logging:
level:
root: info
com.imcoding: debug
file: log/imcoding.log
logback-spring.xml:
<?xml version="1.0" encoding="UTF-8" ?>
<configuration>
<!--包含Spring boot对logback日志的默认配置-->
<include resource="org/springframework/boot/logging/logback/defaults.xml" />
<property name="LOG_FILE" value="${LOG_FILE:-${LOG_PATH:-${LOG_TEMP:-${java.io.tmpdir:-/tmp}}}/spring.log}"/>
<include resource="org/springframework/boot/logging/logback/console-appender.xml" />
<!--重写了Spring Boot框架 org/springframework/boot/logging/logback/file-appender.xml 配置-->
<appender name="TIME_FILE"
class="ch.qos.logback.core.rolling.RollingFileAppender">
<encoder>
<pattern>${FILE_LOG_PATTERN}</pattern>
</encoder>
<file>${LOG_FILE}</file>
<rollingPolicy class="ch.qos.logback.core.rolling.TimeBasedRollingPolicy">
<fileNamePattern>${LOG_FILE}.%d{yyyy-MM-dd}.%i</fileNamePattern>
<!--保留历史日志一个月的时间-->
<maxHistory>30</maxHistory>
<!--
Spring Boot默认情况下,日志文件10M时,会切分日志文件,这样设置日志文件会在100M时切分日志
-->
<timeBasedFileNamingAndTriggeringPolicy class="ch.qos.logback.core.rolling.SizeAndTimeBasedFNATP">
<maxFileSize>10MB</maxFileSize>
</timeBasedFileNamingAndTriggeringPolicy>
</rollingPolicy>
</appender>
<root level="INFO">
<appender-ref ref="CONSOLE" />
<appender-ref ref="TIME_FILE" />
</root>
</configuration>
- 生产环境与开发环境配置
- application-dev.yml
- application-pro.yml
1、定义错误页面
- 404
- 500
- error
2、全局处理异常
统一处理异常:
@ControllerAdvice
public class ControllerExceptionHandler {
private final Logger logger = LoggerFactory.getLogger(ControllerExceptionHandler.class);
/**
* 异常处理
* @param request
* @param e
* @return
*/
@ExceptionHandler({Exception.class})
public ModelAndView handleException(HttpServletRequest request, Exception e) throws Exception {
logger.error("Request URL : {} , Exception : {}", request.getRequestURL(), e);
if (AnnotationUtils.findAnnotation(e.getClass(), ResponseStatus.class) != null) {
throw e;
}
ModelAndView mav = new ModelAndView();
mav.addObject("url", request.getRequestURL());
mav.addObject("exception", e);
mav.setViewName("error/error");
return mav;
}
}
错误页面异常信息显示处理:
<div>
<div th:utext="'<!--'" th:remove="tag"></div>
<div th:utext="'Failed Request URL : ' + ${url}" th:remove="tag"></div>
<div th:utext="'Exception message : ' + ${exception.message}" th:remove="tag"></div>
<ul th:remove="tag">
<li th:each="st : ${exception.stackTrace}" th:remove="tag"><span th:utext="${st}" th:remove="tag"></span></li>
</ul>
<div th:utext="'-->'" th:remove="tag"></div>
</div>
3、资源找不到异常
@ResponseStatus(HttpStatus.NOT_FOUND)
public class NotFoundExcepiton extends RuntimeException {
public NotFoundExcepiton() {
}
public NotFoundExcepiton(String message) {
super(message);
}
public NotFoundExcepiton(String message, Throwable cause) {
super(message, cause);
}
}