DÍA 2 / 2015

REST API y el futuro de los Themes en WordPress

WordPress se está preparando para algo nuevo y excitante. La forma de trabajo, interacción y diseño con este CMS van a cambiar radicalmente y los themes son una de las piezas claves de esta revolución. Hablamos de la REST API. ¿Te lo vas a perder?


Rest API WordPress

Uno de los aspectos que más me fascinan de WordPress es la velocidad en la que se mueve el desarrollo de nuevas versiones y funcionalidades. Es una carrera de medio fondo. Ritmo muy constante y rápido a la vez. Tanto que si no estás continuamente informado seguramente te pierdas el lanzamiento de una nueva versión y serás sorpresivamente notificado por un email de actualización automática (al menos en las actualizaciones menores).

Pero como en toda carrera de medio fondo hay puntos de inflexión, cambios de ritmos o adelantamientos que son los que al final deciden la llegada a meta. Momentos que hacen que la carrera se revolucione, que los competidores se queden atrás o que hacen que nuestro ritmo de carrera pase a otro nivel superior.

Pues bien, ahora mismo estamos en uno de esos momentos que marcan un antes y un después, en una mini revolución que hará que cambie nuestra forma de trabajar e interactuar con WordPress. Y esto es bueno. Muy bueno. Me refiero a la REST API.

Una breve reseña sobre REST API

REST API es posiblemente el proyecto más excitante dentro de WordPress desde que se introdujeron los tipos de entradas personalizadas (los Custom Post Types) allá por la versión 2.9 y 3.0. Y pese a que este artículo no pretende ser un manual de usuario sobre REST API, es bueno antes de seguir entender, al menos de forma mínima en qué consiste, aunque esto sea un poco aburrido para los desarrolladores que ya están familiarizados con la JSON REST API

API: siglas de Application Program Interface o interfaz de programación de aplicaciones es básicamente un intermediario que nos permite conectar dos programas y hacer interactúen entre ellos compartiendo datos.

Un ejemplo muy básico, una aplicación que utilice un Mapa de Google para mostrar la información de localización está utilizado la API de Google maps.

REST: Representational State Transfer o la Transferencia de Estado Representacional. En sí mismo no es un lenguaje de código, es una arquitectura ques está diseñada para proveer una comunicación muy ligera (en ancho de banda) bajo HTTP.

Y para finalizar JSON: JavaScript Object Notation es el formato para el intercambio de datos basado en JavaScript. Así que básicamente debemos conocer que JSON el formato, REST is the arquitectura y API es la interfaz.

Cuando ponemos todos ellos a trabajar en conjunción, tenemos una herramienta muy potente compartir los datos de nuestros WordPress con otros sitios web o aplicaciones. Esto es lo importante que tenemos que saber. Pero si quieres bucear algo más sobre esto, te animo a que empieces tu investigación por la Documentación de REST API.

El futuro de los Themes WordPress y REST API

REST API (o WP REST API) abre un mundo nuevo excitante, fértil para exploradores y todo aquel que quiera experimentar. WordPress ya no será lo que conocemos hoy en día. Será mejor. Pero para que esto pase de verdad, tendremos que esperar a que la RESP API se integre dentro del core de WordPress (programado para las siguientes versiones).

Por ahora lo podemos utilizar como plugin, y empezar a testear desde ya. ¿Os imagináis la de cosas que se pueden hacer? Los plugins, aplicaciones y sitios webs que conocemos actualmente basados en WordPress van a cambiar mucho. Pero como hay que ser concretos hasta cuando uno imagina, veamos qué posibilidades vamos a encontrar si trabajamos con Themes WordPress.

Mejoras en la experiencia de Usuario

Si pensamos en que los themes son los encargados de aportar en diseño y la usabilidad a nuestro WordPress (además de muchas otras cosas), con REST API vamos a poder mejorar esta vertiente, con un control total sobre que mostramos y cuando lo mostramos.

Seguro que habéis visto muchos diseños que basan su página principal en un listado de post que se van añadiendo automáticamente cada vez que llegamos al final de nuestra página. Sin recargar la página se van añadiendo nuevos elementos. Esto es infinite scroll (o scroll infinito). Y funciona muy bien!

Pero con RESP API podemos ir un paso más allá. Podemos decidir con un control total cuando mostrar artículos y a quien mostrarlos. Un ejemplo, tenemos un usuario que entra desde un dispositivo móvil con una velocidad de navegación lenta. A este usuario le mostramos los tres primeros artículos, y cuando llegue al final de la página le añadimos otras tres.

Para el mismo sitio web, un usuario accede desde el escritorio con una velocidad de navegación buena. A este usuario le mostramos los primeros diez artículos, y cada vez que quiere más le mostramos de cinco en cinco.

