markup template engine introduced groovy 2.3
TRANSCRIPT
Groovy 2.3,2.4の新機能より、 「マークアップテンプレートエンジン」機能のご紹介
2014/12/19 NTTソフトウェア株式会社
上原潤二
Copyright (C) 2014 NTT Software Corp.
The Groovy Roadmap• Groovy 2.3
• 2.3.0(2014.5.5) • Groovy 2.4
• 2.4b1(2014.6.12) • 2.4b2(2014.7.29) • 2.4b3(2014.9.2) • 2.4b4(2014.11.27) • RC1,2,3… • Release(2015.初?)
• Groovy 3.0(2016?)
http://www.slideshare.net/SpringCentral/groovy-in-2014andbeyond?qid=c66045f1-fab4-44f8-
a86e-afccd3e7e56f&v=qf1&b=&from_search=3
Groovy 2.3新機能一覧• Trait • 新規AST変換
• @TailRecursive/@Builder/@Sortable/@SourceURI
• ライブラリ改良・拡張 • マークアップテンプレートエンジンの追加
• JSON Slurper
• ConfigSlurper • Java8/7対応 • JUnit4対応 • @ClosureParams • ツール拡張
• Groovysh • GroovyConsole
• ドキュメント改善
Groovy 2.4～beta4)新機能一覧
• Android対応
• ライブラリ改良・拡張
• toUnique(), toSorted()の追加
• init(), dropRight()、takeRight()の追加
• System.currentTimeSecond()の追加
• ツール拡張
• Groovysh
• -eオプション
• ローカル変数の型宣言
• SelfTypeアノテーション
• MacroGroovy/ASTMatcher→2.5へ
今日のテーマ
• マークアップテンプレートエンジン
• groovy.text.markup.MarkupTemplateEngine
継承階層
• SimpleTemplateEngineと同列 • MarkupBuilderのような記法のテンプレート
XML/HTMLを生成するDSLhtml { head { title "タイトル" } body { h1 "タイトル" ul { (1..10).each { li it } } } }
<html> <head> <title>タイトル</title> </head><body> <h1>タイトル</h1><ul> <li>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li><li>7</li><li>8</li><li>9</li><li>10</li> </ul> </body> </html>
機能• プログラマブルマークアップ言語
• HTML/XMLを生成 • 型チェック機能つき • インクルード • エスケープ • レイアウト
• http://beta.groovy-lang.org/docs/latest/html/gapi/groovy/text/markup/BaseTemplate.html#layout(java.util.Map, java.lang.String) • 国際化 • Grailsタグリブを呼び出す
• http://beta.groovy-lang.org/docs/latest/html/gapi/groovy/text/markup/TagLibAdapter.html
フレームワークにくみこまれ始めている
• Spring MVC 4のGroovyMarkupViewはそれである
• Spring Bootから呼んだり
• http://spring.io/blog/2014/05/28/using-the-innovative-groovy-template-engine-in-spring-boot
• Ratpackでも使える
今日は• マークアップテンプレートエンジンを使ってWebアプリケーションフレームワークを作っちゃおう!!
• マークアップテンプレートエンジンは、基本的には「文字列生成処理」なので、httpリクエストに繋げ、レスポンスを返す
• TemplateServletとのアダプタを作ればよい
これだけだpackage org.jggug.markup
import groovy.text.markup.MarkupTemplateEngine import groovy.text.markup.TemplateConfiguration
class ServletAwareMarkupTemplateEngine extends MarkupTemplateEngine { ServletAwareMarkupTemplateEngine() { super(new TemplateConfiguration(autoIndent:true, autoNewLine:true, expandEmptyElements:true)) } }
html { includeGroovy('head.tpl') body { nav (class:"navbar navbar-inverse navbar-fixed-top", role:"navigation") { div (class:"container") { div (class:"navbar-header") { button (type:"button", class:"navbar-toggle collapsed", 'data-toggle':"collapse", 'data-target':"#navbar", 'aria-expanded':"false", 'aria-controls':"navbar") { span class:"sr-only", "ナビゲーションの切替" span class:"icon-bar" span class:"icon-bar" span class:"icon-bar" } a(class:"navbar-brand", href:"#", yield "Bootstrap theme") } div (id:"navbar", class:"navbar-collapse collapse") { ul (class:"nav navbar-nav") { li (class:"active") { a (href:"#", "Home") } li { a (href:"#about", "About" ) } li { a (href:"#contact", "Contact" ) } li (class:"dropdown") { a (href:"#", class:"dropdown-toggle", 'data-toggle':"dropdown", role:"button", 'aria-expanded':"false", "Dropdown"; span class:"caret" ) ul (class:"dropdown-menu", role:"menu") { li { a (href:"#", "Action" ) }
デモBootstrapのHTML/CSSのサンプルを機械的に変換。つらい。
web.xml <web-app> <servlet> <servlet-name>template</servlet-name> <servlet-class>groovy.servlet.TemplateServlet</servlet-class> <init-param> <param-name>template.engine</param-name> <param-value>org.jggug.markup.ServletAwareMarkupTemplateEngine</param-value> </init-param> </servlet> <servlet-mapping> <servlet-name>template</servlet-name> <url-pattern>*.tpl</url-pattern> </servlet-mapping> <welcome-file-list> <welcome-file>index.tpl</welcome-file> </welcome-file-list> </web-app>
war. ├── META-INF │ └── MANIFEST.MF ├── WEB-INF │ ├── classes │ │ ├── META-INF │ │ ├── cars.tpl │ │ ├── defer.tpl │ │ ├── head.tpl │ │ ├── index.tpl │ │ ├── list.tpl │ │ ├── navi.tpl │ │ ├── org │ │ │ └── jggug │ │ │ ├── Car.class │ │ │ └── markup │ │ │ ├── ServletAwareMarkupTemplateEngine.class │ │ │ └── ServletAwareTypeCheckedMarkupTemplateEngine.class │ │ ├── sample.tpl │ │ └── typechecked │ │ └── index.stpl │ ├── lib │ │ └── groovy-all-2.4.0-beta-4.jar │ └── web.xml ├── cars.tpl ├── defer.tpl ├── head.tpl ├── index.tpl ├── list.tpl ├── navi.tpl ├── sample.tpl └── typechecked └── index.stpl
includeするにはclasspathにある必要があり、暫定的に二重保持
型チェックつきにするpackage org.jggug.markup import groovy.text.markup.MarkupTemplateEngine import groovy.text.markup.TemplateConfiguration import groovy.text.Template class ServletAwareTypeCheckedMarkupTemplateEngine extends MarkupTemplateEngine { HashMap<String,String> modelTypes = [ request:'javax.servlet.http.HttpServletRequest', response:'javax.servlet.http.HttpServletResponse', context:'javax.servlet.ServletContext', application:'javax.servlet.ServletContext', session:'javax.servlet.http.HttpSession', params:'Map', headers:'LinkedHashMap<String, String>' ]
ServletAwareTypeCheckedMarkupTemplateEngine() { super(new TemplateConfiguration(autoIndent:true, autoNewLine:true, expandEmptyElements:true)) } Template createTemplate(Reader reader) { createTypeCheckedModelTemplate(reader, modelTypes) } Template createTemplate(Reader reader, String sourceName) { createTypeCheckedModelTemplate(reader, sourceName, modelTypes) } Template createTemplate(URL resource) { createTypeCheckedModelTemplate(resource, modelTypes) } }
型情報の与え方 HashMap<String,String> modelTypes = [ request:'javax.servlet.http.HttpServletRequest', response:'javax.servlet.http.HttpServletResponse', context:'javax.servlet.ServletContext', application:'javax.servlet.ServletContext', session:'javax.servlet.http.HttpSession', params:'Map', headers:'LinkedHashMap<String, String>' ]
createTypeCheckedModelTemplate(reader, modelTypes)
文字列で!
型エラー
javax.servlet.ServletException: Creation of template failed: org.codehaus.groovy.control.MultipleCompilationErrorsException: startup failed: GeneratedMarkupTemplate0: 4: [Static type checking] - No such property: foo for class: javax.servlet.http.HttpServletRequest @ line 4, column 33. h1 { yield "request.foo="+request.foo } ^
html { body { h1 "headers="+headers.'user-agent' h1 "request.foo="+request.foo } }
プログラミングHTML: Helper Functions
def container(clos) { div (class:"container") { clos.call() } } def row(clos) { div (class:"row") { clos.call() } } def col_md(n, clos) { div (class:"col-md-"+n) { clos.call()
} } def header(s) { div (class:"page-header") { h1 s } } def alert(s, clos) { div (class:"alert alert-$s", role:"alert", clos) }
Programming HTML: You can writecontainer {
row { col_md(2) { header "サイドバーの表示" } col_md(10) { header "メインの表示" alert('success') { strong "Well done!" yield "You successfully read this important alert message." } alert('info') { strong "Heads up!" yield "This alert needs your attention, but it's not super important." } } }
Simpler and Tidy way
まとめ• MarkupTemplateEngineは、 新世代型付きDSL実装の模範コード。
• 以下を使用して実装 • 型チェッカ拡張(TypeChecking Extension)
• aka (カスタムタイプチェッカ)Custom Type Checker) • CompilerConfiguration
• プログラミング言語のフル機能を使ってマークアップ • 抽象化、型システム、モジュラリテイ、合成、部品化 • HTML+CSSのような言語もどきではなく
参考リンク• http://groovy.codehaus.org/Groovy%202.3%20release%20notes
• https://jira.codehaus.org/secure/ReleaseNote.jspa?projectId=10242&version=20369
• https://jira.codehaus.org/secure/ReleaseNote.jspa?projectId=10242&version=20433
• https://jira.codehaus.org/secure/ReleaseNote.jspa?projectId=10242&version=20544
• https://jira.codehaus.org/secure/ReleaseNote.jspa?projectId=10242&version=20612
• http://www.slideshare.net/rstoya05/spring-4-web-app
• http://spring.io/blog/2014/05/28/using-the-innovative-groovy-template-engine-in-spring-boot