タイプセーフな HTML DSL

kotlinx.html ライブラリは、静的に型付けされた HTML ビルダーを使用して DOM 要素を生成する機能を提供します（JavaScript に加えて、JVM ターゲットでも利用可能です！）。ライブラリを使用するには、対応するリポジトリと依存関係を build.gradle.kts ファイルに追加します：

repositories {
    // ...
    mavenCentral()
}

dependencies {
    implementation(kotlin("stdlib-js"))
    implementation("org.jetbrains.kotlinx:kotlinx-html-js:0.8.0")
    // ...
}

依存関係を追加すると、DOM を生成するために提供されているさまざまなインターフェースにアクセスできるようになります。たとえば、見出し、テキスト、リンクをレンダリングするには、以下のスニペットで十分です：

import kotlinx.browser.*
import kotlinx.html.*
import kotlinx.html.dom.*

fun main() {
    document.body!!.append.div {
        h1 {
            +"Welcome to Kotlin/JS!"
        }
        p {
            +"Fancy joining this year's "
            a("https://kotlinconf.com/") {
                +"KotlinConf"
            }
            +"?"
        }
    }
}

この例をブラウザで実行すると、DOM が直感的な方法で組み立てられます。これは、ブラウザの開発者ツールを使用してウェブサイトの要素（Elements）を確認することで簡単に確認できます：

kotlinx.html ライブラリの詳細については、GitHub Wiki を確認してください。そこでは、DOM に追加せずに要素を作成する方法、onClick のようなイベントへのバインド、HTML 要素に CSS クラスを適用する方法など、多くの情報を見つけることができます。