ScalaTags, Html Element를 편하게 작성하자

Scala.JS나 Akka Http처럼 스칼라 자체에서 html을 작성해야 하는 경우에 모든 것을 텍스트로 처리하기는 곤란하다. 아무리 s"$variable" 같은 스트링 인터폴레이션이 지원된다 하더라도, 엘리먼트 안에 엘리먼트가 존재하는- hierarchy 형태라면 제대로 태그를 닫았는지도 의심스럽다.

ScalaTags를 사용하면 그런 고민에서 벗어날 수 있다. 사실 너무 간단해서 한번 보면 누구나 사용할 수 있을테지만.

0. Dependency 추가, Import문 작성

libraryDependencies += "com.lihaoyi" % "scalatags_2.11" % "0.6.5"

import scalatags.Text.all._

ScalaTags 역시 명시적으로 import문을 작성해야 한다. µPickle 개발자라 그런가.

1. 예제들

val h1Text = h1(`style` := "color:red")("Hello World!").render
println(h1Text) // <h1 style="color:red">Hello World!</h1>



val divText = div(`class`:="col-xs-12")(
                span(`class`:="col-xs-6")("Left"),
                span(`class`:="col-xs-6")("right")
              ).render
println(divText) // <div class="col-xs-12"><span class="col-xs-6">Left</span><span class="col-xs-6">right</span></div>



val depth3DivText = div()(
                            div()(
                              div()("div in div in div")
                            )
                          ).render
println(depth3DivText) // <div><div><div>div in div in div</div></div></div>



val btnText = button(`class`:="btn btn-default", onclick:="showDialog()")("button!").render
println(btnText) // <button class="btn btn-default" onclick="showDialog()">button!</button>

별다른 설명이 필요할 것 같지는 않다. 첫번째 파라미터 그룹에 class나 style, onclick같은 속성을 작성한 후, 만들어진 Html Element를 String으로 변환하는 render 함수를 호출하면 된다. 'class'나 'type' 같은 스칼라 예약어는 ` `로 감싸 사용한다.