Bibliotecas JavaScript y WordPress: lo que necesita saber

Lo he dicho antes, y lo diré de nuevo: si eres un usuario de WordPress, necesitas familiarizarte con JavaScript. Así es como funciona la web. El problema real, entonces, es la inquietante cantidad de bibliotecas de JavaScript que debe revisar.

Hay Ember, React, Angular. Vue y Preact. Y no se olvide de Ionic, Express o Node. jQuery, Meteor y Bootstrap también merecen una mención. Oh, y ¿qué pasa con ...

Entiendes mi punto. (Y esos son solo los que podría nombrar en la parte superior de mi cabeza sin abrir una nueva pestaña). Las bibliotecas de JavaScript ensucian el panorama porque son bastante esenciales para el desarrollo.

Ya sea que desee manipulación DOM, un marco MVC, llamadas AJAX o algo completamente diferente, es probable que exista una biblioteca de la que pueda extraer para ayudarlo en su camino.

Como usuario de WordPress, eso debería ser música para sus oídos, y aquí está el por qué.

¿Qué son las bibliotecas de JavaScript, de todos modos?

Simple: un código preescrito buncha. Nada sofisticado. Sin embargo, puedes hacer un montón de cosas elegantes con ellos. Por eso son increíbles.

Al usar código preescrito y colocarlo en su sitio web, puede agregar una funcionalidad que le ahorra tiempo, pero que probablemente también llena los vacíos en su experiencia. Seguro que eres bueno en lo que haces, pero eres un desarrollador de WordPress, no un desarrollador de JavaScript.

Esta bien.

Cuando usa bibliotecas de JavaScript con WordPress, está usando la experiencia de otras personas para mejorar su sitio y las experiencias de sus usuarios.

Lo primero es lo primero

Como usuario de WordPress, ya tiene acceso a un montón de bibliotecas de JavaScript y sus dependencias en Core. Consulte el Codex para obtener una lista completa y cómo usar wp_enqueue_script con JS integrado y externo.

Bibliotecas JavaScript ... ¿Para qué sirven?

Mucha gente se confunde cuando se habla de bibliotecas de JavaScript porque a menudo están mal etiquetadas como marcos de JavaScript , que son diferentes. Un framework es una especie de biblioteca, pero funciona de manera un poco diferente a la mayoría.

Los marcos son lo que utiliza para crear una aplicación o un sitio web a gran escala. En esencia, los frameworks JS cumplen la misma función que el propio WordPress, proporcionando la columna vertebral de cualquier proyecto en el que esté trabajando. Están mucho más estructurados en términos de uso que las bibliotecas sin marco.

Los marcos se pueden dividir en algunas categorías: marcos de front-end, marcos de back-end y marcos de pila completa. Si no está familiarizado con los términos, el front-end es con lo que interactúa el usuario, el back-end es lo que se ocupa de los problemas del lado del servidor y la pila completa maneja tanto el front- end como el back-end .

Probablemente haya oído hablar de algunos de los marcos más comunes / populares:

• Angular
• Node.js
• Vue.js
• Reaccionar
• Ascua

¿Cómo funciona todo esto en WordPress?

Algunas de esas bibliotecas no lo hacen. Ese es todo el punto que quiero señalar: no necesitas un marco de back-end (y en ese sentido, un marco de pila completa) si estás trabajando con WordPress. Nuestro encantador Core ya maneja ese nivel de estructura por nosotros. (Tenga en cuenta que es un punto discutible si es un desarrollador que está contribuyendo específicamente a Core y / o está haciendo un montón de personalización por su cuenta).

Lo que sí necesita aprender a usar (o al menos comprender) son los frameworks front-end y las bibliotecas de manipulación DOM. Estos entran en juego con mucha más frecuencia que cualquier otro tipo de bibliotecas de JavaScript.

PHP es un lenguaje asombroso. Nos dio WP como lo conocemos hoy, y funciona muy bien para poner todo tipo de lógica y funcionalidad en manos de los usuarios. Pero las bibliotecas de JavaScript toman el poder y lo aumentan exponencialmente.

Ciertos complementos como NinjaForms, aunque están escritos en PHP, porque WordPress lo dice, usan bibliotecas de JavaScript para brindar al usuario una mejor experiencia y mucha más funcionalidad de lo que sería posible de otra manera. WPNinjas utilizó las bibliotecas Backbone y Marionette para lograr esto.

Diablos, incluso aquí en Elegant Themes, Divi 3.0 (que es increíble y deberías unirte totalmente para usarlo en todos tus sitios) está escrito en React.

También lo es el próximo editor de Gutenberg (por el momento, al menos), y el panel de administración de WordPress.com llamado Calypso (así como Jetpack). Diablos, casi todo lo que haces en el tablero .org funciona con JavaScript hasta que algo cambia. en el servidor y debe guardarse.

Pero incluso eso puede estar cambiando pronto ... gracias a la API WP REST.

WP REST API + Bibliotecas JavaScript = BFF

Probablemente ya haya oído hablar de la API WP REST. En pocas palabras, está dando mucha vida al desarrollo de JavaScript de WordPress porque no tiene que realizar solicitudes de servidor a través de JavaScript en lugar de confiar en PHP.

Sí, ahora puede acceder directamente al back-end de su sitio desde el frente sin tener que pasar por PHP, ralentizando el tiempo de respuesta y limitando la funcionalidad. WPMU tiene un desglose del uso de la API REST que también debe consultar.

Puede hacer tanto con JS y REST que casi da miedo pensar en ello. Cuando usa React (y específicamente React Native), puede usar la base de datos de WordPress como back-end para su aplicación móvil sin tener que tocar PHP. Puede interactuar directamente con MySQL a través de JSON a través de la API REST.

En cierto modo, esta interacción hace que WordPress funcione de manera muy similar a los frameworks de JavaScript de back-end de los que hablamos anteriormente, proporcionando la estructura de la aplicación y la gestión de la base de datos sin ningún PHP intermediario. No es nada nuevo que WP funcione así, después de todo, eso es lo que hace un CMS, pero la implementación y la integración con las bibliotecas de JavaScript y JSON son

Si bien React Native puede hacer eso específicamente para aplicaciones móviles, también puede usar cualquier marco o biblioteca de front-end para hacer lo mismo: Vue.js y Ember y React antiguo normal (o Preact, si es desagradable).

Y si es realmente desagradable, puede tomar una de estas bibliotecas, crear su sitio y usar Swift of Java suficiente para envolverlo en una vista web y lanzarlo en una App Store gracias a la API REST. Es un poco feo, pero debería funcionar.

El futuro de WordPress

Matt dijo el año pasado que todos los desarrolladores de WordPress deberían "aprender JavaScript en profundidad".

Creo que es hora de que todos escuchemos. Honestamente, no importa qué biblioteca o bibliotecas de JavaScript elija aprender primero. Una vez que esté familiarizado con cómo uno o dos funcionan e interactúan con WordPress, estará en camino de ser parte del ecosistema JS y, a su vez, del futuro de WP.

Ya sea que desee crear una experiencia de cliente increíble para su complemento como Divi o Ninja Forms, una excelente aplicación web donde sus usuarios necesitan actualizaciones rápidas y sin problemas, o una aplicación móvil que solo usa WordPress como su base de datos de back-end, hay JavaScript bibliotecas disponibles para ello.

Miniatura del artículo de Creative Thoughts / shutterstock.com