Spring Boot 從零搭建一個財務管理系統筆記(一) ---基礎環境和簡單demo

1。新建spring-boot項目。File-New-Project 選擇 Spring Initializr -填寫包名項目名-選擇Web勾選Spring Web

2.新建完成後pom文件引用thymeleaf模板（用於解析html和靜態資源的模板）

 <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
            <exclusions>
                <exclusion>
                    <groupId>org.junit.vintage</groupId>
                    <artifactId>junit-vintage-engine</artifactId>
                </exclusion>
            </exclusions>
        </dependency>
    </dependencies>

3.新建controller

@Controller
public class IndexConntroller {

    @RequestMapping(value = "/index")
    public String index(Model model){
        model.addAttribute("name","測試傳值");
        return "index";
    }

    @RequestMapping(value = "/forms")
    public String forms(Model model){
        return "forms";
    }

    @RequestMapping(value = "/charts")
    public String charts(Model model){
        return "charts";
    }

    @RequestMapping(value = "/tables")
    public String tables(Model model){
        return "tables";
    }

    @RequestMapping(value = "/login")
    public String login(Model model){
        return "login";
    }

    @RequestMapping(value = "/register")
    public String register(Model model){
        return "register";
    }
}

5.項目目錄結構如下

目錄中html和static資源文件爲網上模板文件。

測試傳值是否正常

 <div class="sidenav-header-inner text-center"><img src="img/avatar-7.jpg" alt="person" class="img-fluid rounded-circle">
            <h2 class="h5" th:text="${name}"></h2><span>開發管理者</span>
          </div>

index.html使用表達式獲取

靜態資源獲取

    <link rel="stylesheet" href="css/style.default.css" id="theme-stylesheet">
    <!-- Custom stylesheet - for your changes-->
    <link rel="stylesheet" href="css/custom.css">

6.啓動項目訪問測試

 

7.訪問http://127.0.0.1:8080/index

值獲取，與靜態文件都可以了。