Entradas

Single-Page Application, todo un website desde única página

Aunque no estés familiarizado con su nombre, es más que probable que ya hayas utilizado una aplicación Single-Page Application (SPA). Este formato que  se ha popularizado enormemente en los últimos meses porque mejora y unifica la experiencia de usuario, independientemente del dispositivo de acceso. En este tipo de aplicaciones web, todo lo que se muestra y se procesa está dentro de la misma página, así que al pasar de una opción a otra no hace falta recargar el navegador y lo normal es que sea un único archivo desde el que se reproduce absolutamente todo.

Leer más

Práctica de eventos personalizados en Polymer

La semana pasada, explicamos qué son los eventos personalizados y el motivo de su importancia en el desarrollo Polymer y frontend en general. Sin embargo, nos quedó pendiente hacer una práctica que nos ayudara a entender mejor su funcionamiento y la burbuja de eventos implementada en los elementos del DOM, que es lo que haremos a continuación.

Leer más

Gestión de eventos personalizados en Polymer

Retomamos los artículos sobre Polymer, la librería para agilizar el desarrollo con Web Components, para explicar, desde un punto de vista teórico, qué son los  eventos personalizados y para qué podemos usarlos.  En general, estos eventos son una de las herramientas más habituales en los lenguajes modernos de programación, ya que son fundamentales en el trabajo con interfaces de usuario.

Leer más

Ciclo de vida de elementos creados con Polymer

En pasados artículos, hemos hablado largo y tendido de la librería Polymer. Hoy vamos a entrar con detalle en un aspecto concreto y determinante en el desarrollo de elementos con esta librería: su ciclo de vida y la manera de asociar funciones con código para ejecutar durante sus posibles y diferentes estados.
Leer más

Cómo personalizar los mapas de Google con Polymer

Existen multitud de componentes disponibles en Polymer, pero destaca especialmente el de los mapas de Google. A la hora de implementar Google Maps dentro de una web existen diferentes opciones. La más sencilla es utilizar un iframe en forma de widget, pero es muy básico y no pasa más allá que mostrarte el mapa de una forma discreta (en ocasiones, puede ser  suficiente). Otra forma es a través de una API, con la que podrás colocar marcas, trazados, etc, pero es complejo de trabajar y es necesario conocer diversos aspectos de programación.

Gracias a Polymer, la forma de usarlo es como el widget, pero con suficientes posibilidades de configuración para que actúe como la API. Añadir elementos y marcas a la hora de personalizar los mapas es tan fácil como utilizar una etiqueta HTML, como explicamos en este tutorial.

Leer más

Un ejemplo de creación de componentes Polymer

Una de las opciones más interesantes de Polymer es extender el HTML con nuevos componentes que podremos usar en nuestros proyectos para solucionar las necesidades básicas que se nos planteen. Lógicamente, más allá de usar los elementos ya creados por terceros, como ya vimos en el artículo Usar los elementos de Polymer.

Estos componentes son muy sencillos de realizar y gracias a Polymer existen muchas facilidades adicionales que nos permitirán desarrollarlos más rápido. Al final, lo que tendremos es una nueva etiqueta HTML que podremos usar para realizar diferentes acciones en la web, desde las más elementales hasta las más complejas.

Leer más

Usar los elementos de Polymer

Tras ver los aspectos más teóricos de Polymer y realizar una primera aproximación práctica a esta librería, vemos ahora una de las posibilidades que nos ofrece: el uso de elementos o componentes disponibles en su catálogo.

Leer más

Aproximación práctica a Polymer

Hace ya unas semanas realizamos un aproximación teórica a Polymer, la librería para agilizar el desarrollo con Web Components. En esta ocasión, nos centraremos en los aspectos más prácticos, como su relación con AngularJS, sus elementos y desarrollo declarativo.

Leer más

Cómo poner a punto Polymer Starter Kit

En próximos artículos, vamos a realizar una aproximación muy práctica a Polymer, la librería que nos permite agilizar el desarrollo con Web Components. Como incluiremos numerosos ejemplos para explicar las funcionalidades de esta librería,  repasemos antes de empezar cómo crear un entorno de desarrollo adecuado con Polymer Starter Kit.

Leer más

Polymer, la librería para agilizar el desarrollo con Web Components

Nos encontramos en un momento en el que no paran de aparecer nuevas propuestas de tecnologías, frameworks y librerías para el desarrollo front-end. Una de las últimas y más versátiles alternativas que se ha sumado a esta corriente es Polymer,  “un nuevo tipo de librería Javascript”, tal y como se define a sí misma.

Su principal diferencia frente a otras librerías y frameworks, es que Polymer está basada en el estándar de los Web Components, una tecnología que está revolucionando el desarrollo web. Ya hemos hablado anteriormente del estándar de los Web Components, tanto desde el punto de vista teórico como desde el punto de vista más práctico, así que hoy toca centramos en esta librería, que nos facilita mucho la vida de cara al trabajo con Web Components.

Leer más