WebSocket con Java

WebSockets con JavaEn este artículo aprenderemos a implementar WebSocket con Java, ya que en el pasado ya había dado una completa Introducción a los WebSocket y explicamos que estos fueron introducidos como una mejora en HTML5, pero también dijimos que los WebSocket son ejecutados por el navegador, y estos requieren de dos partes, un WebSocket cliente (Navegador) y un WebSocket Server (Backend). Pues bien, ya habíamos platicado como es que los WebSocket funcionan del lado del navegador, es por eso que ahora hablaremos de la otra cara, los WebSocket Server.

Como el título de este articulo lo dice, hablaremos de cómo implementar los WebSocket utilizado Java como BackEnd, pero cabe mencionar que todos los lenguajes de programación deberían de tener sus propias API’s para soportar conexiones del lado del servidor.  Los WebSocket fueron agregados a apartar de la versión Java EE 7 bajo la especificación JSR 356, es por ello que todos los Application Server certificados para Java EE 7 deberán de tener una implementación estándar de dicha especificación. Basta de charla y pasemos a cómo implementar un WebSocket con Java.

Implementando un WebSocket con Java

Para explicar cómo funcionan los WebSocket vamos a implementar un ejemplo muy simple, crearemos una barra de progreso la cual se cargará del valor 0 al 100 simulando que un proceso se está ejecutando en el BackEnd. En el formulario tendremos un botón que iniciara el proceso, cuando el usuario presione el botón, enviaremos un mensaje al BackEnd por medio del WebSocket, en ese momento, el BackEnd iniciara con un proceso de notificaciones el cual enviará por medio del WebSocket un mensaje con las actualizaciones de la barra de progreso. Este ejemplo está desarrollado con Java 8 y Wildfly 9.0.

WebSocket con Java as

Introducción a los WebSocket

Introducción a WebSocket

Los WebSocket fueron introducidos recientemente con la llegada de HTML5 y es sin duda una de las mejoras más esperadas. Los WebSockets nos permite trabajar de forma bidireccional entre el navegador y el servidor, permitiendo enviar y recibir mensajes de forma simultánea (Full Duplex) y manteniendo siempre una conexión activa con el servidor mediante Sockets TCP. as

Novedades de la etiqueta Table en HTML5

html51La etiqueta Table es sin duda la mejor opción para representar elementos en formato tabular o en tabla, debido a que permite crear rejillas perfectas en las cuales color los datos como si se tratara de una hoja de Excel.

La etiqueta table ha venido cada vez más en desuso con la llegada de HTML5 y CSS3, ya que anteriormente, esta etiqueta se utilizaba para maquetar toda la página y todas las secciones se representaban mediante una tabla. Hoy por hoy, las tablas se han limitado más a la representación de datos y para esto siguen siendo la mejor opción.

 

Con la llegada de HTML5 se agregan nuevas secciones a las tablas que permite personalizarlas de una mejor forma. Ahora es posible agregar una sección para los encabezados, el cuerpo de la tabla y el pie de la tabla, además es posible vincular la tabla con una descripción de forma semántica y agrupar columnas para aplicarles estilos personalizados.

as

La etiqueta figure de HTML5

html5La etiqueta <figure>  permite agregar contenido variado asociadas a una descripción o título, el cual es asociado semánticamente a este, de tal forma que podemos agregar una imagen, ilustración, diagrama, o incluso código. Como regla general, el contenido que agreguemos debe de estar relacionado al texto principal de la página.

Un claro ejemplo donde se puede emplear <figure>  es para agregar imágenes a un artículo, donde las imágenes tienen por lo general una descripción justo por debajo. Un claro ejemplo sería cualquier artículo de Wikipedia, ya que este inserta a lo largo de todas sus secciones imágenes que tiene que ver con el texto en cuestión.

Actualmente <figure>  es más utilizado para representar imágenes, porque es lo más común en una página además del texto, pero es importante resaltar que se puede utilizar para representar cualquier contenido. La clave de <figure>  es que nos permite asociar cualquier cosa con una descripción, de tal forma que son asociados semánticamente.

La etiqueta <figure>  se utiliza en conjunto con la <figcaption>  para representar la descripción del contenido. La etiqueta <figure>  puede tener cualquier contenido seguido de <figcaption>  o al revés, <figcaption>  seguido de cualquier contenido. as

HTML5, antecedentes y novedades

html5

La historia de HTML ha sido larga, ya que desde su nacimiento al principio de los 90, ha evolucionado muchísimo, pasando de ser tan solo un simple sistema para compartir documentos, a ser la base completa de la WEB.

HTML fue desarrollado inicialmente por Tim Berners-Lee en 1980, que trabaja en aquel entonces en la CERN (Organización Europea para la investigación Nuclear). El propuso un sistema de Hipertexto que permitiera compartir documentos de una manera más fácil y eficiente. Pero no fue hasta que se unió con Robert Cailiau para presentar su propuesta como la World Wide Web (W3), en un concurso para definir el sistema de hipertexto que se utilizaría para internet.

as