Bibliotecas JavaScript e WordPress: o que você precisa saber

Eu já disse isso e direi novamente: se você é um usuário do WordPress, precisa se familiarizar com o JavaScript. É assim que funciona a web. O verdadeiro problema, então, é o número perturbador de bibliotecas JavaScript que você precisa classificar.

Há Ember, React, Angular. Vue e Preact. E não se esqueça do Ionic, Express ou Node. jQuery, Meteor e Bootstrap também merecem uma menção. Ah, e sobre ...

Você entendeu. (E esses são apenas aqueles que eu poderia nomear de cabeça sem abrir uma nova guia.) Bibliotecas JavaScript ocupam o cenário porque são essenciais para o desenvolvimento.

Se você deseja manipulação DOM, uma estrutura MVC, chamadas AJAX ou algo totalmente diferente, é provável que haja uma biblioteca que você pode usar para ajudá-lo em seu caminho.

Como um usuário do WordPress, isso deve ser música para seus ouvidos, e aqui está o porquê.

O que são bibliotecas JavaScript, afinal?

Simples: um grande código pré-escrito. Nada chique. Você pode fazer um monte de coisas chiques com eles, no entanto. É por isso que eles são incríveis.

Usando código pré-escrito e puxando-o para o seu site, você pode adicionar funcionalidades que economizam tempo, mas provavelmente também preenchem lacunas em sua experiência. Você é bom no que faz, com certeza, mas é um desenvolvedor WordPress - não um desenvolvedor JavaScript.

Tudo bem.

Quando você usa bibliotecas JavaScript com o WordPress, está usando a experiência de outras pessoas para aprimorar o seu site e as experiências dos usuários.

Primeiras coisas primeiro

Como usuário do WordPress, você tem acesso a várias bibliotecas JavaScript e suas dependências já no Core. Confira o Codex para obter uma lista completa e como usar wp_enqueue_script com JS integrado e externo.

Bibliotecas JavaScript ... Para que servem?

Muitas pessoas ficam confusas ao falar sobre bibliotecas JavaScript porque muitas vezes são rotuladas erroneamente como estruturas JavaScript , que são diferentes. Uma estrutura é um tipo de biblioteca, mas funciona de maneira um pouco diferente da maioria.

Frameworks são o que você usa para construir um aplicativo ou site em grande escala. Em essência, os frameworks JS têm a mesma função do próprio WordPress - fornecendo a espinha dorsal de qualquer projeto em que você esteja trabalhando. Eles são muito mais estruturados em termos de uso do que as bibliotecas sem estrutura.

Os frameworks podem ser divididos em algumas categorias: frameworks front-end, frameworks back-end e frameworks full-stack. Se você não está familiarizado com os termos, o front-end é o que o usuário interage, o back-end é o que lida com os problemas do lado do servidor e a pilha completa trata tanto do front- end quanto do back-end .

Você provavelmente já ouviu falar de algumas das estruturas mais comuns / populares:

• Angular
• Node.js
• Vue.js
• Reagir
• Brasa

Como tudo isso funciona no WordPress?

Algumas dessas bibliotecas não. Esse é todo o ponto que eu quero fazer: você não precisa de uma estrutura de back-end (e nesse sentido, uma estrutura de pilha completa) se estiver trabalhando com WordPress. Nosso delicioso Core já lida com esse nível de estrutura para nós. (Observe que é um ponto discutível se você é um desenvolvedor que está contribuindo especificamente para o Core e / ou fazendo muitas personalizações por conta própria.)

O que você precisa aprender a usar (ou pelo menos entender) são os frameworks front-end e as bibliotecas de manipulação DOM. Eles entram em ação com muito mais frequência do que qualquer outro tipo de biblioteca JavaScript.

PHP é uma linguagem incrível. Isso nos deu o WP como o conhecemos hoje e funciona muito bem para colocar todos os tipos de lógica e funcionalidade nas mãos dos usuários. Mas as bibliotecas JavaScript assumem o poder e o aumentam exponencialmente.

Certos plug-ins como NinjaForms, embora escritos em PHP - como o WordPress diz - usam bibliotecas JavaScript para dar ao usuário uma experiência melhor e muito mais funcionalidade do que seria possível. O WPNinjas usou as bibliotecas Backbone e Marionette para fazer isso.

Caramba, mesmo aqui no Elegant Themes, Divi 3.0 (que é incrível e você deve se cadastrar totalmente para usar em todos os seus sites) está escrito em React.

Assim como o próximo editor Gutenberg (por enquanto, pelo menos), e o painel de administração do WordPress.com chamado Calypso (assim como Jetpack). Caramba, quase tudo que você faz no painel .org é alimentado por JavaScript até que algo mude no servidor e precisa ser salvo.

Mas mesmo isso pode mudar em breve ... graças à API WP REST.

WP REST API + Bibliotecas JavaScript = BFF

Você provavelmente já ouviu falar da API WP REST agora. Resumindo, está dando vida ao desenvolvimento de JavaScript para WordPress porque você não precisa fazer solicitações de servidor via JavaScript em vez de depender do PHP.

Sim, agora você pode acessar diretamente o back-end do seu site pela frente, sem ter que se atrapalhar com o PHP, diminuindo o tempo de resposta e limitando a funcionalidade. O WPMU apresenta uma análise do uso da API REST que você também deve verificar.

Você pode fazer tanto com JS e REST que é quase assustador pensar nisso. Quando estiver usando o React (e especificamente o React Native), você pode usar o banco de dados WordPress como back-end para seu aplicativo móvel sem nunca tocar em PHP. Você pode interagir diretamente com o MySQL por meio de JSON por meio da API REST.

De certa forma, essa interação faz com que o WordPress funcione muito como os frameworks JavaScript back-end dos quais falamos acima, fornecendo a estrutura do aplicativo e o gerenciamento do banco de dados sem nenhum PHP intermediário. Não é nada novo para WP trabalhar assim - é isso que um CMS faz, afinal - mas a implementação e integração com bibliotecas JavaScript e JSON são

Embora o React Native seja especificamente capaz de fazer isso para aplicativos móveis, você também pode usar qualquer estrutura de front-end ou biblioteca para fazer a mesma coisa - Vue.js e Ember e o React antigo normal (ou Preact, se for desagradável).

E se você for realmente desagradável, pode pegar uma dessas bibliotecas, fazer seu site e usar o Swift of Java apenas o suficiente para envolvê-lo em uma visualização da web e jogá-lo em uma App Store graças à API REST. É um pouco feio, mas deve funcionar.

O Futuro do WordPress

Matt disse no ano passado que todos os desenvolvedores de WordPress deveriam “aprender JavaScript profundamente“.

É hora de todos ouvirmos, eu acho. Honestamente, não importa qual biblioteca ou bibliotecas JavaScript você escolha aprender primeiro. Assim que estiver familiarizado com como um ou dois funcionam e interagem com o WordPress, você está no caminho certo para fazer parte do ecossistema JS e, por sua vez, do futuro do WP.

Se você deseja criar uma experiência de cliente incrível para seu plug-in, como Formulários Divi ou Ninja, um ótimo aplicativo da web onde seus usuários precisam de atualizações rápidas e suaves ou um aplicativo móvel que usa apenas WordPress como banco de dados de back-end, há JavaScript bibliotecas lá fora para isso.

Miniatura do artigo por Creative Thoughts / shutterstock.com