introducing jee7 – jsf 2
DESCRIPTION
TRANSCRIPT
INTRODUCING JEE7 – JSF 2.2Experimenting with JSF – HTML5 – Bootstrap CSSMichalis KouziakisJava developer since 2004 – SCJP 5
JEE 7
Released as JSR 342 on May, 2013 New features:
JSF 2.2 Websockets - JAX-RS 2.0 – JSON API CDI 1.1 – Interceptors 1.2 Concurrency utilities 1.0 (JSR 236) JTA 1.2 @Transactional annotation
For more info . . .http://www.slideshare.net/glassfish/fifty-feature-of
JSF 2.2 BIG TICKET FEATURES
HTML 5 support and passthrough attributes
Faces flows Resource library contracts Stateless views
HTML 5 SUPPORT
Passthrough attributes Passthrough elements
HTML 5 PASSTHROUGH ATTRIBUTES
From a JSF page, pass-through attributes can be set in 3 ways: Name-spaced attribute on the component
tag tag f:passThroughAttribute that sets a
single attribute tag f:passThroughAttributes that sets
multiple attributes
HTML 5 PASSTHROUGH ATTRIBUTES
namespaced attribute
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:p="http://xmlns.jcp.org/jsf/passthrough"> <h:body> <h:form id="myform"> <h:inputText id="myfield" p:placeholder="Enter text"/> </h:form> </h:body></html>
transforms into this:
<input id="myform:myfield" type="text" name="myform:myfield" placeholder="Enter text" />
HTML 5 PASSTHROUGH ATTRIBUTES
f:passThroughAttribute
<h:form id="myform"> ><h:inputText id="myfield" value="#{bean.value}" > <f:passThroughAttribute name="placeholder" value="Enter text" /></h:inputText >
</h:form>
also transforms into this:
<input id="myform:myfield" type="text" name="myform:myfield" placeholder="Enter text" />
HTML 5 PASSTHROUGH ATTRIBUTES
f:passThroughAttributes
<h:form id="myform"> ><h:inputText id="myfield" value="#{bean.value}" > <f:passThroughAttributes value="{"one":1, "two":2, "three":3}" /></h:inputText >
</h:form>
HTML 5 PASSTHROUGH ELEMENTS
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:jsf="http://xmlns.jcp.org/jsf"><head jsf:id="head"><title>JSF 2.2</title></head><body jsf:id="body"> <form jsf:id="form"> <input type="text" jsf:id="name" placeholder="Enter name" jsf:value="#{bean.name}"/> <button jsf:action="#{bean.save}">Save</button> </form></body></html>
HTML 5 PASSTHROUGH
+ Create an application as static HTML files first and then easily embed the JSF code
+ Use popular CSS and Javascript tools and frameworks
+ Easier to delegate work related to the UI to web designers
- Mix HTML and JSF code
FACES FLOWS
Checkout Pay Confirm
FACES FLOWS
Group of related views
FACES FLOWS
<flowname>_flow.xml
FACES FLOWS
Flow scoped beans (@FlowScoped)
@Named(“checkoutBean")@FlowScoped(“Checkout")public class CheckoutBean {
}
FACES FLOWS
Define initializers and finalizers
<flow-definition id="Checkout"> <flow-return id="returnFromCheckout">
<from-outcome>/index</from-outcome></flow-return><initializer>#{checkoutBean.startFlow()}
</initializer> </flow-definition>
FACES FLOWS
Other features
You can embed one flow into another You can pass parameters from the parent to the
child flow You can return values from the child to the parent
flow You can define “switch nodes” You can reuse the flow in other projects
FACES FLOWS
Problem
You have to define all your exit points and use one of these to exit the flow, otherwise flow is not terminating.
RESOURCE LIBRARY CONTRACTS
Started as a “big ticket” feature which would provide custom “themes” to an application
Included as a minimal “templating” feature…
Basic problem is that these templates does not change dynamically during the runtime
STATELESS VIEWS
Helps dealing with ”ViewExpiredException”
Possibly lower memory consumption and better performance
Proprietary for Mojarra implementation for now…
<f:view xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"
transient="true"
CASE STUDY – PROJECT DESCRIPTION Web, multiuser application Consists mostly of data entry screens
and reports
CASE STUDY – PROJECT DESCRIPTION Will eventually become a product,
customization like custom themes maybe necessary
Web and graphic designers can help creating the initial design or do the customization after the development
CASE STUDY - THOUGHTS
Since the app consists mostly of data entry screens and reports, JSF seems to be a good choice…
There are web designers to do the design but they work with HTML and CSS and they use popular frameworks like Bootstrap CSS
It is not easy to combine ie Primefaces with Bootstrap CSS or other CSS Frameworks.
CASE STUDY - THOUGHTS
2 options Component library like Primefaces,
Icefaces or other Mojarra implementation with JEE 7 and
Bootstrap CSS(or some other CSS framework)
CASE STUDY –COMPONENT LIBRARY
Easier for the developer to create a UI and implement complicated features like multi file uploading etc.
More difficult for the designers to create a design, they will probably need some training related to the component library i.e. how to create a custom theme, how to layout components, how to optimize it for mobile devices etc etc etc …………..
CASE STUDY – JSF 2.2
Both developers and designers can start working from the day one in the project
Each team can use their own tools, no-one has to be trained to do something new
It will probably take more time but you can you resources more efficiently
The design will probably be better since there are not any limitations for the designers
REFERENCES
Books Beginning Java EE 7 by Antonio Goncalves
Java EE 7 Recipes by Josh Juneau
Links Fifty Features of Java EE 7 in 50 Minutes What's new in JSF 2.2? Forward Everyday: JSF 2.2: View Action A comprehensive example of JSF’s Faces Flow HTML5 support in JSF 2.2 with Bean Validation 1
.1 (JavaEE 7)