Apps Web em Wicket e Scala no GlassFish Java EE 6

Apps Web em Wicket e Scala no GlassFish JEE 6 Apache Wicket + Scala + Java EE 6

Quem sou eu? twitter: @brunoborges www.brunoborges.com [email_address]

Agenda
Desenvolvimento Web
Apache Wicket
Scala
GlassFish Java EE 6
Projeto Gamboa

Desenvolvimento Web é ágil?
Para a galera dessas tecnologias, sim

Designers vs Developers

De quais projetos estamos falando?
“Pixel Perfect”
Aplicação do jeito que o cliente desenhou
Um Web Designer
Ou uma equipe só de designers
Prototipação
Alterações no protótipo refletem na aplicação

O que ajuda o designer?

Isso ajuda também... e MUITO PREVIEW NO BROWSER

Fazemos isso?
public class LoginAction extends ActionSupport { public void login() { Connection c = getConnection(); Statement st = c.createStatement(); ResultSet rs = st.executeQuery(“SELECT * FROM USUARIO WHERE ID = “+usuario); setAutenticado(rs.hasNext()); } }
Struts Consulta JDBC ???

Separação de Camadas

Interface do Usuário
Esta camada também pode ser quebrada em subcamadas
Uma para o web designer
Outra para o web developer

É preciso uma melhor marcação HTML
< html xmlns="http://www.w3.org/1999/xhtml"> <head><title></title></head> < body > < form > <span>Nome:</span> <input type="text" /> <input type="submit" value="Submit" /> </ form > </ body > </ html >
Isto é o que o Web Designer faz Também é o que o usuário recebe no browser

E se...
Pudéssemos ter uma tecnologia que não altera (em “quase” nada) o que o Web Designer fez?

< html xmlns="http://www.w3.org/1999/xhtml"> <head><title></title></head> < body > < form > <span>Nome:</span> <input type="text" /> <input type="submit" value="Submit" /> </ form > </ body > </ html >

< html xmlns="http://www.w3.org/1999/xhtml"> <head><title></title></head> < body > < form wicket:id="form" > <span>Nome:</span> <input wicket:id="nome" type="text" /> <input type="submit" value="Submit" /> </ form > </ body > </ html >

Tipos de Marcação XHTML Declarativa (Wicket, Tapestry e poucos outros) <form action=”salvar”> <input type=”text” name=”nome” /> <input type=”submit” value=”Salvar” /> </form> <form wicket:id=”form” > <input type=”text” wicket:id=”nome” /> <input type=”submit” wicket:id=”salvar” /> </form> Bom para o Web Designer e navegador!