¿Que hemos conseguido? Muchas cosas:

  • Mejorar la experiencia de usuario para el usuario de mobile. Ha podido entrar antes al site e interactuar con él. No ha tenido que esperar a que se descargan todas las imágenes de los diez primeros artículos. Sólo de tres. Además, cuando vio estos tres primeros y decidió cargar otros tres, no fue necesario que el navegador recargará la página y volviese a renderizarla. Consume menos datos. Consume menos batería.
  • Más velocidad de navegación. Si te has fijado, al poder decidir qué mostrar y cuando podemos adaptar nuestro contenido y mostrarlo directamente en la página donde se encuentre el usuario. No es necesario que vaya a otra página y que tenga que recargar y volver a renderizar. En el ejemplo esto lo realizamos con elementos de navegación (antiguos artículos) pero también será posible hacerlo con artículos individuales (por ejemplo a pinchar en “Read More” el artículo se muestra completo en la propia página de inicio)
  • Menos consumo de recursos. Al realizar la carga de hojas de estilos CSS, librerías JS y demás elementos una sola vez, el consumo y transferencia de datos desciende de una forma considerable. Y no solo para el usuario, también en nuestro servidor o CDN, por lo que la factura, si estamos trabajando con costes variables por ejemplo, será menor.

Este un ejemplo muy sencillo pero bastante ilustrativo. Sin embargo, del mismo modo que tenemos unos beneficios evidentes, también es necesario que nos planteemos otras formas de trabajar y obstáculos que resolver: ¿Qué sucede con el SEO en estos sitios? ¿Que cuenta como página vista en Analitica Web? ¿Qué sucede con los usuarios que tengan JavaScript desactivado? Lo dicho, un horizonte excitante!

WordPress como Aplicaciones

Hay montones de aplicaciones y librerías ahí fuera que no están realizadas con PHP. Esto antes era un problema si queremos usarlas como funciones de nuestros themes. Pero con REST API ya no es necesario que usemos un lenguaje concreto. Podemos recuperar nuestro contenido desde cualquier parte, mostrarlo en cualquier lugar. El límite último es nuestra imaginación.

Por lo tanto el Front-end de WordPress tal y como lo conocemos actualmente es estrictamente opcional. Podemos crear cualquier tipo de diseño y mostrar los datos usando la estructura que más nos interese. La estructura de plantillas cambia por completo. Esto tiene muchas implicaciones.

Y la primera de ellas es que podemos construir themes con la tecnología que nos interese. ¿Que tal una aplicación de una sola página con Angular JS? Sin problemas. Solo necesitamos WordPress para almacenar y recuperar datos y REST API para interactuar con ellos..

Simplemente es necesaria una carga inicial y todas las futuras interacciones se podrán realizar sin volver a renderizar la página completa. ¿Habéis probado EverNote en el navegador? Pues ahora es posible construir algo similar con WordPress y REST API.

REST_API WordPress Evernote

En definitiva se abren muchas opciones y frameworks que entran en juego. Es hora de dar la bienvenida a Node, Ember, Backbone, Angular, React… y una larga lista que irá incrementando a medida que vayamos probando y experimentando.

Más usos y ejemplos de WordPress con REST API

Además del Front-End, también puedes imaginar otro nuevo Back-End. Podemos introducir y gestionar los datos de la forma que más nos interese. Un ejemplo de esto es el propio WordPress.com, HappyTables o por ejemplo Jetty.

REST API ejemplo Happytables

En cuanto a Front-End, sitios como Mashable marcan el camino de lo que se puede realizar. WordPress como back-end y front-end como aplicación propia. Puedes inspeccionar el código de la web para ver esto.

Y finalmente, como apps, los servicios actuales que convierten tu WordPress en una App totalmente funcional ya están haciendo uso de la REST API de WordPress para ello. Puedes ver un ejemplo en AppPresser, que ha creado un aplicación en forma de framework que integra la REST API para crear aplicaciones a partir de sitios WordPress.

Themes & REST API: Un futuro excitante

En definitiva se abren muchos caminos que explorar, y aunque haya que esperar uno meses hasta que REST API se incorpore al core de WordPress, ya podemos empezar a construir y experimentar con esta genial mejora.

Así que, seas diseñador, desarrollador o un simple usuario de WordPress, es el momento de prepararse, enterarse de qué va todo esto y sobre todo dar mayor poder al equipo (ya sea mobile o escritorio) del usuario. Mejorará el comportamiento y nuestros recursos. Mejorará la Experiencia de Usuario. Todos ganamos.

Hello Dolly, Hello Rest API!