最近在學spring boot ，學習一個框架無非也就是使用它來做以前做的事情，兩者比較才有不同，說一下自己使用的體會。
先來說下spring boot ，微框架。快速開發，相當於零配置，從一個大神那看來的說：spring boot 相當於框架的框架，就是集成了很多，用哪個添加哪個的依賴就行，這樣的話自己看不到配置，對於習慣了使用配置剛使用spring boot的開發者來說可能還有點不習慣，什麼都不用配，看不到配置感覺對項目整體架構有點陌生，再說在spring boot 中使用thymeleaf 。就拿個最簡單的例子來說明jsp顯示helloworld , thymeleaf顯示helloworld，兩者也就pom文件引入依賴和屬性文件配置不同，在你使用jsp的時候不要引入thymeleaf的依賴，當然在使用thymeleaf的時候也不要引入jsp的依賴有可能會產生衝突，spring boot 官方是推薦使用thymeleaf 我個人感覺也不錯，開始項目吧！
1 、首先建一個meaven項目看一下建好的項目整體結構
建好項目結構弄pom.xml ,這個demo只用到thymeleaf，沒有數據庫方面的依賴，所需依賴很少
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd"> <modelVersion>4.0.0</modelVersion> <groupId>Springboot_bootstrap</groupId> <artifactId>Springboot_bootstrap</artifactId> <version>0.0.1-SNAPSHOT</version> <parent> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-parent</artifactId> <version>1.4.7.RELEASE</version> <relativePath/> <!-- lookup parent from repository --> </parent> <properties> <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding> <project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding> <java.version>1.8</java.version> </properties> <dependencies> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter</artifactId> </dependency> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency> <!-- thymeleaf --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency> </dependencies> <build> <plugins> <plugin> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-maven-plugin</artifactId> </plugin> </plugins> </build> </project>
在src /main/resource 建立application.properties文件
server.port=8080 server.session.timeout=10 server.tomcat.uri-encoding=UTF-8 spring.thymeleaf.prefix=classpath:/views/ spring.thymeleaf.suffix=.html spring.thymeleaf.mode=HTML5 spring.thymeleaf.encoding=UTF-8 spring.thymeleaf.content-type=text/html spring.thymeleaf.cache=false
寫入口程序
package com.zanghan.youyu; import org.springframework.boot.SpringApplication; import org.springframework.boot.autoconfigure.SpringBootApplication; @SpringBootApplication public class YouYuApplication { public static void main(String[] args) { SpringApplication.run(YouYuApplication.class, args); } }控制器跳轉bootstrap界面
package com.zanghan.youyu.controller; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.RequestMapping; @Controller public class LoginController { @RequestMapping("/") public String index(){ return "/index"; } }引入bootstrap js css 放在哪裡？放在static文件夾裡，views中放的是頁面
index.html界面存放在src/main/resource 下的views 文件夾裡，為啥不是tepmlates 因為在屬性配置文件中寫的是views ，thymeleaf 的前綴和後綴都可以改變的
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3"> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge"/> <meta name="viewport" content="width=device-width, initial-scale=1"/> <title>MES平台</title> <!--Bootstrap--> <link th:href="@{Bootstrap/bootstrap/css/bootstrap.min.css}" rel="stylesheet" /> <!-- Font Awesome --> <link th:href="@{Bootstrap/font-awesome/css/font-awesome.min.css}" rel="stylesheet" /> <!--[if IE 7]> <link href="/Content/font-awesome/css/font-awesome-ie7.min.css" rel="stylesheet" /> <![endif]--> <link th:href="@{Bootstrap/sidebar-menu/sidebar-menu.css}" rel="stylesheet" /> <link th:href="@{Bootstrap/ace/css/ace-rtl.min.css}" rel="stylesheet" /> <link th:href="@{Bootstrap/ace/css/ace-skins.min.css}" rel="stylesheet" /> <link th:href="@{Bootstrap/toastr/toastr.min.css}" rel="stylesheet" /> <script th:src="@{Bootstrap/jquery-1.9.1.min.js}"></script> <script th:src="@{Bootstrap/bootstrap/js/bootstrap.min.js}"></script> <script th:src="@{Bootstrap/sidebar-menu/sidebar-menu.js}"></script> <script th:src="@{Bootstrap/bootstrap/js/bootstrap-tab.js}"></script> <!--[if lt IE 9]> <script src="/Scripts/html5shiv.js"></script> <script src="/Scripts/respond.min.js"></script> <![endif]--> <style type="text/css"> body { font-size: 12px; } .nav > li > a { padding: 5px 10px; } .tab-content { padding-top: 3px; } </style> </head> <body> <div id="navbar"> <ul> <a id="menu-toggler" href="#"> <i style="font-size:20px;margin-left:-18px;margin-top:8px;display:flex;"></i> </a> <a href="#"> <small> Primaopto </small> </a> </ul> <div role="navigation"> <ul> <li style="height:50px;"> <a data-toggle="dropdown" href="#"> <img src="Content/ace/avatars/avatar2.png" /> <span> <small>歡迎光臨,</small> 1310177 </span> <i></i> </a> <ul> <li> <a href="#"> <i></i> 設置</a> </li> <li> <a href="#"> <i></i> 個人資料</a> </li> <li></li> <li> <a href="/Home/Logout"> <i></i> 退出</a> </li> </ul> </li> </ul> </div> </div> <div id="main-container"> <div> <div id="sidebar"> <div id="sidebar-collapse" style="display:none;"> <i data-icon1="icon-double-angle-left" data-icon2="icon-double-angle-right"></i> </div> <ul id="menu"></ul> </div> <div> <div> <div> <div style="padding-left:5px;"> <ul role="tablist"> <li><a href="#Index" role="tab" data-toggle="tab">系統首頁</a></li> </ul> <div style="height:1000px"> <div role="tabpanel" id="Index" style="height:100%"> <h2>歡迎進入後台管理系統</h2> </div> </div> </div> </div> </div> </div> </div> </div> <script type="text/javascript"> //toastr.options.positionClass = 'toast-bottom-right'; $(function () { $('#menu').sidebarMenu({ data: [{ id: '1', text: '系統設置', icon: 'icon-cog', url: '', menus: [{ id: '2', text: '編碼管理1', icon: 'icon-glass', url: '', menus: [{ id: '3', text: '編碼管理2', icon: 'icon-glass', url: '', menus: [{ id: '2', text: '編碼管理1', icon: 'icon-glass', url: '', }, { id: '3', text: '編碼管理2', icon: 'icon-glass', url: '', },{ id: '4', text: '編碼管理3', icon: 'icon-glass', url: '', }] }] }] }] }); $("#menu-toggler").click(function () { var children = $("#sidebar-collapse").children("i"); if ($(children).hasClass("icon-double-angle-left")) { $(children).removeClass("icon-double-angle-left").addClass("icon-double-angle-right"); $("#sidebar").attr("class", "sidebar menu-min display"); } else { $(children).removeClass("icon-double-angle-right").addClass("icon-double-angle-left"); $("#sidebar").attr("class", "sidebar display"); } }); }); </script> <script th:src="@{Bootstrap/ace/js/ace-extra.min.js}"></script> <script th:src="@{Bootstrap/ace/js/ace.min.js}"></script> </body> </html>搞定，運行application 輸入localhost:8080
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持武林網。