Tipos de Marcação XHTML Imperativa (JSF, Struts, SpringMVC, Play!, Ruby on Rails, PHP, Python ...) <form action=”salvar”> <input type=”text” name=”nome” /> <input type=”submit” value=”Salvar” /> </form> < s:form action=”salvar”> < s:input property=”nome” /> < s:submit value=”Salvar” /> </ s:form > O ser humano não nasceu para fazer isso … :-( E nenhum navegador nasceu para renderizar isso …

Apache Wicket

Apache Wicket
Framework Web
Nasceu em 2005
Desde 2008 sob a gerência da Apache Software Foundation
HTML puro
Não utiliza Taglibs
Java puro
Desenvolvimento similar ao Swing (calma! Não tem GridBagLayout)
Orientado a Componentes

Java + HTML
<span wicket:id = ” msg ” > msg de sistema </span> + new Label( “ msg ” , “ We Develop ”); = <span> We Develop </span>

HTML protótipo
/MyHomePage.html <html> <head><title>Apache Wicket</title></head> <body> <span>msg dinamica</span> <form> Nome: <input type=”text” /> Email: <input type=”text” /> <input type=”submit” value=”Enviar” /> </form> </body> </html>

Marcação não intrusiva
/MyHomePage.html <html> <head><title>Apache Wicket</title></head> <body> <span wicket:id=” msg ” >msg dinamica</span> <form wicket:id=” form ” > Nome: <input type=”text” wicket:id=” nome ” /> Email: <input type=”text” wicket:id=” email ” /> <input type=”submit” value=”Enviar” /> </form> </body> </html>

Toda a lógica da UI: em Java
/MyHomePage.java public class MyHomePage extends WebPage { public HomePage() { add(new Label ( “msg” , “We Develop!” )); Form form = new Form(“ form ”) { public void onSubmit() { servico.salvar(getModelObject()); } }; form.add(new TextField(“ nome ”)); form.add(new TextField(“ email ”)); add(form); } }
Puro Java e Orientação a Objetos. Sem mágica

O mínimo de configuração
<filter> <filter-name>wicket.app</filter-name> <filter-class> org.apache.wicket.protocol.http.WicketFilter </filter-class> <init-param> <param-name>applicationClassName</param-name> <param-value>code.webapp.MyApplication</param-value> </init-param> </filter> /MyApplication.java package code.webapp; public class MyApplication extends WebApplication { public Class< MyHomePage > getHomePage() { return MyHomePage .class; } }

Extensível Gmap2 gmap = new Gmap2(“map”); page.add(gmap); <div wicket:id=”map”> Google Maps </div>

Ajax
Suporte nativo
Diversos componentes prontos
Alguns com “ Fallback ” quando não há suporte Ajax ou total ausência de JavaScript
Inclusão automática e dinâmica de CSS e JavaScript dependidos de componentes
Um console para debug de requisições Ajax

Ajax
// HTML < span wicket:id=”counter”>contagem</span> < a href =”#” wicket:id=”counterLink”> incrementar </ a > // JAVA int counter = 0; Label counterLabel = new Label(“ counter ”); add(counterLabel); add(new AjaxLink(“counterLink”) { public vond onClick(AjaxRequestTarget target) { counter++ ; counterLabel .setModelObject( counter ); target.addComponent( counterLabel ); } });

Composição de Páginas: por herança
Base.html
Layout.html
Login.html
Base.java
Layout.java
Login.java

Base.html <html> <head> … </head> <body> <wicket:child /> </body> </html>
Base.java class Base extends WebPage

Layout.html <html> <head> … </head> <body> <wicket:extend> <div id=”header”> … </div> <div id=”content”> <wicket:child /> </div> <div id=”footer”> … </div> </wicket:extend> </body> </html>
Layout.java class Layout extends Base

Login.html <html> <head> … </head> <body> <div id=”header”> … </div> <div id=”content”> <wicket:extend> <form wicket:id=”loginForm”> … </form> </wicket:extend> </div> <div id=”footer”> … </div> </body> </html>
Login.java class Login extends Layout

Scala
Linguagem Orientada a Objetos
E no fundo, é Java
Linguagem funcional
Estaticamente tipada
É extensível
Permite facilmente desenvolver DSLs
var foo = 8 foo = “bar”
Type mismatch; found: String(“bar”) required: Int

Scala: Funções
São representadas como valores também, como objetos val func = () ⇒ { println(“functional programming”) } def chamaFuncao(paramFuncao: () ⇒ Unit) ={ paramFuncao() } chamaFuncao(func)

Scala: Construções inteligentes
A linguagem é rica em construções inteligentes val lista1a9 = 1 to 9 toList lista1a9 .foreach (i ⇒ print(i)) for (i ← lista1a9) { print(i) } val strings = new Array[String](3) strings(0) = “Hello” strings(1) = “World” strings(3) = “!”

val listaA = List(1, 2) val listaB = List(3, 4) val listaC = listaA :: listaB // listaC é uma nova List val listaD = listaC :: 5 print(listaD) // saida: List(1,2,3,4,5)

val map = new HashMap[Int, String] treasureMap += 1 -> "Numero 1" treasureMap += 2 -> "Numero 2" treasureMap += 3 -> "Numero 3" println(map(2)) // '2' é a key , não o indice // saida: “Numero 2” val romanos = Map(1 -> "I", 2 -> "II", 3 -> "III", 4 -> "IV", 5 -> "V") println(romanNumeral(4)) // saida: “IV”

Wicket+Scala: antes, em Java
/MyHomePage.java public class MyHomePage extends WebPage { @Inject private Servico servico; public HomePage() { add(new Label ( “msg” , “We Develop!” )); Form form = new Form(“ form ”) { public void onSubmit() { servico.salvar(getModelObject()); } }; form.add(new TextField(“ nome ”)); form.add(new TextField(“ email ”)); add(form); } }

Depois, em Scala
/MyHomePage.scala class MyHomePage extends WebPage { @Inject var servico = _ add(new Label ( “msg” , “We Develop!” )) object form extends Form(“ form ”) { add(new TextField(“ nome ”)) add(new TextField(“ email ”)) override def onSubmit() = { servico.atualizar() } } add(form) }

Scala: Uma DSL para Wicket
/MyHomePage.scala class MyHomePage extends WebPage with DSLWicket { @Inject var servico = _ label( “msg” , “We Develop!” ) val onsubmit = () ⇒ servico.atualizar() val f = form(“ form ”, onsubmit) f.textField[String](“ nome ”) f.textField[String](“ email ”) }

GlassFish JavaEE 6

GlassFish
Java EE 6
CDI
Maven Embedded Plugin
Derby

Java EE 6 + Wicket
Usar @Inject ao invés de @EJB
Validação de forms com Bean Validation
JSR303 Validation
http://www.java.net/blogs/jjviana
Não precisa de web.xml

Java EE 6 + Wicket + Scala
Sem mais web.xml
package code.webapp import javax.servlet.annotation.{ WebFilter, WebInitParam } import org.apache.wicket.protocol.http.WicketFilter @WebFilter(value = Array("/*"), initParams = Array( new WebInitParam(name = "applicationClassName", value = "code.webapp.MyApplication"), new WebInitParam(name = "filterMappingUrlPattern", value = "/*") )) class MyAppFilter extends WicketFilter

Scala e Entity Beans JEE6
Usar a anotação @BeanProperty para gerar getters/setters
package code.data import scala.reflect.BeanProperty import javax.persistence.{ Id, GeneratedValue } trait Identifiable extends Serializable { @Id @GeneratedValue @BeanProperty var id: String = _ }

Outros links
http://bit.ly/jee6wicketprezi (via @jjviana J1 US)
http://wicket.apache.org
http://github.com/42Lines/wicket-cdi
http://www.gamboa-project.org

Juntando os 3 Apache Wicket + Scala + JavaEE 6 _________________ Projeto Gamboa www.gamboa-project.org

Obrigado Bruno Borges [email_address] www.cursodewicket.com

Apps Web em Wicket e Scala no GlassFish Java EE 6

by Bruno Borges

Accessibility

Categories

Upload Details

Usage Rights

1 Embed 1

Statistics

Apps Web em Wicket e Scala no GlassFish Java EE 6 Presentation Transcript