Mi cursada - UNQ‎ > ‎Clases‎ > ‎Bitácoras‎ > ‎Bitácoras 2011 S1‎ > ‎

Lunes 25/04/2011 - Web con Apache Wicket Framework

publicado a la‎(s)‎ 25 abr. 2011 12:28 por Nicolas Passerini   [ actualizado el 25 abr. 2011 17:57 por gisela decuzzi ]
Vamos a saltearnos un par de años sin penas ni glorias (a nuestro parecer) de la industria desde que surgió el api de servlets y jsp, como vimos en la clase pasada, para ver un framework un poco más reciente (algo así como 3, 4 años) llamado apache wicket.

Para eso vamos a ir bien a lo concreto e ir mostrándolo mediante código y haciendo evolucionar un ejemplo.
Entonces, lo planteamos en iteraciones:

Iteración 1 : ejemplo básico casi "hola mundo"

  • Crear aplicación básica con el archetype de maven para wicket, siguiendo las instrucciones que estàn en esta página.
  • Mostrar la estructura de la aplicación
    • objeto Application
    • HomePage (el concepto de página es distinto al de JSP).
    • html (wicket:id)
    • Label
  • Arrancar app y mostrarla en el browser.
  • Modificar el html y ver los cambios.
  • F5 crea una nueva página.

Observaciones:
  • el html no se ensucia (diseñador gráfico / programador)
  • orientado a componentes (a la swing)
  • fase de rendering (cada componente procesa su tag).

Iteración 2 : links y ciclo de vida de página 1.

  • agregar otro label que muestre un contador (solo en el html y que explote)
  • agregar links de incrementar/decrementar el contador. Y mostrar:
    • que refresca toda la página completa (se resetea el scroll).
    • abrir en otro tab, contador en cero (wicket se da cuenta del "multitab", además de soportar multisesiones asiladas).


Iteración 3: ajax

  • modificar el boton por un AjaxLink
    • ver que cambia el método.
    • ver que tenemos que guardarnos una referencia y explicitar qué componentes hay que actualizar del lado del cliente.
    • refactorizar para reutilizar código entre acciones (chiche)
  • va a explotar por el setOutputMarkupId (agregarlo)
  • mostrar la magia!
  • poner un system.out para que lo crean ! :)
  • mostrar que no interfiere con otro tab / usuario

Observaciones:
  • no necesitamos nada de javascript
  • ajax está modelado con objetos.
  • wicket se encarga de refrescarlos, solo tenemos que decirle qué componentes.
  • la página sigue siempre viva! la misma instancia! misma variable contador!

Iteración 4: utilizando MVC

  • sacar el contador a un modelo Contador.
    • ver que explota el label de "contador" porque busca la property en HomePage.
      • mostrar que usa convention over configurationm, el id es la property.
    • ver que los labels son diferentes:
      • uno tiene un valor fijo, hardcodeado
      • el otro sale del modelo.

Observaciones:
  • Como la página es un objeto vivo, también su modelo.
  • se parece a la idea de MVC (y luego de MMVC) que vimos en arena.
  • el modelo puede ser un objeto normal POJO (plain old java object)
  • ahora duplicamos la lógica del target ajax :(
    • en Contador.contador vs HomePage.contadorLabel se ve el paralelismo entre modelo-vista. Suena un poco a "duplicidad".
    • Con observers se podría llegar a codificar un mecanismo genérico para actualizar componentes ajax según los eventos del modelo.

Iteración 5: Navegación y ciclo de vida de páginas 2

Paso 1: páginas nuevas sin estado compartido
  • agregar una nueva página que solo muestre un label (no tiene mucho sentido a nivel de negocio, pero es solo para simplificar).
  • agregar un link que vaya a la página nueva con el class
  • en la página nueva, agregar un link de "volver"

Observaciones:
  • Vuelve a una instancia de la página, nueva.
  • Cómo comparto un modelo entre páginas ?

Paso 2: ir a página nueva, pasando estado
  • que el link instancie la página y le pase el contador
  • que la página muestre el contador.
  • que el back vuelva a una instancia nueva... (problemas! ....

Paso 3: volver a la misma instancia de la página original
  • que la nueva página conozca a la original
  • que vuelva a la misma instancia.

Comments