AgileBoot - 手把手一步一步带你Run起全栈项目(SpringBoot+Vue3)

乎语百科 2022-10-13 10:10:08 404 0

AgileBoot是笔者在业余时间基于ruoyi改造优化的前后端全栈项目。

关于AgileBoot的详细介绍：https://www.cnblogs.com/valarchie/p/16777336.html

学习一个项目首先的第一步就是把项目给run起来。为了便于大家把项目Run起来~ 写个启动说明

准备工作

请确保您的机子上安装好了JDK，Docker，npm。什么？？你还没有安装？没事下面有几个安装小教程。

JDK安装：https://www.cnblogs.com/zll-wyf/p/15095664.html
Docker安装：https://www.runoob.com/docker/windows-docker-install.html
npm安装：https://www.cnblogs.com/longkui-site/p/15856869.html

本项目仅需要Mysql和Redis这两个组件，下面依次用Docker安装Mysql以及Redis

手把手 Mysql Docker 安装

创建本地数据存储目录

比如你想把docker内的Mysql数据，存在你的宿主机的话，需要在你宿主机创建一个目录。假设你的工作目录是 D:/workspace 那就创建一个 D:/workspace/mysql/data 目录。

注意上面的D:/workspace/mysql/data 将作为启动docker的命名参数。

拉取Mysql的镜像

docker pull mysql:版本号

docker pull mysql:8

启动Mysql容器

docker run -d -v D:/workspace/mysql/data:/var/lib/mysql -it --name mysql8 -p 33067:3306 -e MYSQL_ROOT_PASSWORD=12345  mysql:8 --default-authentication-plugin=mysql_native_password

注意以上

-v 参数后面 D:/workspace/mysql/data:/var/lib/mysql 斜体部分是你刚才创建的本地数据目录
-p 33067:3306 斜体部分是你宿主机映射的端口，也就是你访问docker时所用的端口
-e MYSQL_ROOT_PASSWORD=12345 斜体部门是你的初始密码对应的账号是root
--name mysql8 斜体是你给容器的命名

进入Mysql容器内

docker exec -it mysql8 /bin/bash

执行mysql命令

mysql -uroot- p

填入我们刚才的初始密码 12345

由于Mysql8出于安全考虑默认不允许外部连接直接访问。所以需要打开权限。

use mysql

alter 'root'@'%' identified with mysql_native_password by '12345';

flush privileges;

创建数据库agileboot

drop database if exists `agileboot`;
create database `agileboot` DEFAULT CHARACTER SET utf8mb4 COLLATE utf8mb4_general_ci;

导入sql文件

navicat直接导入本项目sql文件夹下的数据库脚本 agileboot_xxxxxx.sql文件或者mysql命令打开agileboot库，复制脚本文件内容直接执行即可。

手把手 Redis Docker 安装

拉取Redis的镜像

docker pull redis:版本号

docker pull redis:7-alpine

如果版本号过期的话，可以置空，会拉取最新的镜像，下面的启动命令可以去除掉 :7-alpine

启动Redis容器

docker run -d --name myredis -p 36379:6379 redis:7-alpine --requirepass "12345"

注意以上

-p 36379:6379 斜体部分是你宿主机映射的端口，也就是你访问docker时所用的端口
--requirepass "12345" 斜体部门是你的初始密码
--name myredis 斜体是你给容器的命名

准备工作完毕，请确保您的Mysql和Redis都已经启动成功

后端项目

git clone https://github.com/valarchie/AgileBoot-Back-End

如果拉取比较慢的话，可以到码云的地址：https://gitee.com/valarchie/AgileBoot-Back-End

IDEA导入后端项目

找到 AgileBooAdminApplication 直接点击run

出现以下字样即启动成功。

  ____   _                _                                                           __         _  _
 / ___| | |_  __ _  _ __ | |_   _   _  _ __    ___  _   _   ___  ___  ___  ___  ___  / _| _   _ | || |
 \___ \ | __|/ _` || '__|| __| | | | || '_ \  / __|| | | | / __|/ __|/ _ \/ __|/ __|| |_ | | | || || |
  ___) || |_| (_| || |   | |_  | |_| || |_) | \__ \| |_| || (__| (__|  __/\__ \\__ \|  _|| |_| || ||_|
 |____/  \__|\__,_||_|    \__|  \__,_|| .__/  |___/ \__,_| \___|\___|\___||___/|___/|_|   \__,_||_|(_)
                                      |_|

前端项目

git clone https://github.com/valarchie/AgileBoot-Front-End

如果拉取比较慢的话，可以到码云的地址：https://gitee.com/valarchie/AgileBoot-Front-End

VsCode打开该项目

安装依赖

npm install

启动项目

npm run dev

一切顺利的话打开 http://127.0.0.1 地址即可

如果遇到什么启动问题的话，请大家留言评论。

交流群：1398880

标签： # vue