4,1. Información general


Capítulo 4. Escribiendo una Web Appl

Este capitulo explica las bases de como crear una Web App en Vaadin, explicando cada “elemento” de la App de un modo muy senzillo.

Si eres un novato en crear con AJAX, se explica en el Capitulo 12.1 “Rasgos especiales de las App Ajax”. Donde explica como trabaja AJAX con las Web App, y hay algunas recetas para Apps.


4,1. Información general

Una App hecha en Vaadin se usa como en un Servlet Java en un contenedor Servlet. La puerta de entrada es la classe “application - App”, és nessaria esta classe para crear i manejar todas “las piezas de interacciones del usuario”, incluyendo las ventanas. “Las interacciones de usuarios o sucessos” son manejadas con “los escuchadores de sucessos”, que simplifican la encuadernación de “las interacciones de los usuarios o sucessos” directamente en datos/numeros. La temática és creada con archibos CSS. Iconos, imagenes, i archibos descargables son manejados como “recursos”, todos ellos pueden encontrarse en fuentes externas, o en el server de la App, o en la App mismo.

La figura 4.1 Arquitectura de la App.

La figura 4.1, “Arquitecutra de la App” da una pinzelada basica a la arquitectura de una App hecha con “el cuadro de trabajo” de Vaadin, con todos lo elementos importantes, que se explican a continuacion con detalle en este capítulo.

Primero de todo una App en Vaadin tiene que tener una classe que se hereda de la “classe iconografica” “com.vaadin.Application”. La classe “Application - App” tiene que ejectur el paso “init() - inicio()”

public class MyApp extends com.vaadin.Application {

    public void init() { 
        ... initialization code goes here ...
    }
}

A parte de primero de todo actuar como puerta para el servlet, la classe App le hace mas fácil el accesso a las ventanas, controlar las ejutaciones, i seleccionar la temática. La App API es muy igual a la API Java Servlet, pero en este caso solo és superficial. El “cuadro de trabajo” de Vaadin agrupa solicitudes con sessiones para que una “fotografia de una classe App” se vuelva una “Session como objeto”. Gracias a esto puedes crear Webs App como si estubieras creando Apps para un escritorio.


Haciendo un reset a la session de la App

Cuando abres la URL de la App, crea una nueva session. La session se mantiene incluso si haces un REFRESH a la pagina. Pero cuando usas Eclipse, le gusta abrir rápidamente el Tomcat i vas a ver como la App no va a poder desconectarse de la anterior session. Tomcat le gusta guardar la session incluso cuando lo has cerrado.

Añadiendo el codigo “?restartApplication - ?reseteaLaApp” en la URL le dice al Servlet de Vaadin de crear “una nueva fotorgrafia App” al recargar la página. Si anyades codigo URI en la URL el codigo “?restartApplication” se tiene que dar antes que el codigo URL.

Lo mas important en el inicio és la creación de la “Ventana principal” (ver mas abajo), que todas la aplicaciones tienen que tener. Esto y el abrir la App como un Servlet Java en el contenedor Servlet, se encuentra mas detallado en el Capítulo 4.8 “Configuración del entorno de la App”, son los requisitos minimos de una App.

A continuación una visión general corta de los elementos básicos de una App:


Ventana:

Una App siempre tiene una "Ventana Principal, se describe en mas detalle en el Capitulo 4.2 “Manejando la ventana principal”. Una App puede tener cierto numero de “ventanas de niveles App”, todas incluidas en la misma “Session App”, se describe mas en el Capitulo 12.2 “Ventanas de niveles App”. Las “ventanas de niveles App” pueden contener “sub-ventanas” que no son del mismo “origen”, que són disenyos flotantes manejados dentro el navegador.


Piezas de interacciones del usuario:

Las interacciones se pueden hacer gracias a “las piezas de interacciones de los usuarios” que son creadas y colocadas por la App. “Las interacciones de los usuarios” con las piezas crea sucessos conectados a las piezas, y que la App maneja. La mayoria de piezas estan conectadas con datos usando “los pasos para datos”. Puedes crear tus propias “piezas de interacciones de los usuarios” ya sea heredando o creandola. Para mmas detalles sobre “las piezas de interacciones de los usuarios” mirar Capitulo 5 “Piezas de interacciones de los usuarios”, para “piezas de dissenyo” mirar Capitulo 6, “Manajando disenyo”, y para crear piezas, mirar Capitulo 5.23 “Creando piezas con PiezasPersonalizadas”.


Sucessos i Escuchadores:

Los sucessos, y los escuchadores que manejant sucessos, son las bases para manejar “las interacciones de los usuarios” en una App. El Capitulo 3.5 “Sucessos i Escuchadores” da una introduccion a los sucessos y los escuchadores desde una perspectiva arquitectonica, también el Capitulo 4.4 “Manejando Sucessos i Escuchadores” mas tarde en este Capitulo 4 ensenya una perspectiva mas “practica”.


Recursos:

Las interacciones de usuario pueden mostrar imagenes, o mostrar links a paginas web, o documentos descargables. Esto son recursos, que tan pueden ser externos, o distribuidos por el server, o por la aplicacion misma. En el capitulo 4.5 “Dirigiendo a recursos” da una visión practica de los distintos tipos de recursos.


Temáticas:

El escaparate de la pagina i la lógica o processos de “las interacciones de los usuarios” estan separados. Mientras que los pasos para “las interacciones de usarios” es manejado en lenguaje Java, el escaparate esta creado con temáticas usando CSS. Vaadin tiene escaparates Standard. Las tematicas creadas por el usuario, pueden a a diferencia de solo Plantillas de escaparates, incluir templates HTML que creant disenyos personalizados i otro tipo de recursos temáticos, como imagenes. Las temáticas son discutidas con mas detalle en el Capítulo 8 “Temáticas” Respecto a disenyos personalizados en el Capitulo 6.13 “Disenyos personalizados” i recursos temáticos en el capitulo 4.5.4 “Recursos Temáticos”.


Encuadernación de datos/numeros:

Las piezas con texto en el fondo són consultas de datos, exhibidos en “los pasos de datos”. Usando “los pasos de datos”, las piezas pueden recargar datos directamente, sin tener que pasar por un “control de codigo”. Los pasos de las piezas con texto estan siempre fusionadas a una “property - propiedad”, un objeto, o un contenedor, dependiendo del tipo de pieza con texto. Todas las piezas tienen un “pasos de datos” standard, pueden ser fusionadas a una fuente de datos definida por el usuario. Por ejemplo: puedes encuadernar una pieza-tabla a la respuesta de una consulta SQL. Para una vision genera sobre encuadernar datos en Vaadin, leer Capitulo 9 “Encuadernando datos con piezas”.