springcloud入门demo

springcloud入门demo

开发工具idea

说明:

idea 功能很强大,数据库连接和远程服务器连接都是使用的 idea 自带插件

使用的技术

  • springboot
  • mybatis-plus
  • druid
  • lombok
  • swagger
  • sprinigcloud
  • springcloudalibaba
  • nacos
  • gateway
  • openfeign
  • vue
  • element-ui
  • …(后面加入)

说明:本项目暂时没有涉及 权限认证相关,只是一个框架整合的 demo 案例

仓库地址

https://gitee.com/shao_ming314/springcloud-vue-demo.git

说明:

项目中使用的 数据库nacos 配置使用的是线上个人云服务器配置,理论上clone 项目 ,可以不要配置直接运行,如果云服务器有修改,请联系 18262717718(微信) 一起讨论

1.搭建项目骨架

新建父工程

新建的该 project 作为项目的父工程,后面引入其他模块

使用 idea 创建项目

springcloud入门demo_第1张图片

初始化一个 maven 项目作为父工程

springcloud入门demo_第2张图片

配置项目的基本信息

springcloud入门demo_第3张图片

删除父工程没有的目录

说明:

父工程就是管理子项目的以来 , 所以父工程只留一个 pom.xml

删除项目的 src 目录

springcloud入门demo_第4张图片

搭建子模块

  • 公共模块

  • 员工模块

  • 部门模块

  • 网关模块

  • 前端模块

说明:

以员工模块举例进行模块搭建

前端模块也放在后端项目中,因为 idea 装上 vue.js 插件也可以开发 vue 项目

新建 moudle

springcloud入门demo_第5张图片

springcloud入门demo_第6张图片

项目目录如下

springcloud入门demo_第7张图片

参照以上依次搭建其余后端模块

搭建前端项目

说明:

方便起见,我直接使用的一个前端 开源模板作为 基础进行二次开发

参考网址:

https://gitee.com/panjiachen/vue-admin-template/

克隆下该项目

注意:删除该前端模块的 .git 文件夹,项目开发好我们是对整合项目版本控制

项目最后目录

springcloud入门demo_第8张图片

2.初始化好前端项目

参考前端项目的 READEME.md 文档 , 编译运行前端项目

安装依赖

npm install --registry=https://registry.npm.taobao.org

启动服务

npm run dev

编译项目

springcloud入门demo_第9张图片

启动服务

springcloud入门demo_第10张图片

跳到浏览器进行登录

springcloud入门demo_第11张图片

到此前端项目初始化完成

修改前端项目名称为 server-ui

3.引入数据库

说明:

为了更直观的模拟微服务,没有服务模块的使用的数据库不是相同的数据库,可以根据自己需要进行设置

数据库脚本

# dept-server 模块需要的数据库脚本
DROP TABLE IF EXISTS `department`;
CREATE TABLE `department` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `name` varchar(80) DEFAULT NULL COMMENT '部门名称',
  `created_at` datetime DEFAULT NULL COMMENT '创建时间',
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8;

-- ----------------------------
-- Table structure for employee
-- ----------------------------
# emp-server 模块需要的数据库脚本
DROP TABLE IF EXISTS `employee`;
CREATE TABLE `employee` (
  `id` int(11) unsigned NOT NULL AUTO_INCREMENT,
  `name` varchar(40) DEFAULT NULL,
  `birthday` datetime DEFAULT NULL COMMENT '生日',
  `salary` double(10,2) DEFAULT NULL COMMENT '工资',
  `department_id` int(11) DEFAULT NULL COMMENT '部门信息',
  PRIMARY KEY (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8;

SET FOREIGN_KEY_CHECKS = 1;

。。。。

4.下载项目

git clone https://gitee.com/shao_ming314/springcloud-vue-demo.git

5.配置项目

需要修改的地方

1.数据库连接

2.nacos连接地址

3.nacos配置中心分组

4.nacos注册中心分组

说明:

因为注意事项比较多,文档说面不是很清楚,可以clone 项目后自行修改

6.运行项目

运行后端项目

springcloud入门demo_第12张图片

运行前端项目

springcloud入门demo_第13张图片

发送异步请求

springcloud入门demo_第14张图片

后续

。。。。。

有一些细节,自己总结的不是很到位,可以直接clone项目,具体可以一起讨论
运行后端项目

[外链图片转存中…(img-FOmGyc57-1640782770795)]

运行前端项目

[外链图片转存中…(img-kLjtZJRP-1640782770795)]

发送异步请求

[外链图片转存中…(img-ntIYZSgz-1640782770796)]

后续

。。。。。

有一些细节,自己总结的不是很到位,可以直接clone项目,具体可以一起讨论

你可能感兴趣的:(分布式+微服务,java,spring,boot,开发语言,微服务)