页面展示：（管理后台）

页面展示：（移动端应用界面）

管理端产品原型：

用户端产品原型：

Ⅰ、创建数据库：

Ⅱ、导入表结构：

Ⅲ、数据表说明：

Ⅰ、创建一个 Maven 项目：

- 检查maven仓库配置：

- 检查 JDK 配置：

Ⅱ、导入 pom.xml 文件：

Ⅲ、导入 application.yml 配置文件：

Ⅳ、编写启动类：（com.itheima.reggie）

运行启动：

Ⅴ、导入前端静态页面：

Note：但由于在默认情况下，静态资源一般是放在 static\ public \ templates，如果不将前端资源存放在以上目录中，那么我们在启动项目，使用 Tomcat 服务器时也将访问不到这些资源。

Solution：我们可以通过一个配置类的方法来解决这种 资源映射 的问题。

示例：创建config类（MyWebMvcConfig）

这段代码意思就配置一个拦截器， 如果访问路径是 addResourceHandler 中的 filepath 这个路径 那么就 映射到访问本地的 addResourceLocations 的参数的这个路径上，这样就可以让别人访问服务器的本地文件了，比如本地图片或者本地音乐视频什么的。

Ⅵ、编写配置类（WebMvcConfig），来实现指定静态资源映射：

Note：在 SpringBoot 中自定义静态资源位置和映射

参考资料：Spring Boot 中的静态资源到底要放在哪里？

在 Spring Boot 中，默认情况下，一共有5个位置可以放静态资源，五个路径分别是如下5个：

• classpath:/META-INF/resources/
• classpath:/resources/
• classpath:/static/
• classpath:/public/
• /

前四个目录好理解，分别对应了resources目录下不同的目录，第5个 / 是啥意思呢？我们知道，在 Spring Boot 项目中，默认是没有 webapp 这个目录的，当然我们也可以自己添加（例如在需要使用JSP的时候），这里第5个 / 其实就是表示 webapp 目录中的静态资源也不被拦截。如果同一个文件分别出现在五个目录下，那么优先级也是按照上面列出的顺序。

而 SpringBoot 在配置文件中定义的方式比较简单，如下：

第一种方式：（application.properties）

spring.resources.static-locations=classpath:/

spring.mvc.static-path-pattern=/**

第一行配置表示定义资源位置，第二行配置表示定义请求 URL 规则。

以上文的配置为例，如果我们这样定义了，表示可以将静态资源放在 resources 目录下的任意地方，我们访问的时候当然也需要写完整的路径，例如在 resources/static目录下有一张名为1.png 的图片，那么访问路径就是 http://localhost:8080/static/1.png

当然，在Spring Boot中我们也可以通过 Java代码来自定义，方式和上面的配置类形式相同：

第二种方式：Java配置类（config）