- Vue + ElementPlus + Echarts
- Spring Boot + MyBatisPlus + Spring Security + Redis
- 首页：首页展示页，一些数据统计
- 时光轴：动态展示
- 留言板：访客可以留言
- 作品集：作品集展示
- 公告通知
- 数据管理：对时光轴的动态的增删查、留言板的审核、作品集、公告通知的管理界面
演示地址：http://www.qmeternity.cn/index
https://xiamu-ssr.github.io/MyWeb01-Doc/
- 前置依赖
- JDK >= 1.8 (推荐1.8版本)
- Mysql >= 5.7.0 (推荐5.7版本)
- Redis >= 3.0
- Maven >= 3.0
- Node >= 12
- 前端运行
# 安装依赖
yarn --registry=https://registry.npmmirror.com
# 启动服务
yarn dev
# 构建测试环境 yarn build:stage
# 构建生产环境 yarn build:prod
# 前端访问地址 http://localhost:80
- 后端运行 IDEA开箱即用
在/root下新建一个MyWeb01文件夹，用来存放本次项目所有docker脚本和映射资源
- 服务器启动依赖容器-Redis
#!/bin/bash
containerName="MyWeb01-Redis"
RedisData="/root/MyWeb01/Redis/data"
docker run -d --name "$containerName" \
-v "$RedisData":/data \
-p 6379:6379 \
redis- 服务器启动依赖容器-Mysql
#!/bin/bash
containerName="MyWeb01-MySQL"
MySQLData="/root/MyWeb01/MySQL/data"
docker run -d --name "$containerName" \
-p 3306:3306 \
-v "$MySQLData":/var/lib/mysql \
-e MYSQL_ROOT_PASSWORD=1009 \
mysql:8- 本地修改前后端源码配置
- 前端修改
vite.config.js文件中的server.proxy.'/dev-api'.target为后端程序ip+port - 后端修改
application-druid.yml中spring.datasource.druid.master.url中ip为同服务器的mysql的docker别名 - 后端修改
application.yml中spring.redis.host为同服务器的redis的docker别名 - 后端修改
application.yml中ruoyi.profile为后台部署的docker的ruoyi自带文件保存路径
- 本地打包前后端源码
- 前端执行命令行
yarn build:prod - 后端用IDEA执行
maven package
- 部署前端 将打包好的dist文件夹放到MyWeb01/Vue/dist 两个conf文件见./config/nginx
#!/bin/bash
containerName="MyWeb01-Vue"
nginxConf="/root/MyWeb01/Vue/nginx/nginx.conf"
defaultConf="/root/MyWeb01/Vue/nginx/default.conf"
logsPath="/root/MyWeb01/Vue/logs"
vuePath="/root/MyWeb01/Vue/dist"
docker run -d --name "$containerName" \
-v "$nginxConf":/etc/nginx/nginx.conf \
-v "$defaultConf":/etc/nginx/conf.d/default.conf \
-v "$logsPath":/var/log/nginx \
-v "$vuePath":/usr/share/nginx/dist \
-p 80:80 \
nginx- 部署后端 将打包好的jar包放入MyWeb01/SpringBoot/
#!/bin/bash
containerName="MyWeb01-SpringBoot"
SpringBootPath="/root/MyWeb01/SpringBoot/ruoyi-admin.jar"
imagePath="/root/MyWeb01/SpringBoot/images/"
docker run -d --name "$containerName" \
-p 8080:8080 \
--link MyWeb01-MySQL:mysqldb \
--link MyWeb01-Redis:redisdb \
-v "$SpringBootPath":/app/your-app.jar \
-v "$imagePath":/app/images \
openjdk:8 java -jar /app/your-app.jar
- 源码在Github上无需担心
- 数据库资源定期将docker容器打包成镜像，或者利用数据库连接工具导出数据
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent