$30 off During Our Annual Pro Sale. View Details »
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
HTML5勉強会ライトニングトーク201309
Search
Yu Watanabe
September 09, 2013
Technology
0
110
HTML5勉強会ライトニングトーク201309
Yu Watanabe
September 09, 2013
Tweet
Share
More Decks by Yu Watanabe
See All by Yu Watanabe
JUnitテストをCI環境で並列で実行する方法とその速度, スケーラビリティ
nabedge
5
2.6k
クラウド時代だからSpring-Retryフレームワーク
nabedge
0
280
ツール比較しながら語るO/RマッパーとDBマイグレーション
nabedge
0
150
JavaでWebサービスを作り続けるための戦略と戦術
nabedge
0
83
サーバーサイドな人がフロントエンド技術と仲良くするはじめの一歩
nabedge
0
69
Selenium再入門
nabedge
0
53
Webエンジニアがスタートダッシュをキメるためのローカル開発環境の勘所
nabedge
0
74
テストゼロからイチに進むための戦略と戦術
nabedge
0
82
jOOQってなんて読むの?から始めるSpringBootとO/Rマッパーの世界
nabedge
0
130
Other Decks in Technology
See All in Technology
ソフトウェアエンジニアとAIエンジニアの役割分担についてのある事例
kworkdev
PRO
0
180
アラフォーおじさん、はじめてre:Inventに行く / A 40-Something Guy’s First re:Invent Adventure
kaminashi
0
110
NIKKEI Tech Talk #41: セキュア・バイ・デザインからクラウド管理を考える
sekido
PRO
0
200
半年で、AIゼロ知識から AI中心開発組織の変革担当に至るまで
rfdnxbro
0
120
まだ間に合う! Agentic AI on AWSの現在地をやさしく一挙おさらい
minorun365
17
2.4k
AWSの新機能をフル活用した「re:Inventエージェント」開発秘話
minorun365
2
410
AWS運用を効率化する!AWS Organizationsを軸にした一元管理の実践/nikkei-tech-talk-202512
nikkei_engineer_recruiting
0
160
『君の名は』と聞く君の名は。 / Your name, you who asks for mine.
nttcom
1
110
さくらのクラウド開発ふりかえり2025
kazeburo
2
620
JEDAI認定プログラム JEDAI Order 2026 エントリーのご案内 / JEDAI Order 2026 Entry
databricksjapan
0
170
意外と知らない状態遷移テストの世界
nihonbuson
PRO
1
220
SREが取り組むデプロイ高速化 ─ Docker Buildを最適化した話
capytan
0
130
Featured
See All Featured
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
141
34k
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
aleyda
0
1.8k
Information Architects: The Missing Link in Design Systems
soysaucechin
0
710
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
122
21k
Breaking role norms: Why Content Design is so much more than writing copy - Taylor Woolridge
uxyall
0
120
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.5k
Designing Powerful Visuals for Engaging Learning
tmiket
0
180
Leveraging LLMs for student feedback in introductory data science courses - posit::conf(2025)
minecr
0
88
End of SEO as We Know It (SMX Advanced Version)
ipullrank
2
3.8k
Exploring the relationship between traditional SERPs and Gen AI search
raygrieselhuber
PRO
2
3.4k
B2B Lead Gen: Tactics, Traps & Triumph
marketingsoph
0
32
Building Flexible Design Systems
yeseniaperezcruz
330
39k
Transcript
テンプレートエンジンは Mixer2に 決定しました Web✕Java - HTML5で 進化したWeb標準を、 Java技術でどう扱うの か? -
#html5biz 業務システムエンジニアのた めのHTML5勉強会#04 LT by @nabedge http://mixer2.org/
自己紹介 • わたなべ • SI屋の技術屋さん • @nabedge • http://nabedge.blogspot.jp 2
Mixer2 3 mixer2.org JavaでWebアプリを作るための テンプレートエンジン
そもそもテンプレートエンジンと言えば? 4
テンプレートエンジン 5 JSP:一番身近なテンプレートエンジン こんにちは <% if (name == null) {
%> ゲストさん <% } else { %> <%= name %>さん <% } %> 通常のJava言語、EL式、カスタムタグで書く
テンプレートエンジン 6 Velocity:老舗 こんにちは #if (name == null) { ゲストさん
#else ${name}さん #end VTL = Velocity Template Languageで書く
要するに? たいていのテンプレートエンジンは、 何らかの テンプレート記述言語(っぽいもの) を覚えなければならない 7
Mixer2 8 こんにちは <span id=“name”>ゲスト</span>さん Span span = html.getById(“name”, Span.class);
span.getContent.clear(); span.getContent.add(“ヤマダ”); // これで <span id=“name”>ヤマダ</span>さん // が出力 Mixer2のテンプレートは純粋なXHTMLとCSS 値の埋め込みやロジックは普通のJava
「タグ」とJava 9
Mixer2の特徴(の一つ) Mixer2では、htmlタグを Javaオブジェクトとして扱う ので、実質なんでもできる。 ex. さきほどデモした ダイナミックCSS Sprite 10 HTML5のタグや
data-*属性なども もちろんOK!
実際どうやって動いてるの? さっきのデモのアーキテクチャは? ...LTでは説明しきれません。 11
もっと詳しくお話しする場があります Javaに関することなら何でもありのゆるふわイベント 第3回 #渋谷Java - Webな人だってエンプラな人だって モヒカンだって - 2013/09/28(Sat) 14:00
to 17:00 http://atnd.org/events/42501 12
ご静聴ありがとうございました よろしくね! mixer2.org 13