diff --git a/.gitignore b/.gitignore
index aca12b5..c8b6e85 100644
--- a/.gitignore
+++ b/.gitignore
@@ -32,6 +32,6 @@ build/
 
 ### nodejs ###
 /src/main/webapp/dist
-/src/main/webapp/node_modules
+node_modules
 /src/main/resources/static
 /src/main/webapp/package-lock.json
diff --git a/pom.xml b/pom.xml
index da24d9f..5d9ed71 100644
--- a/pom.xml
+++ b/pom.xml
@@ -67,6 +67,7 @@
     </dependencies>
 
     <build>
+        <finalName>${artifactId}</finalName>
         <plugins>
             <plugin>
                 <groupId>org.springframework.boot</groupId>
diff --git a/sql/xiaohh_vue.sql b/sql/xiaohh_vue.sql
new file mode 100644
index 0000000..a36daeb
--- /dev/null
+++ b/sql/xiaohh_vue.sql
@@ -0,0 +1,58 @@
+/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
+/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
+/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
+/*!50503 SET NAMES utf8mb4 */;
+/*!40103 SET @OLD_TIME_ZONE=@@TIME_ZONE */;
+/*!40103 SET TIME_ZONE='+00:00' */;
+/*!40014 SET @OLD_UNIQUE_CHECKS=@@UNIQUE_CHECKS, UNIQUE_CHECKS=0 */;
+/*!40014 SET @OLD_FOREIGN_KEY_CHECKS=@@FOREIGN_KEY_CHECKS, FOREIGN_KEY_CHECKS=0 */;
+/*!40101 SET @OLD_SQL_MODE=@@SQL_MODE, SQL_MODE='NO_AUTO_VALUE_ON_ZERO' */;
+/*!40111 SET @OLD_SQL_NOTES=@@SQL_NOTES, SQL_NOTES=0 */;
+
+DROP DATABASE IF EXISTS `xiaohh_vue`;
+CREATE DATABASE `xiaohh_vue` CHARACTER SET 'utf8mb4' COLLATE 'utf8mb4_unicode_ci';
+USE `xiaohh_vue`;
+
+/*!40101 SET @saved_cs_client     = @@character_set_client */;
+/*!50503 SET character_set_client = utf8mb4 */;
+CREATE TABLE `vue_notice` (
+  `notice_id` bigint unsigned NOT NULL AUTO_INCREMENT COMMENT '消息ID',
+  `notice_title` varchar(256) NOT NULL COMMENT '通知标题',
+  `notice_content` varchar(1024) NOT NULL COMMENT '通知内容',
+  `notice_time` datetime NOT NULL DEFAULT CURRENT_TIMESTAMP COMMENT '通知发送时间',
+  PRIMARY KEY (`notice_id`)
+) ENGINE=InnoDB AUTO_INCREMENT=5 DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_0900_ai_ci COMMENT='通知消息表';
+/*!40101 SET character_set_client = @saved_cs_client */;
+
+LOCK TABLES `vue_notice` WRITE;
+/*!40000 ALTER TABLE `vue_notice` DISABLE KEYS */;
+INSERT INTO `vue_notice` VALUES (1,'重磅消息','就是不告诉你',SYSDATE()),(2,'重磅消息2','就是不告诉你2',SYSDATE()),(3,'重磅消息3','就是不告诉你3',SYSDATE()),(4,'重磅消息4','就是不告诉你4',SYSDATE());
+/*!40000 ALTER TABLE `vue_notice` ENABLE KEYS */;
+UNLOCK TABLES;
+
+/*!40101 SET @saved_cs_client     = @@character_set_client */;
+/*!50503 SET character_set_client = utf8mb4 */;
+CREATE TABLE `vue_user` (
+  `user_id` bigint unsigned NOT NULL AUTO_INCREMENT COMMENT '用户ID',
+  `username` varchar(128) NOT NULL COMMENT '用户名',
+  `birthday` date DEFAULT NULL COMMENT '生日',
+  `gender` tinyint unsigned NOT NULL DEFAULT '3' COMMENT '性别；1=男,2=女,3=保密',
+  `introduce` varchar(1024) NOT NULL DEFAULT '' COMMENT '自我介绍',
+  PRIMARY KEY (`user_id`)
+) ENGINE=InnoDB AUTO_INCREMENT=4 DEFAULT CHARSET=utf8mb4 COLLATE=utf8mb4_0900_ai_ci COMMENT='用户表';
+/*!40101 SET character_set_client = @saved_cs_client */;
+
+LOCK TABLES `vue_user` WRITE;
+/*!40000 ALTER TABLE `vue_user` DISABLE KEYS */;
+INSERT INTO `vue_user` VALUES (1,'XiaoHH','2000-02-10',1,'最帅的一个帅小伙'),(2,'DaHH','1998-02-10',1,'第二帅的一个帅小伙'),(3,'Luna','2002-02-10',2,'非常漂亮的一个小姑凉');
+/*!40000 ALTER TABLE `vue_user` ENABLE KEYS */;
+UNLOCK TABLES;
+/*!40103 SET TIME_ZONE=@OLD_TIME_ZONE */;
+
+/*!40101 SET SQL_MODE=@OLD_SQL_MODE */;
+/*!40014 SET FOREIGN_KEY_CHECKS=@OLD_FOREIGN_KEY_CHECKS */;
+/*!40014 SET UNIQUE_CHECKS=@OLD_UNIQUE_CHECKS */;
+/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
+/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
+/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;
+/*!40111 SET SQL_NOTES=@OLD_SQL_NOTES */;
diff --git a/src/main/java/work/xiaohh/vue/controller/VueNoticeController.java b/src/main/java/work/xiaohh/vue/controller/VueNoticeController.java
new file mode 100644
index 0000000..d86e5e5
--- /dev/null
+++ b/src/main/java/work/xiaohh/vue/controller/VueNoticeController.java
@@ -0,0 +1,46 @@
+package work.xiaohh.vue.controller;
+
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RestController;
+import work.xiaohh.vue.entity.VueNotice;
+import work.xiaohh.vue.service.VueNoticeService;
+
+import java.util.List;
+
+/**
+ * <p>
+ * 通知消息接口控制器
+ * </p>
+ *
+ * @author XiaoHH
+ * @version 1.0.0
+ */
+@RestController
+@RequestMapping("/api/notice")
+public class VueNoticeController {
+
+    /**
+     * 该 Bean 创建的时候注入需要的依赖
+     *
+     * @param vueNoticeService 通知消息业务服务接口
+     */
+    public VueNoticeController(VueNoticeService vueNoticeService) {
+        this.vueNoticeService = vueNoticeService;
+    }
+
+    /**
+     * 通知消息业务服务接口
+     */
+    private final VueNoticeService vueNoticeService;
+
+    /**
+     * 查询所有通知消息列表
+     *
+     * @return 通知消息列表
+     */
+    @GetMapping("/all")
+    public List<VueNotice> listAllNotice() {
+        return this.vueNoticeService.selectAllVueNotice();
+    }
+}
diff --git a/src/main/java/work/xiaohh/vue/controller/VueUserController.java b/src/main/java/work/xiaohh/vue/controller/VueUserController.java
new file mode 100644
index 0000000..7705666
--- /dev/null
+++ b/src/main/java/work/xiaohh/vue/controller/VueUserController.java
@@ -0,0 +1,46 @@
+package work.xiaohh.vue.controller;
+
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RestController;
+import work.xiaohh.vue.entity.VueUser;
+import work.xiaohh.vue.service.VueUserService;
+
+import java.util.List;
+
+/**
+ * <p>
+ * 用户接口控制器
+ * </p>
+ *
+ * @author XiaoHH
+ * @version 1.0.0
+ */
+@RestController
+@RequestMapping("/api/user")
+public class VueUserController {
+
+    /**
+     * 该 Bean 创建的时候注入需要的依赖
+     *
+     * @param vueUserService 用户业务服务层接口
+     */
+    public VueUserController(VueUserService vueUserService) {
+        this.vueUserService = vueUserService;
+    }
+
+    /**
+     * 用户业务服务层接口
+     */
+    private final VueUserService vueUserService;
+
+    /**
+     * 查询所有用户列表
+     *
+     * @return 用户列表
+     */
+    @GetMapping("/all")
+    public List<VueUser> listAllUser() {
+        return this.vueUserService.selectAllVueUserList();
+    }
+}
diff --git a/src/main/java/work/xiaohh/vue/entity/VueNotice.java b/src/main/java/work/xiaohh/vue/entity/VueNotice.java
new file mode 100644
index 0000000..900a1a3
--- /dev/null
+++ b/src/main/java/work/xiaohh/vue/entity/VueNotice.java
@@ -0,0 +1,92 @@
+package work.xiaohh.vue.entity;
+
+import com.fasterxml.jackson.annotation.JsonFormat;
+import org.springframework.format.annotation.DateTimeFormat;
+
+import java.io.Serial;
+import java.io.Serializable;
+import java.time.LocalDateTime;
+
+/**
+ * <p>
+ * 通知消息实体
+ * </p>
+ *
+ * @author XiaoHH
+ * @version 1.0.0
+ */
+public class VueNotice implements Serializable {
+
+    /**
+     * 序列化版本号
+     */
+    @Serial
+    private static final long serialVersionUID = 1L;
+    /**
+     * 消息ID
+     */
+    private Long noticeId;
+
+    /**
+     * 通知标题
+     */
+    private String noticeTitle;
+
+    /**
+     * 通知内容
+     */
+    private String noticeContent;
+
+    /**
+     * 通知发送时间
+     */
+    @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss")
+    @DateTimeFormat(pattern = "yyyy-MM-dd HH:mm:ss")
+    private LocalDateTime noticeTime;
+
+    public Long getNoticeId() {
+        return noticeId;
+    }
+
+    public VueNotice setNoticeId(Long noticeId) {
+        this.noticeId = noticeId;
+        return this;
+    }
+
+    public String getNoticeTitle() {
+        return noticeTitle;
+    }
+
+    public VueNotice setNoticeTitle(String noticeTitle) {
+        this.noticeTitle = noticeTitle;
+        return this;
+    }
+
+    public String getNoticeContent() {
+        return noticeContent;
+    }
+
+    public VueNotice setNoticeContent(String noticeContent) {
+        this.noticeContent = noticeContent;
+        return this;
+    }
+
+    public LocalDateTime getNoticeTime() {
+        return noticeTime;
+    }
+
+    public VueNotice setNoticeTime(LocalDateTime noticeTime) {
+        this.noticeTime = noticeTime;
+        return this;
+    }
+
+    @Override
+    public String toString() {
+        return "VueNotice{" +
+                "noticeId=" + noticeId +
+                ", noticeTitle='" + noticeTitle + '\'' +
+                ", noticeContent='" + noticeContent + '\'' +
+                ", noticeTime=" + noticeTime +
+                '}';
+    }
+}
diff --git a/src/main/java/work/xiaohh/vue/entity/VueUser.java b/src/main/java/work/xiaohh/vue/entity/VueUser.java
new file mode 100644
index 0000000..c374fc2
--- /dev/null
+++ b/src/main/java/work/xiaohh/vue/entity/VueUser.java
@@ -0,0 +1,108 @@
+package work.xiaohh.vue.entity;
+
+import com.fasterxml.jackson.annotation.JsonFormat;
+import org.springframework.format.annotation.DateTimeFormat;
+
+import java.io.Serial;
+import java.io.Serializable;
+import java.time.LocalDate;
+
+/**
+ * <p>
+ * 用户实体
+ * </p>
+ *
+ * @author XiaoHH
+ * @version 1.0.0
+ */
+public class VueUser implements Serializable {
+
+    /**
+     * 序列化版本号
+     */
+    @Serial
+    private static final long serialVersionUID = 1L;
+
+    /**
+     * 用户ID
+     */
+    private Long userId;
+
+    /**
+     * 用户名
+     */
+    private String username;
+
+    /**
+     * 生日
+     */
+    @JsonFormat(pattern = "yyyy-MM-dd")
+    @DateTimeFormat(pattern = "yyyy-MM-dd")
+    private LocalDate birthday;
+
+    /**
+     * 性别；1=男,2=女,3=保密
+     */
+    private Integer gender;
+
+    /**
+     * 自我介绍
+     */
+    private String introduce;
+
+    public Long getUserId() {
+        return userId;
+    }
+
+    public VueUser setUserId(Long userId) {
+        this.userId = userId;
+        return this;
+    }
+
+    public String getUsername() {
+        return username;
+    }
+
+    public VueUser setUsername(String username) {
+        this.username = username;
+        return this;
+    }
+
+    public LocalDate getBirthday() {
+        return birthday;
+    }
+
+    public VueUser setBirthday(LocalDate birthday) {
+        this.birthday = birthday;
+        return this;
+    }
+
+    public Integer getGender() {
+        return gender;
+    }
+
+    public VueUser setGender(Integer gender) {
+        this.gender = gender;
+        return this;
+    }
+
+    public String getIntroduce() {
+        return introduce;
+    }
+
+    public VueUser setIntroduce(String introduce) {
+        this.introduce = introduce;
+        return this;
+    }
+
+    @Override
+    public String toString() {
+        return "VueUser{" +
+                "userId=" + userId +
+                ", username='" + username + '\'' +
+                ", birthday=" + birthday +
+                ", gender=" + gender +
+                ", introduce='" + introduce + '\'' +
+                '}';
+    }
+}
diff --git a/src/main/java/work/xiaohh/vue/mapper/VueNoticeMapper.java b/src/main/java/work/xiaohh/vue/mapper/VueNoticeMapper.java
new file mode 100644
index 0000000..3109611
--- /dev/null
+++ b/src/main/java/work/xiaohh/vue/mapper/VueNoticeMapper.java
@@ -0,0 +1,25 @@
+package work.xiaohh.vue.mapper;
+
+import org.apache.ibatis.annotations.Mapper;
+import work.xiaohh.vue.entity.VueNotice;
+
+import java.util.List;
+
+/**
+ * <p>
+ * 通知消息数据访问接口
+ * </p>
+ *
+ * @author XiaoHH
+ * @version 1.0.0
+ */
+@Mapper
+public interface VueNoticeMapper {
+
+    /**
+     * 查询所有通知消息列表
+     *
+     * @return 通知消息列表
+     */
+    List<VueNotice> selectAllVueNotice();
+}
diff --git a/src/main/java/work/xiaohh/vue/mapper/VueUserMapper.java b/src/main/java/work/xiaohh/vue/mapper/VueUserMapper.java
new file mode 100644
index 0000000..e7cacae
--- /dev/null
+++ b/src/main/java/work/xiaohh/vue/mapper/VueUserMapper.java
@@ -0,0 +1,25 @@
+package work.xiaohh.vue.mapper;
+
+import org.apache.ibatis.annotations.Mapper;
+import work.xiaohh.vue.entity.VueUser;
+
+import java.util.List;
+
+/**
+ * <p>
+ * 用户表数据访问接口
+ * </p>
+ *
+ * @author XiaoHH
+ * @version 1.0.0
+ */
+@Mapper
+public interface VueUserMapper {
+
+    /**
+     * 查询所有用户列表
+     *
+     * @return 用户列表
+     */
+    List<VueUser> selectAllVueUserList();
+}
diff --git a/src/main/java/work/xiaohh/vue/service/VueNoticeService.java b/src/main/java/work/xiaohh/vue/service/VueNoticeService.java
new file mode 100644
index 0000000..fec9761
--- /dev/null
+++ b/src/main/java/work/xiaohh/vue/service/VueNoticeService.java
@@ -0,0 +1,23 @@
+package work.xiaohh.vue.service;
+
+import work.xiaohh.vue.entity.VueNotice;
+
+import java.util.List;
+
+/**
+ * <p>
+ * 通知消息业务服务接口
+ * </p>
+ *
+ * @author XiaoHH
+ * @version 1.0.0
+ */
+public interface VueNoticeService {
+
+    /**
+     * 查询所有通知消息列表
+     *
+     * @return 通知消息列表
+     */
+    List<VueNotice> selectAllVueNotice();
+}
diff --git a/src/main/java/work/xiaohh/vue/service/VueUserService.java b/src/main/java/work/xiaohh/vue/service/VueUserService.java
new file mode 100644
index 0000000..6031451
--- /dev/null
+++ b/src/main/java/work/xiaohh/vue/service/VueUserService.java
@@ -0,0 +1,23 @@
+package work.xiaohh.vue.service;
+
+import work.xiaohh.vue.entity.VueUser;
+
+import java.util.List;
+
+/**
+ * <p>
+ * 用户业务服务层接口
+ * </p>
+ *
+ * @author XiaoHH
+ * @version 1.0.0
+ */
+public interface VueUserService {
+
+    /**
+     * 查询所有用户列表
+     *
+     * @return 用户列表
+     */
+    List<VueUser> selectAllVueUserList();
+}
diff --git a/src/main/java/work/xiaohh/vue/service/impl/VueNoticeServiceImpl.java b/src/main/java/work/xiaohh/vue/service/impl/VueNoticeServiceImpl.java
new file mode 100644
index 0000000..9ca103a
--- /dev/null
+++ b/src/main/java/work/xiaohh/vue/service/impl/VueNoticeServiceImpl.java
@@ -0,0 +1,44 @@
+package work.xiaohh.vue.service.impl;
+
+import org.springframework.stereotype.Service;
+import work.xiaohh.vue.entity.VueNotice;
+import work.xiaohh.vue.mapper.VueNoticeMapper;
+import work.xiaohh.vue.service.VueNoticeService;
+
+import java.util.List;
+
+/**
+ * <p>
+ * 通知消息业务服务接口实现
+ * </p>
+ *
+ * @author XiaoHH
+ * @version 1.0.0
+ */
+@Service
+public class VueNoticeServiceImpl implements VueNoticeService {
+
+    /**
+     * 该 Bean 创建的时候注入需要的依赖
+     *
+     * @param vueNoticeMapper 通知消息数据访问接口
+     */
+    public VueNoticeServiceImpl(VueNoticeMapper vueNoticeMapper) {
+        this.vueNoticeMapper = vueNoticeMapper;
+    }
+
+    /**
+     * 通知消息数据访问接口
+     */
+    private final VueNoticeMapper vueNoticeMapper;
+
+    /**
+     * 查询所有通知消息列表
+     *
+     * @return 通知消息列表
+     */
+    @Override
+    public List<VueNotice> selectAllVueNotice() {
+        return this.vueNoticeMapper.selectAllVueNotice();
+    }
+}
diff --git a/src/main/java/work/xiaohh/vue/service/impl/VueUserServiceImpl.java b/src/main/java/work/xiaohh/vue/service/impl/VueUserServiceImpl.java
new file mode 100644
index 0000000..be598a3
--- /dev/null
+++ b/src/main/java/work/xiaohh/vue/service/impl/VueUserServiceImpl.java
@@ -0,0 +1,44 @@
+package work.xiaohh.vue.service.impl;
+
+import org.springframework.stereotype.Service;
+import work.xiaohh.vue.entity.VueUser;
+import work.xiaohh.vue.mapper.VueUserMapper;
+import work.xiaohh.vue.service.VueUserService;
+
+import java.util.List;
+
+/**
+ * <p>
+ * 用户业务服务层接口实现
+ * </p>
+ *
+ * @author XiaoHH <xiaohh@yueyang.city>
+ * @version 1.0.0
+ */
+@Service
+public class VueUserServiceImpl implements VueUserService {
+
+    /**
+     * 该 Bean 创建的时候注入需要的依赖
+     *
+     * @param vueUserMapper 用户表数据访问接口
+     */
+    public VueUserServiceImpl(VueUserMapper vueUserMapper) {
+        this.vueUserMapper = vueUserMapper;
+    }
+
+    /**
+     * 用户表数据访问接口
+     */
+    private final VueUserMapper vueUserMapper;
+
+    /**
+     * 查询所有用户列表
+     *
+     * @return 用户列表
+     */
+    @Override
+    public List<VueUser> selectAllVueUserList() {
+        return this.vueUserMapper.selectAllVueUserList();
+    }
+}
diff --git a/src/main/resources/application.yaml b/src/main/resources/application.yaml
index d7f6166..f7ed535 100644
--- a/src/main/resources/application.yaml
+++ b/src/main/resources/application.yaml
@@ -19,3 +19,13 @@ spring:
     redis:
       host: localhost
       database: 1
