Framework ZK
Conocimientos esenciales
Introducción
Contenido
- Valor y Puntos Fuertes de ZK
- Arquitectura de ZK
- Acerca de esta colección de artículos esenciales
- Aplicación de ejemplo
- Referencias
Valor y Puntos Fuertes de ZK
ZK es un framework basado en coponentes de interfaz de usuario. Te permite crear aplicaciones ricas de internet (RIA) y aplicaciones móviles sin tener que aprender JavaScript o Ajax. Puedes construir aplicaciones altamente interactivas y haceras responsive mediante Ajax únicamente programando en Java. ZK pone a tu disposición miles de componentes que están diseñados para varios propósitos, algunos para manejar grandes cantidades de datos y otros para recoger los datos que el usuario introduce. Además puedes usar nuestro lenguaje XML para crear las interfaces: ZUL.
Toda interacción que un usuario realice sobre una página, como hacer clic y escribir puede ser manejada en un Controlador de forma muy simple. Puedes usar los componentes para que respondan a la interacción del usuario en un controlador y estos cambios serán actualizados en los navegadores automáticamente. No necesitas preocuparte sobre los detalles de la comunicación entre el navegador y el servidor, ZK lo maneja por tí.
Adicionalmente para el manipular directamente componentes, como requiere el patrón MVC (Modelo-Vista-Controlador), ZK también pone a tu disposición otro patrón de diseño MVVM (Modelo Vista VistaModelo) que permite mayor separación entre el controlador y la vista. Estos 2 enfoques son totalmente intercambiables, únicamente siendo tú quien eliges en función de tu arquitectura.
Arquitectura de ZK
La imágen anterior es la arquitectura de ZK simplificada.
Cuando un navegador visita una página de un aplicación hecha con ZK, ZK crea los componentes que defina el fichero ZUL y los renderiza en el navegador. Puedes manipular los componentes directamente desde el controlador para implementar la lógica de la vista. Todos los cambios que hagas en los componentes será automáticamente reflejado en el navegador del usuario y ZK se encarga de abstraerte de la comunicación
Acerca de esta colección de artículos esenciales
Esta colección de artículos presenta los conceptos clave y prácticas para utilizar ZK desde la perspectiva que requiere crear una aplicación web. Cada capítulo cubre un tema, y te facilitamos uno o varios ejemplos para demostrarte lo que argumentamos en cada capítulo.
Cada ejemplo sigue al del capítulo anterior, iremos añadiendo más y más funciones. En el último capítulo, la aplicación de ejemplo se a cerca mucho a una aplicación real. El código fuente de las aplicaciones de ejmplo pueden ser descargadas a través de github, hablaremos en detalle de esto en el siguiente capítulo: Estructura de un proyecto
- Introducción
- Estructura de un proyecto
- Interfaz de usuario y Diseño
- Controlando Componentes
- Manejando la entrada de usuario
- Implementando CRUD (Crear Leer Actualizar y Borrar)
- Navegación y Plantillas
- Autenticación
- Integración con Spring
- Integración con JPA
Introducción a ZK, incluyendo su valor y sus puntos fuertes, resumen de su arquitectura.
Te enseñamos con ejemplos la estructura de un proyecto
En este punto te enseñamos a crear un diseño base que contenga cabecera, pié y sidebar
En este punto te enseñamos cómo controlar componentes mediante programación
Explicación al respecto de cómo interactuar con el usuario
Operaciones básicas de insertar, borrar, actualizar y leer sobre una aplicación de ejemplo real tipo lista de tareas
2 posibles formas de controlar la navegación en ZK, mediante páginas o mediante Ajax
Ejemplo simple de cómo implementar la autenticación de los usuarios
Cómo integrar Spring Framework con ZK
Te demostramos como usar JPA en una aplicación ZK
Aplicación de ejemplo
El resultado final de esta serie esencial de artículos es crear una pequeña y rica aplicación que disponga de las características más comunes como autenticación, navegación, formularios de entrada y una gestión de listas de tareas pendientes. A nivel de infraestructura se apoya en Spring y persiste la información mediante JPA.
La aplicación tiene un diseño común. La cabecera superior tendrá el icono de la aplicación y el título, y el pié inferior contendrá la información general. El área central mostrará la función principal. Debes loguearte para acceder al resto de funciones.
Una vez te hayas logueado, puedes ver la página principal. La barra lateral en el lado izquierdo es una barra de navegación que te permite cambiar entre diferentes funciones. Los primeros 3 elementos te llevarán a links externos. Habrá 2 funciones principales, perfil y lista de tareas pendientes, que han sido implementadas con los 2 enfoques, MVC y MVVM.
La siguiente imagen enseña la función de lista de tareas pendientes, puedes crear, actualizar y borrar cualquier elemento.
Referencias
- Ver los componentes online directamente en la ZK Demo
- ZK Developer's Reference MVC
- ZK Developer's Reference MVVM
Este documento es un extracto de la documentación oficial del Framework ZK, traducido y ampliado por Francisco Ferri. Colaborador de Potix (creadores del Framework ZK). Si quieres contactar con él puedes hacerlo en franferri@gmail.com, en twitter @franciscoferri o en LinkedIn