白卷项目安装与配置完全指南

白卷项目安装与配置完全指南

White-Jotter 白卷是一款使用 Vue+Spring Boot 开发的前后端分离项目，附带全套开发教程。（A simple CMS developed by Spring Boot and Vue.js with development tutorials） 项目地址: https://gitcode.com/gh_mirrors/wh/White-Jotter

项目基础介绍与编程语言

白卷 是一款采用 Vue.js 与 Spring Boot 开发的前后端分离的简单内容管理系统(CMS)，特别适合web开发初学者体验从前端到后端的全链路开发流程。项目提供了详尽的开发教程，从零开始引导您完成整个系统的构建。它利用了Vue.js进行前端界面设计，Java通过Spring Boot搭建后端服务器，同时借助MySQL和Redis来存储数据。

关键技术和框架

• 前端：Vue.js, Element UI, axios
• 后端：Spring Boot, Apache Shiro（权限管理），Spring Data JPA（ORM层），Spring Data Redis，Apache Log4j2（日志）
• 数据库：MySQL, Redis
• 部署与构建：Git, Node.js, npm

准备工作与详细安装步骤

第一步：环境准备

确保您的开发环境中已安装以下软件：

• Git
• JDK 8 或更高版本
• MySQL 8.0.15 或以上
• Redis
• Node.js (建议v14及以上)
• IntelliJ IDEA 或其他支持Maven的Java IDE
• npm 或 yarn

第二步：克隆项目与数据库准备

1. 打开终端或命令提示符，执行以下命令以克隆项目：

   git clone https://github.com/Antabot/White-Jotter.git
   

2. 创建MySQL数据库，命名为wj。数据库脚本位于后端项目的 src/main/resources 目录下，名为wj.sql，您可以手动执行该脚本来初始化表结构。

第三步：配置数据库连接

• 打开后端项目，在wj目录下的src/main/resources找到application.properties文件。
• 修改数据库连接配置，确保它们指向正确的MySQL实例：

  spring.datasource.url=jdbc:mysql://localhost:3306/wj?serverTimezone=UTF-8&useSSL=false
  spring.datasource.username=root
  spring.datasource.password=your_password
  

第四步：运行后端服务

1. 打开后端项目（通常是wj目录）在IntelliJ IDEA或其他IDE中。
2. 右击pom.xml，选择Maven > Reimport以刷新依赖。
3. 确保Redis服务正在运行，端口默认为6379且无密码。
4. 运行主应用类（通常标记为@SpringBootApplication的类）。

第五步：前端开发环境设置

1. 进入前端项目目录（通常是wj-vue）。
2. 安装npm依赖：

   npm install
   

3. 运行前端项目：

   npm run dev
   

   此命令将在本地启动前端开发服务器，并通过API转发与后端交互。

第六步：访问与验证

• 打开浏览器，访问http://localhost:8080，您应能看到登录界面。
• 默认账号：admin，密码：123。

第七步：部署与发布

• 若要将项目部署上线，先在前端目录执行npm run build，生成的dist文件夹内的内容需要复制到后端项目的resources/static/目录下。
• 重新启动后端服务，前端资源将以静态方式提供，但请注意这不是最佳实践，特别是对于生产环境，推荐使用反向代理配置。

至此，您已成功安装并配置了白卷项目，可进行二次开发或直接部署使用。记得在开发过程中，根据实际需求调整配置文件，并遵循项目的教程文档进行深入学习。

White-Jotter 白卷是一款使用 Vue+Spring Boot 开发的前后端分离项目，附带全套开发教程。（A simple CMS developed by Spring Boot and Vue.js with development tutorials） 项目地址: https://gitcode.com/gh_mirrors/wh/White-Jotter