Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. WordPress
Code

Desenvolvendo para WordPress com Twig: Introdução

by
Length:ShortLanguages:
This post is part of a series called Kick-start WordPress Development With Twig.
Kick-Start WordPress Development With Twig: Getting Started

Portuguese (Português) translation by Erick Patrick (you can also view the original English article)

Muito se escreve sobre o futuro do WordPress e muitos acreditam na necessidade de uma linguagem de modelagem, ainda mais quando Django, Ruby on Rails, Node.js, Laravel e até Drupal já possuem. Fatos como "WordPress domina cerca de 25% da web" dificultam o questionamento de seu sistema de modelagem baseado em PHP. Mas, por faltar modularidade do código, cabe perguntar quando a base terá um mecanismo de modelagem.

A boa nova está bem aqui! O mecanismo de modelagem Twig, junto do plugin Timber, pode ajudar a escrever código bem limpo e modular em WordPress. Nessa série, discutiremos sua implementação e integração com o WordPress. Começarei com o básico do Twig e o porque você precisa dele e, nos três próximos artigos, explicarei tipos diferentes de modelos Twig integrados ao WordPress via Timber.

O Que É Twig?

Twig é um mecanismo de modelagem flexível, rápido e seguro, para PHP. O Twig foi criado pelo Fabien Potencier, criador do framework Symfony, e é considerado bem dotado de funcionalidades, extensivo, rápido e eficiente.

Geralmente, ao programar para WordPress, você mistura partes de PHP com HTML (o tal do código espaguete). Isso não é conhecido como código bem limpo e legível. Por um abordagem modularizar e correta™, é preciso que as Visões sejam separadas dos Dados. Com Twig, podemos separar a camada de visão do resto da aplicação. Twig trabalha no padrão modelo-visão-controlador (MVC) e ajudar a manter um código limpo.

Por Que Usar Twig?

Pelos anos, vários mecanismos de modelagem em PHP foram desenvolvidos, mas o Twig, com certeza, supera todos eles nos seguintes pontos.

Riqueza de Recursos

Twig é um dos mecanismos de modelagem PHP mais rico e poderoso em recursos. Ele suporta herança multipla e escapagem automática de retornos, e ajuda a dividir o modelo em vários blocos ou componentes para manter a modularidade. Não apenas isso, mas desenvolvedores também podem adicionar mais plugins que se adequem aos requerimentos do front-end.

Rápido e Eficiente

Modelos que são compilados via Twig carregam menos excessos que modelos PHP padrão. As rotinas de código são bastante otimizadas e você economiza bastante do seu tempo de desenvolvimento. Ele também é útil quando se planeja alterar o framework base, uma vez que o Twig ajuda a criar uma camada de modelagem separada, que pode ser conectada a qualquer framework de back-end, seja Laravel ou WordPress.

Amigável a Designers e Desenvolvedores

Twig server para designers e desenvolvedores. Mesmo que não viciado em código, usar o Twig é simples e faz sentir-se bem, codificando modelos modulares, baseados em componentes. A sintaxe é fácil e reprime a implementação de operações dinâmicas em PHP nos modelos. No fim, ele é bem moderno e adaptável aos padrãos de codificação mais atuais. O conceito da escapagem de retorno é bem fácil através do Twig.

Comecemos com um exemplo simples.

Em um arquivo padrão PHP, você tem um retorno como esse:

Em Twig, tudo é bem mais simples e o código acima vira:

Escapagem de retorno é simples assim no Twig. Basta adicionar chaves duplas ao redor do nome da variável e obtemos o retorno. Use o tubo e o "e" logo em seguida, e o retoro será escapado. Falaremos mais sobre isso nos três próximos artigos da série.

Seguro

Twig limpa e assegura os dados por conta própria. Seu modo caixa de área exclusivo monitora o código inteiro e filtra os resultados da melhor forma possível. Isso significa que os modelos criados por usuários podem ser implementados fácil e seguramente. O ambiente de caixa de área só pode ser habilitado globalmente ou localmente para modelos específicos, assim:

No caso de qualquer erro de sintaxe, o Twig depura seu arquivo, gerando uma mensagem contendo maiores detalhes, como nome do arquivo e número da linha do código problemático.

