“THE COST OF LEARNING”advantage of mixer2.org

@nabedge

DBFlute Fes at Shibuya, Tokyo

2015-11-21

http://connpass.com/event/21885/

Who?

● Yu Watanabe● Java Engineer● Bizreach.inc● Project Mixer2

http://mixer2.org

2

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>

The cost of learning

4

5

Productivity

▷ Type safe▷ Automatic

code generation

▷ Testability

▷ Convention over Configuration

▷ Framework

▷ The cost of learning

Learning Curve

6

How to reducecost to learn ?

7

8

★ No learn★ Use that you

already know

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

Thymeleaf attributes and utility objects

#ctx

#vars

#locale

#dates

#calendars

#numbers

#strings

#bools

#arrays

#lists10

#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

customization

11

1.1. Scenario 1: adding features to the Standard dialectsSay 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

Scinario1

12

admin non-adminMonday to Saturday

blue red

Sunday green green

<input type=”text” class=”COLOR” />

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();}

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 supporter7 .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

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

What is your GOAL ?

16

A. Learn technologyB. Write codeC. Launch product

““Done is better

than perfect .”

17

Done with ease by Mixer2

18

Thanks !

19