+
+mybatis:
+  mapper-locations: classpath:mapper/**/*Mapper.xml
+  configuration:
+    log-impl: org.apache.ibatis.logging.slf4j.Slf4jImpl
+  type-aliases-package: work.xiaohh.vue.entity
+
+logging:
+  level:
+    work.xiaohh: debug
diff --git a/src/main/resources/mapper/vue/VueNoticeMapper.xml b/src/main/resources/mapper/vue/VueNoticeMapper.xml
new file mode 100644
index 0000000..d2bf053
--- /dev/null
+++ b/src/main/resources/mapper/vue/VueNoticeMapper.xml
@@ -0,0 +1,25 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<!DOCTYPE mapper
+        PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
+        "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
+<mapper namespace="work.xiaohh.vue.mapper.VueNoticeMapper">
+
+    <!-- 通知消息表和通知消息实体基本映射 -->
+    <resultMap id="VueNoticeResult" type="VueNotice">
+        <id property="noticeId" column="notice_id"/>
+        <result property="noticeTitle" column="notice_title"/>
+        <result property="noticeContent" column="notice_content"/>
+        <result property="noticeTime" column="notice_time"/>
+    </resultMap>
+
+    <!-- 查询通知消息表 SQL 语句 -->
+    <sql id="VueNoticeSql">
+        SELECT `notice_id`, `notice_title`, `notice_content`, `notice_time` FROM `vue_notice`
+    </sql>
+
+    <!-- 查询所有通知消息列表 -->
+    <select id="selectAllVueNotice" resultMap="VueNoticeResult">
+        <include refid="VueNoticeSql"/>
+        ORDER BY `notice_id`
+    </select>
+</mapper>
diff --git a/src/main/resources/mapper/vue/VueUserMapper.xml b/src/main/resources/mapper/vue/VueUserMapper.xml
new file mode 100644
index 0000000..4d89dc2
--- /dev/null
+++ b/src/main/resources/mapper/vue/VueUserMapper.xml
@@ -0,0 +1,26 @@
+<?xml version="1.0" encoding="UTF-8" ?>
+<!DOCTYPE mapper
+        PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
+        "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
+<mapper namespace="work.xiaohh.vue.mapper.VueUserMapper">
+
+    <!-- 用户表和用户实体基本映射 -->
+    <resultMap id="VueUserResult" type="VueUser">
+        <id property="userId" column="user_id"/>
+        <result property="username" column="username"/>
+        <result property="birthday" column="birthday"/>
+        <result property="gender" column="gender"/>
+        <result property="introduce" column="introduce"/>
+    </resultMap>
+
+    <!-- 查询用户表 SQL 语句 -->
+    <sql id="VueUserSql">
+        SELECT `user_id`, `username`, `birthday`, `gender`, `introduce` FROM `vue_user`
+    </sql>
+
+    <!-- 查询所有用户列表 -->
+    <select id="selectAllVueUserList" resultMap="VueUserResult">
+        <include refid="VueUserSql"/>
+        ORDER BY `user_id`
+    </select>
+</mapper>