Compreendendo o Frontity React Framework configurado para WordPress

Frontity é a nova estrutura de front-end para a criação de sites WordPress rápidos

O WordPress é o sistema de gerenciamento de conteúdo mais popular há muito tempo. Ele não apenas abastece mais de 30% dos sites na Internet, mas também possui uma enorme comunidade de colaboradores que mantêm o ecossistema WordPress vivo e forte.

WordPress é principalmente um software de servidor baseado em PHP. Existem milhares de aprimoramentos e extensões personalizados para o WordPress, principalmente na forma de plug-ins baseados em PHP. Assim, não surpreendentemente, tem havido muitas tentativas de integrar frameworks não PHP com WordPress, especialmente frameworks Javascript que estão ocupando rapidamente o espaço do Frontend no desenvolvimento da Web.

Um desses frameworks que está realmente subindo nas paradas é um framework React.js para WordPress chamado Frontity. É desenvolvido por uma startup com sede na Espanha. O desenvolvimento do Frontity já existe há alguns anos. No entanto, recentemente virou notícia quando arrecadou € 1 milhão em rodada liderada pela empresa por trás do WordPress, Automattic e empresa de capital de risco KFund. Para entender a razão por trás disso, primeiro é importante entender o que é a estrutura do Frontity e quais os benefícios que ela traz.

O que é Frontity?

Antes de aprendermos sobre o Frontity, é essencial conhecer a arquitetura básica do WordPress. Como você deve saber, o WordPress é um software de servidor baseado em PHP. Requer um software de servidor como Apache ou Nginx para atender às solicitações e um software de banco de dados como MySQL para armazenamento de dados (Postagens, Páginas, Usuários, etc.).

Arquitetura WordPress

Depois de abrir, digamos, a página principal do site do WordPress, ela chamará index.php no back-end, que retornará o HTML, CSS e JS da página inicial que será exibida no navegador. Portanto, o PHP atua como uma Interface de Gateway Comum (CGI) para o site e, portanto, qualquer tipo de aprimoramento para o front-end precisa ser baseado em PHP.

Arquitetura de Fronteira

Visto que o Frontity é um React-based framework, vamos falar um pouco sobre React JS primeiro. React é um framework Javascript de front end desenvolvido e publicado pelo Facebook. É extremamente popular devido à sua facilidade de criar interfaces de usuário rápidas, estáveis ​​e responsivas. React funciona como um módulo Node JS e, portanto, um site que usa React deve ser baseado em um servidor Node JS.

Agora, se você deseja usar uma estrutura puramente Javascript como React para aprimorar o front-end, ou seja, criar temas personalizados, é complicado fazê-lo. A razão é que uma estrutura como o React funciona em conjunto com o Node, que inicia um servidor próprio. E como mencionamos antes, o WordPress funciona com um servidor PHP CGI no backend. Portanto, não há uma maneira direta de criar temas personalizados e UIs usando React para WordPress.

No entanto, existe uma maneira de recuperar dados do banco de dados do WordPress remotamente. Isso pode ser feito usando a API REST do WordPress, que está totalmente integrada no núcleo do WordPress desde o WP versão 4.7 e superior. Se pudermos buscar dados do WordPress remotamente, isso significa que agora podemos exibir os dados buscados como quisermos. Os usuários usam a API REST há muito tempo para desenvolver aplicativos personalizados, páginas da web para acessar dados do WordPress diretamente do banco de dados. Este tipo de Sistema de Gerenciamento de Conteúdo (CMS) também é conhecido como sem cabeça CMS.

O Frontity é baseado neste mesmo conceito. Ele se conecta a um banco de dados WordPress por meio da API REST e se encarrega de analisar e organizar os dados recuperados. Você decide qual tema deseja usar para exibir o site. Por ser baseado no React, qualquer tema do React pode ser usado para o site. Você também pode desenvolver seu tema personalizado, se desejar. O front-end baseado em PHP do WordPress ainda será usado por criadores / administradores para criar conteúdo ou alterar configurações. Mas o front-end baseado em Frontity será usado como a página principal do site.

Assim, em uma configuração do Frontity, serão necessários dois servidores: um é o servidor WordPress, que tem a API REST instalada e em execução e retorna dados do WordPress, e o segundo é o servidor Node JS que executa o Frontity para chamar a API REST e exibir os dados usando React .

O caminho a seguir?

Com a empresa por trás do WordPress arrecadando 1 milhão de euros e o React trazendo uma rica experiência do usuário para o WordPress, não será um exagero dizer que o Frontity é o caminho a seguir para os modernos sites baseados em WordPress. A IU do WordPress continuará a ser usada como um painel para a criação de conteúdo enquanto a parte de exibição será transferida para o servidor Frontity.

Você pode ler mais sobre o Frontity aqui. Se você tem um site WordPress e deseja experimentar o Frontity, siga as etapas mencionadas aqui para fazê-lo.