SpringBoot---------初次接触前后端分离概念

我们创建一个springboot项目。

我们先去导入依赖,我们所要选择的就是lombok,web,mysql连接所需要的依赖:
SpringBoot---------初次接触前后端分离概念_第1张图片

SpringBoot---------初次接触前后端分离概念_第2张图片

SpringBoot---------初次接触前后端分离概念_第3张图片

这些代码是不需要我们去写的,我们在创建项目时选好需要的依赖就自动生成了。

接下来我们先去写我们的实体类:
SpringBoot---------初次接触前后端分离概念_第4张图片

我们的实体类是和数据库匹配的。

我们建一个数据库和myclass表:
SpringBoot---------初次接触前后端分离概念_第5张图片

我们这一节内容就是使用springboot做一个查询用户表的功能即可。

所以接下来要去写dao层的接口:

SpringBoot---------初次接触前后端分离概念_第6张图片

我们去写好对应接口的mapper.xml,去完成数据库查询语句的建立:

SpringBoot---------初次接触前后端分离概念_第7张图片

这部分代码只要我们xml文件创建后,可以自动生成的,我们只需要写中间位置的sql语句。

最后去完成controller层的字符串返回:

SpringBoot---------初次接触前后端分离概念_第8张图片

我们要连接数据库,所以我们代码都写好后,一定要去配置好数据库中的信息:

SpringBoot---------初次接触前后端分离概念_第9张图片

这里我们除了数据库的信息配置,还去写了Mybatis加载的位置,因为用mybatis做查询会比较简单。

我们知道我们一个项目里可能会有很多的mapper接口,所以我们可以在springboot的配置类上扫描全部的dao层的包:

SpringBoot---------初次接触前后端分离概念_第10张图片

这样我们的项目就写完了,我们去运行一下:
SpringBoot---------初次接触前后端分离概念_第11张图片

我们成功查到了我们的数据。我们这里没有去加入web的模式,没有自己去写前端页面,我们是把信息以json串的形式显示在前端。但是这时候我们都是前端,后端都在idea里自己写的,这是我们正常的前后端不分离的做法。

我们现在来初次体验一下前后端分离的感觉,当然我们并没有去学习vue前端框架,我们这里就用ajax去代替vue完成前后端分离的效果:

我们现在hbuilder软件中去写一个简单的前端页面:

SpringBoot---------初次接触前后端分离概念_第12张图片

我们先来运行idea:

 再运行hbuilder前端页面:

我们还需要在我们的controller中加入一个设置头的内容,运行远程连接:

然后我们就可以去运行我们的前端页面:

 SpringBoot---------初次接触前后端分离概念_第13张图片

 我们发现我们的前端页面也可以看到我们数据库中查询到的内容。

这样后端就在idea中做后端,前端就在hbuilder中做前端最后页面显示出来,前后端互相独立实现前后端分离。当然以后都是要用前端vue框架的,这里只是初步体验一下前后端分离的感觉。

你可能感兴趣的:(spring,boot,java,spring)