introducing jee7 – jsf 2

Post on 10-Sep-2014

91 Views

Category:

Software

2 Downloads

Preview:

Click to see full reader

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

top related