The advangage of Mixer2 - Java Template Envine - is the cost of learning .

1. “THE COST OF LEARNING”
advantage of mixer2.org
@nabedge
DBFlute Fes at Shibuya, Tokyo
2015-11-21
http://connpass.com/event/21885/

2. Who?
● Yu Watanabe
● Java Engineer
● Bizreach.inc
● Project Mixer2
http://mixer2.org
2

3. What is mixer2 ?
3
Template = 100% pure HTML & CSS
View = Plain Java
Hello <span id=”name”>foo bar</span>
Span span = html.getById(“name”, Span.class);
span.replaceInner(“World !”);
// You get
// Hello <span id=”name”>World !</span>

4. The cost of learning
4

5. 5
Productivity
▷ Type safe
▷ Automatic
code
generation
▷ Testability
▷ Convention
over
Configuration
▷ Framework
▷ The cost of learning

6. Learning Curve
6

7. How to reduce
cost to learn ?
7

8. 8
★ No learn
★ Use that you
already know

9. 9
What do you know ?
▷ Java
▷ HTML/CSS
▷ Eclipse or IntelliJ
▷ JSP + Custum tag
▷ VTL (Velocity Template Language)
▷ FTL (Freemarker Template
Language)
▷ Thymeleaf property + OGNL

10. Thymeleaf attributes
and utility objects
#ctx
#vars
#locale
#dates
#calendars
#numbers
#strings
#bools
#arrays
#lists
10
#sets
#maps
#aggregates
#messages
#ids
…
…
…
th:if
th:unless
th:text
th:class
th:attr
th:include
th:replace
th:each
th:switch
th:remove

11. customization
11
1.1. Scenario 1: adding features to the Standard dialects
Say your application uses the SpringStandard dialect and that it needs to show an alert text
box in blue or red background depending on the user’s role (admin or non-admin) from
Monday to Saturday, but always in green on Sundays. You can compute this with conditional
expressions on your template, but too many conditions could render your code a little bit hard
to read…
Solution: create a new attribute called alertclass and an attribute processor for it (Java code
that will compute the right CSS class), and package it into your own MyOwnDialect dialect.
Add this dialect to your template engine with the th prefix (same as the SpringStandardone)
and you’ll now be able to use th:alertclass="${user.role}"!
http://www.thymeleaf.org/doc/tutorials/2.1/extendingthymeleaf.html

12. Scinario1
12
admin non-admin
Monday to
Saturday
blue red
Sunday green green
<input type=”text” class=”COLOR” />

13. solution with thymeleaf
13
<input type=”text” th:alterclass=”${user.role}”
public interface IDialect {
public String getPrefix();
public Set<IProcessor> getProcessors();
public Map<String,Object> getExecutionAttributes();
public Set<IDocTypeTranslation> getDocTypeTranslations();
public Set<IDocTypeResolutionEntry> getDocTypeResolutionEntries();
}

14. lastaflute-mixer2 view class
14
1 public class SigninView extends OrleansBaseView {
2 private final ColorService colorService;
3 ...
4 protected void render(Html html, Mixer2Supporter supporter) {
5 Body body = html.getBody();
6 supporter
7 .findById(body, "account", Input.class)
8 .alwaysPresent(input -> {
9 input.setValue(form.account);
10 input.addCssClass(colorService.choice());
11 });
https://github.com/lastaflute/lastaflute-example-maihama/blob/master/maihama-
orleans/src/main/java/org/docksidestage/app/web/signin/SigninView.java

15. 15
To use Mixer2, You need
▷ Java
▷ HTML/CSS
▷ Eclipse or IntelliJ
▷ JSP + Custum tag
▷ VTL (Velocity Template Language)
▷ FTL (Freemarker Template
Language)
▷ Thymeleaf property + OGNL

16. What is your GOAL ?
16
A. Learn technology
B. Write code
C. Launch product

17. ““Done is better
than perfect .”
17

18. Done with ease
by Mixer2
18

19. Thanks !
19