Uno de los proyectos más interesantes que están basados en el framework Javascript jQuery es jQueryUI, unas librerías para la creación de interfaces de usuario avanzadas que nos ofrecen los propios creadores de jQuery. En este videotutorial mostraremos hasta qué punto es sencillo dar los primeros pasos con estas librerías y comenzar a utilizarlas en páginas web.

Las librerías jQueryUI nos ofrecen una serie de componentes, también llamados widgets, que están listos para usar e implementan muchas de las necesidades más típicas a la hora de construir una página web, como seleccionadores de fecha, sistemas de autocompletado, pestañas, acordeón, etc. Pero además contiene algunas herramientas que permiten asignar funcionalidades avanzadas a elementos de la página, como arrastrar y soltar. Todo ello se ofrece por medio de plugins jQuery que resulta extremadamente sencillos de usar.

No hace falta dar más introducciones porque, a estas alturas, el que quiera aprender jQuery ya debe conocer el Manual de jQuery de DesarrolloWeb.com, así como los videotutoriales de jQuery ya publicados en este sitio. Por su parte, el que quiera aprender jQueryUI quizás ya conozca el Manual de jQueryUI que venimos publicando también desde hace tiempo. De hecho, este vídeo sirve para dar un soporte adicional a los estudiantes que están dando los primeros pasos en jQueryUI ayudados por este último manual.

Normalmente, cuando publicamos un videotutorial, acompañamos el mismo con diversas explicaciones para que los interesados puedan conocer de antemano qué es lo que vamos a trata. Sin embargo, en esta ocasión está un poco de más, dado que el guión del vídeo es directamente el que podemos encontrar en el artículo Primeros pasos con jQuery UI. Así pues, en el vídeo iremos recorriendo todos los puntos tratados en ese artículo y que nos pueden dar una idea de la facilidad de uso de jQueryUI (creo que incluso sin saber jQuery cualquier desarrollador que vea este vídeo sería capaz de implementar las funcionalidades principales de estas librerías) y de la cantidad de componentes que pone a disposición de los creadores de aplicaciones web.

El videotutorial mostrará entonces cómo descargar jQueryUI, cómo incluir las librerías en una página web y seguidamente cómo implementar algunos de los componentes más esenciales. En concreto se mostrará cómo hacer un selector de fechas (también llamado datepicker), como implementar una funcionalidad de arrastrar y cómo crear una interfaz de acordeón. Todo ello, para el asombro quizás de los más nóveles, con únicamente una línea de código Javascript!!

Para vídeos siguientes, o para leer en el Manual de jQueryUI dejamos todas las opciones de configuración de los widgets. Es decir, nosotros en este videotutorial mostraremos simplemente como inicializar los componentes con las opciones por defecto, pero es bueno saber que cada uno de ellos tiene una cantidad importante de opciones de configuración que nos ayudarán a personalizarlos todavía más, aparte de eventos y métodos que nos permitirán ir un poco más allá cuando estamos definiendo la interacción con el usuario.

Así pues, os dejamos con el vídeo que espero sea ameno para todos y sirva para quitarse el miedo a usar unas de las librerías más atractivas que nos podemos encontrar en estos momentos para la creación de páginas enriquecidas del lado del cliente.