little star's memory

競プロ、なぞなぞ、その他

Kotlinでサーバーサイドのお勉強 第2回 テンプレートエンジン

今回はMicronautでテンプレートエンジンを使う。

テンプレートエンジンはいくつか使える。その中でThymeleafを使う。以前Spring bootを触っていたときにも使っていたやつ。

Thymeleafを使おう

前回なんの機能も追加せずプロジェクトを作ったので、このままではThymeleafが使えない。そこでbuild.gradleのdependenciesに以下を追加する。

implementation("io.micronaut.views:micronaut-views-thymeleaf")

テンプレート

準備ができたら、HTMLファイルを作る。resources/views フォルダの中にindex.htmlを作る。

<!DOCTYPE html>
<html lang="ja" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>Home</title>
</head>
<body>
<section>
    <h1>ようこそ!<span th:text="${username}"></span>さん</h1>
    <p>あなたは<span th:text="${count}"></span>人目のお客様です</p>
</section>
</body>
</html>

usernameやcountに具体的な値が代入される。

コントローラー

最後に、前回作ったHelloController.ktを改修する。

package com.example

import io.micronaut.http.annotation.Controller
import io.micronaut.http.annotation.Get
import io.micronaut.http.HttpResponse
import io.micronaut.views.View

@Controller
class ViewController {
    @Get("/hello")
    @View("index")
    fun index(): HttpResponse<*>? {
        return HttpResponse.ok(mapOf("username" to "koboshi", "count" to 10000))
    }
}

これで、/helloにGetを飛ばしたときに、index.htmlがレンダリングされる。ここではmapを使っているけど、POJOでもいいらしい (ぽじょ?)。

実行

いざ実行。

できた。

まとめ

MicronautとThymeleafを使ってWeb開発を始めてみた。

次回はPost,Deleteあたりを復習する。

参考文献

micronaut-projects.github.io

kentama.hatenablog.com