Flexível

Mencionei que o Twig é um mecanismo moderno de modelagem, também significando que suas funcionalidades são extensíveis, por ele ser bem flexível. Suporta simbolizador e analisador eficientes, que desenvolvedores podem usar para criar elementos, filtros e funções customizadas.

Outros

Além de todas essas funcionalidades mencionadas, Twig é bem documentado e completamente testado unitariamente. Suas API e bibliotecas de modelagem são completamente estáveis e lidam com todos os tipos de tarefas complexas. Um livro online e documentação completa da API também estão disponíveis.

Twig também é a nova linguagem de modelagem do Drupal 8, que é a razão deu usar esse mecanismo de modelagem com convicção. O pessoal da XWP, especialmente o Weston Ruter, está trabalhando em uma proposta para tornar o Twig adaptado aos padrões do WordPress.com VIP.

Timber: Integrando Twig Com WordPress

Até agora, toda a discussão foi sobre duas coisas. Primeiro, devemos seguir uma abordagem modular para manter nossos modelos separados dos dados ao construir temas customizados para Wordpress, e, segundo, Twig pode nos ajudar. Mas quem consegue juntar esses dois?

Vários tentativas foram realizadas para criar a melhor das integrações entre Twig e WordPress, uma delas é o Timber, criada pela agência web chamada UpStatement. Ele usa o mecanismo de modelagem do Twig, o que possibilita escrever código modular e limpo no WordPress.

Timber, junto do Twig, pode ajudá-lo a construir temas modulares do WordPress de forma rápida. Assim, você pode manter seu código HTML separado dos arquivos PHP normais, garantindo um padrão de código mais sustentável. O conceito de manter HTML e PHP separados permite que o arquivo PHP foque, estritamente, em suprir os dados e lógica, enquanto o arquivo HTML (Twig) concentra-se na camada de visão da aplicação web.

No todo, Timber realiza três tarefas principais:

  • Integra Twig no WordPress
  • Renderiza os modelos do Twig
  • Adiciona um conjunto de dados fundacional do WordPress

Acredito que a missão deles diz tudo:

Timber é uma ferramenta para desenvolvedores que querem traduzir seus HTML em temas WordPress de alta qualidade, através de uma interface intuitiva, consistente e acessível.

  • Intuitiva: A API é escrita centrada no usuário com base nas expectativas do programador
  • Consistente: Todos os objetos WordPress podem ser acessados pelas propriedades polimórficas como slug e ID
  • Acessível: Sem caixas-preta. Cada esforço é feito de modo que o desenvolvedor tenha 100% de acesso ao seu HTML

Como o Timber Funciona?

No caso de um tema padrão do WordPress, todos os fragmentos de PHP e HTML são integrados e modificados no mesmo arquivos modelos PHP. Entretanto, com Timber, dividimos arquivos modelos em dois arquivos diferentes: o arquivo PHP e a visão/arquivo modelo, ou seja, o arquivo Twig.

Assim, o primeiro é salvo com a extensão .php e o segundo com a extensão .twig. Se for criar arquivos para single.php, eles serão chamados de single.php e single.twig.

O primeiro arquivo coleciona os dados enquanto o segundo é o modelo, que por sua vez usa os dados no HTML. Dessa forma, você pode adicionar operações dinâmicas em seus temas WordPress, de forma modular.

Resumamos tudo:

Timber lida com os modelos do seu tema WordPress em arquivos PHP e HTML (Twig). Dessa forma, separa-se a lógica da apresentação. Ele provê novas maneiras de construir, estilizar e apresentar seu tema.

Conclusão

Há muito para amar no Twig. Esse artigo foi apenas uma introdução sobre as vantagens do seu uso como mecanismo de modelagem no WordPress. Código modular é melhor e mais fácil de manter. Está na hora de desenvolvedores mudarem e acredito que o Twig pode ajudar.

Nos próximos artigos, mostrarei implementações práticas de arquivos modelo com Twig. Veremos como podemos implementar o Twig para renderizar imagens, comentários e menus do WP, com exemplos. Até lá, se tiver qualquer dúvida, sinta-se livre para perguntar. Não esqueça de falar comigo no Twitter.

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.