idea+springboot+Mybatis搭建web项目

太过爱你忘了你带给我的痛 2022-04-22 11:26 178阅读 0赞

使用idea+springboot+Mybatis搭建一个简单的web项目。

首先新建一个项目；

![1239550-20171010172212105-1975578622.png][]

在这里选择Maven项目也可以，但是IDEA为我们提供了一种更方便快捷的创建方法，即Spring Initializr。选择后点击Next；

![1239550-20171010172222715-1609928297.png][]

把项目信息写好，Next；

![1239550-20171010172228121-1430641621.png][]

按下面三张图勾选设置；

![1239550-20171010172233074-1981299136.png][]

![1239550-20171010172243199-1486801563.png][]

![1239550-20171010172248230-1695258115.png][]

最后Finish。

![1239550-20171010172252152-178754359.png][]

等待Maven自动加载完成后，最初的项目结构如下图。在Springboot属性文件application.properties中，把数据库连接属性加上，同时可以设置服务端口。

<table> 
 <tbody> 
 <tr> 
 <td> 1 2 3 4 5 6 7 8 </td> 
 <td> <code>spring.datasource.url = jdbc:mysql:</code><code>//localhost:3306/test</code> <code>spring.datasource.username = root</code> <code>spring.datasource.password =&nbsp; root</code> <code>spring.datasource.driverClassName = com.mysql.jdbc.Driver</code> <code>#页面热加载</code> <code>spring.thymeleaf.cache =&nbsp;</code><code>false</code> <code>#端口</code> <code>server.port=</code><code>8888</code> </td> 
 </tr> 
 </tbody> 
</table>

![1239550-20171010172259590-1400484791.png][]

resources目录下，static文件夹是放置各种静态资源，如css，js，img等文件的。templates文件夹则是默认放置网页的。当然也可以更改。

在static文件夹下新建一个测试css，test.css。

<table> 
 <tbody> 
 <tr> 
 <td> 1 2 3 </td> 
 <td> <code>body{ </code> <code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>color</code><code>:&nbsp;</code><code>red</code><code>;</code> <code>}</code> </td> 
 </tr> 
 </tbody> 
</table>

在templates文件夹下新建一个html，要注意的是meta这个标签的结束符软件并没有自动加上，需要手动加上，否则访问网页时会报错。并引入test.css

<!DOCTYPE html>
 <html lang="en">
 <head>
 <meta charset="UTF-8" />
 <title>Title</title>
 <link rel="stylesheet" href="test.css" type="text/css" />
 </head>
 <body>
 <h1>Hello World</h1>
 </body>
 </html>

![1239550-20171010180259027-1570245912.png][]

![1239550-20171010180310043-27353181.png][]

接下来可以写一个controller了

<table> 
 <tbody> 
 <tr> 
 <td> 1 2 3 4 5 6 7 8 9 10 11 12 13 </td> 
 <td> <code>package</code>&nbsp;<code>com.example.demo;</code> &nbsp; <code>import</code>&nbsp;<code>org.springframework.stereotype.Controller;</code> <code>import</code>&nbsp;<code>org.springframework.web.bind.annotation.RequestMapping;</code> &nbsp; <code>@Controller</code> <code>public</code>&nbsp;<code>class</code>&nbsp;<code>IndexController { </code> <code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>@RequestMapping</code><code>(</code><code>"/index"</code><code>)</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>public</code>&nbsp;<code>String index(){ </code> <code>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</code><code>return</code>&nbsp;<code>"hello"</code><code>;</code> <code>&nbsp;&nbsp;&nbsp;&nbsp;</code><code>}</code> &nbsp; <code>}</code> </td> 
 </tr> 
 </tbody> 
</table>

![1239550-20171010180346324-837293625.png][]

完成之后，通过方式1和方式2都可以启动项目

![1239550-20171010180425715-2081065677.png][]

接下来可以在浏览器中测试了

![1239550-20171010180438293-169096872.png][]

到此，一个简单的项目搭建完成。

[1239550-20171010172212105-1975578622.png]: /images/20220422/d2734bf889e04af5857942f86b2db71c.png
[1239550-20171010172222715-1609928297.png]: /images/20220422/086ff258e6184cd589ec59136bd81055.png
[1239550-20171010172228121-1430641621.png]: /images/20220422/0351061adffc42599cf2831abfb7d83f.png
[1239550-20171010172233074-1981299136.png]: /images/20220422/ea2fcadfdc5e4cc3a19f527d727b242b.png
[1239550-20171010172243199-1486801563.png]: /images/20220422/e9e28e08e0ff4fefb57b36b0e098f9ad.png
[1239550-20171010172248230-1695258115.png]: /images/20220422/26d606a49f93411bb55273cfd2ce870e.png
[1239550-20171010172252152-178754359.png]: /images/20220422/4d76a16d9b0a4e15931f81195341ebcf.png
[1239550-20171010172259590-1400484791.png]: /images/20220422/f1852edc37654f3fbc2f6b531c3112a8.png
[1239550-20171010180259027-1570245912.png]: /images/20220422/64558b5349cc4177ac2751c9e08f68a4.png
[1239550-20171010180310043-27353181.png]: /images/20220422/d8da7cfc768f496e9878c764c6f31164.png
[1239550-20171010180346324-837293625.png]: /images/20220422/2075f3517bad4a8fa7a640c8fd02b8f7.png
[1239550-20171010180425715-2081065677.png]: /images/20220422/a1e18aa66fe24179b11bc91300dbb904.png
[1239550-20171010180438293-169096872.png]: /images/20220422/d73576d185db4b578793f0df84921960.png