10分钟构建前后端分离后台管理系统

170 阅读3分钟

携手创作,共同成长!这是我参与「掘金日新计划 · 8 月更文挑战」的第3天,点击查看活动详情

Git配置

配置 Git

通过配置git,能让我们提交代码的时候显示我们的在这里设置的名字

# 配置用户名
git config --global user.name "username" //(名字)
# 配置邮箱
git config --global user.email "username@email.com" //(注册账号时用的邮箱)

配置 Ssh 免密登录

这里-C指定的为邮箱地址

ssh-keygen -t rsa -C "mildcaq@163.com"
一路回车

查看公钥

cat ~/.ssh/id_rsa.pub

测试

image.png

在gitee设置
用 ssh -T git@gitee.com 测试登录
成功会出现如下:
Hi 彭于晏! You've successfully authenticated, but GITEE.COM does not provide shell access.

Gitee配置

gitee为代码托管平台,在这里代码可以更灵活的合作开发、代码回滚等等

image-20220725210747743

从Gitee导入代码到IDEA

image-20220725221240433

建立项目基本架构

image-20220725221433768

提交代码到gitee

image-20220725221030090

初始化数据库

这里数据库我们采用docker中部署的mysql

设置每次重启后自动启动

[root@queen ~]# docker update redis --restart=always
redis
[root@queen ~]# docker update mysql --restart=always
mysql

重启虚拟机看是否重新启动

[root@queen ~]# docker ps
CONTAINER ID   IMAGE       COMMAND                  CREATED       STATUS              PORTS                                                  NAMES
d82881d71fba   redis       "docker-entrypoint.s…"   5 hours ago   Up About a minute   0.0.0.0:6379->6379/tcp, :::6379->6379/tcp              redis
f8bb0bf0b68a   mysql:5.7   "docker-entrypoint.s…"   5 hours ago   Up About a minute   0.0.0.0:3306->3306/tcp, :::3306->3306/tcp, 33060/tcp   mysql

快速搭建后台管理系统

太强了,这一波操作直接颠覆我的认知好吧,我之前做都是用vue-template这个,不得不说有点麻烦

image-20220725225125303

下载代码

  • 通过git clone

    • 这里通过git clone下载的代码我们可以直接下载桌面,然后分别导入之后直接删除即可
  • 在gitee直接下载

    • 用IDM下载还是比较快的!

image-20220725225451061

导入后端代码

1.创建基础架构

image-20220726200004929

2.引入外部模块

gitee.com/renrenio/re…

gitee.com/renrenio/re…

gitee.com/renrenio/re…

以上分别是:

  • 后端代码
  • 前端代码
  • 代码生成器

git克隆到桌面,拷贝文件夹到项目文件夹,删除桌面文件

image-20220726200218101

3.导入数据,修改配置文件

这里的数据库都是Docker启动的Mysql

image-20220725231959015

4.修改配置文件

改成 自己的mysql容器地址,还要指定数据库名

url: jdbc:mysql://192.168.1.12:3306/mall-admin?useUnicode=true&characterEncoding=UTF-8&serverTimezone=Asia/Shanghai

5.启动测试

image-20220726102408806

导入项目后的pom问题

<relativePath></relativePath>这个作用是不依赖本地parent pom,直接从reposity拉取

不继承父类,相当于用自己的

<parent>
   <groupId>org.springframework.boot</groupId>
   <artifactId>spring-boot-starter-parent</artifactId>
   <version>2.6.6</version>
   <relativePath></relativePath>
</parent>

插件下载失败

其中docker的插件版本选择1.2.2可下载

有以下几种方式调试:

  • 设置多maven地址
  • 设置maven自动导入,删除本地这个包让他重新下载
  • 每次更改都要刷新、重启IDEA
  • 删除项目,重新克隆到本地

image-20220726101740975

导入前端代码

npm config set registry http://registry.npm.taobao.org/
npm install #在下载的前端项目根目录下
npm run dev #启动前端项目

如果上面不行可以采用

npm install -g cnpm --registry=https://registry.npm.taobao.org
cnpm install node-sass --save
npm run dev #启动前端项目

安装成功出现如下提示:

DONE  Compiled successfully in 14998ms                 9:25:32
​
 I  Your application is running here: http://localhost:8001

启动测试:

image-20220726102441069

npm install失败

开启v2ray等你懂得的软件,没有的话通过

清理缓存:npm rebuild node-sass npm uninstall node-sass

重新下载:npm i node-sass --sass_binary_site=npm.taobao.org/mirrors/nod…

再次npm install 直到成功

还是失败?

删除node_moudle模块删除重新npm install