O MELHOR AMBIENTE DE DESENVOLVIMENTO DO WORDPRESS

Então, hoje, pensei que era hora de compartilhar um ambiente completo, o tipo que eu iria montar e usar para o desenvolvimento em grande escala.

Enrole as mangas e prepare-se para deixar suas mãos sujas! Porque a seguir é uma explicação completa do tipo de ambiente de desenvolvimento que eu configurei, e você também pode fazê-lo.

Nota: Este tutorial não é para iniciantes. Se você é novo no desenvolvimento do WordPress, você não precisará de um ambiente tão elaborado que possa apresentar uma complexidade desnecessária. Observe também que este artigo se destina especificamente para o WordPress. As idéias e objetivos podem ser iguais para projetos que não sejam do WordPress, mas a abordagem e as ferramentas usadas variam.

O que faz um bom ambiente de desenvolvimento?

Nos meus olhos, um bom ambiente de desenvolvimento tem as seguintes três propriedades:

1. Altamente portátil
2. Altamente configurável
3. Altamente automatizado

Portabilidade

A portabilidade é um fator importante porque, além de compartilhar o tema / plugin que estou desenvolvendo, quero também poder compartilhar o ambiente do dev.

Eu quero que outros desenvolvedores possam verificar a origem do GitHub e começar de imediato, incluindo o uso de qualquer ferramenta como Gulp ou Grunt. Isso torna os projetos fáceis de pular e, se você suportar uma melhor colaboração, você tem maiores chances de fazer algo bem sucedido.

A portabilidade também pode ajudá-lo se você precisa trabalhar em outro computador ou deseja mostrar aos seus colegas o que você fez. A capacidade de configurar tudo em qualquer lugar dentro de alguns minutos ajudou-me mais vezes do que posso contar.

Configuração

A capacidade de configurar seu ambiente é primordial. No lado do servidor, o WordPress é extremamente tolerante, mas ser capaz de afinar suas configurações de compilação, as tarefas Grunt e outras opções são um grande benefício.

Opções de configuração e portabilidade em conjunto significam que você pode testar seu trabalho facilmente em diferentes circunstâncias. Que tal mudar a versão PHP ou mesmo HHVM apenas para se certificar? Talvez você possa verificar a compatibilidade com versões antigas do WordPress e plugins populares? Estas são coisas que você deve ser capaz de testar.

Automação

A automação é uma das principais unidades na criação de um ambiente de desenvolvimento para o trabalho do WordPress. Eu não quero me preocupar com meus scripts, folhas de estilo, salvar meu trabalho, implantação, e assim por diante.

As ferramentas de linha de comando formam o osso traseiro da minha suíte de automação, que pode fazer tudo, desde a criação do WordPress com um comando para empacotar meu produto.

Um trabalho em andamento

Antes de mergulhar nos detalhes, eu pensei que iria em uma tangente sobre como os ambientes de desenvolvimento são sonhados por aqueles que os usam.

Se você é um novo recém-chegado ao mundo da linha de comando, crie  ferramentas , sistemas de controle de versões e outros, pode parecer que eu sou o profissional que conhece tudo e usa as ferramentas perfeitas para cada tarefa.

Isso está muito longe da verdade! Eu sou bem versado em todas as coisas WordPress, mas tudo o resto é apenas um pouco extra que eu adotei ou precisei / queria aprender a tornar minha vida mais rápida. Eu copiei os outros, descobri alguns bits por conta própria e modifiquei as coisas conforme necessário (às vezes falhando miseravelmente!).

Meu ambiente de desenvolvimento (e muitos outros) é um mix do seguinte:

• Conhecimento pessoal bem refinado
• Grandes dicas dos outros
• Apenas uma coisa aleatória que achei que funciona
• Passos que podem ser feitos muito melhor, mas não poderia ser incomodado descobrir

Em outras palavras: não é perfeito, mas faz o trabalho. Há muito espaço para melhorias e lugares para usar outras ferramentas, o que você pode gostar melhor. Se você conhece ferramentas ou fluxos de trabalho mais úteis, sinta-se livre para usá-los e me avise nos comentários!

Um servidor local

O WordPress é executado no PHP, que é uma linguagem de codificação do lado do servidor, pelo que precisamos de um servidor para executar o WordPress. As opções mais populares são:

• WAMP
• XAMPP
• MAMP

Comecei com o XAMPP há anos e anos atrás. Em seguida, mudei para o MAMP quando me tornei um usuário de Mac e, em seguida, mudou para Vagrant há cerca de dois anos. A web e as ferramentas usadas estão evoluindo como sempre e agora eu também uso Vagrant e MAMP. Vou explicar o porquê abaixo.

AMPs

O “AMP” no MAMP, XAMPP e WAMP representa Apache, MySQL e PHP. Essas ferramentas instalam serviços e uma GUI para ajudá-lo a gerenciar os processos usados pelo servidor. Você baixou e instale o aplicativo, pressione o botão “on” e tudo funcionará conforme o esperado.

The Pros:
é rápido, é fácil, é intuitivo e funcionará em todos os sistemas o tempo todo. Possui uma ótima interface de usuário, que você pode usar para ajustar configurações PHP, mudar para Nginx, configurar Memcached, Postfix, configurar servidores virtuais e muito mais.

Os Contras:
Embora existam muitas coisas que você pode ajustar, o controle é limitado. Você não pode alterar o sistema operacional ou fazer outras alterações que o acesso completo da SSH permita que você faça.

Todas as AMPs perdem em portabilidade pelo mesmo motivo. Eles são suficientemente populares para que qualquer pessoa possa instalá-los, mas não são autônomas e mínimas como as configurações do Vagrant.

Vagrant é um pouco diferente. Em vez de pré-empacotamento e ambiente para você, ele lhe dá total controle. É criado com o VirtualBox (ou outros aplicativos da VM) e permite que você pegue uma “caixa”, que é essencialmente um sistema operacional. Você pode usar scripts para configurá-los para si mesmo.

O prós: a
configuração é autônoma em tão pouco quanto dois arquivos muito pequenos. Se você estiver acostumado à configuração da linha de comando, um ambiente pode ser tão simples quanto vagrant up– o sistema é extremamente portátil.

Você pode configurar o conteúdo do seu coração. Qualquer sistema operacional, qualquer software, de diferentes métodos de cache para compilar seu próprio PHP. Você pode replicar o ambiente do seu host real exatamente para garantir que seu site seja executado exatamente da mesma maneira em sua máquina local.

Os contras:
se você não está atualizado no uso da linha de comando, Vagrant pode ter uma curva de aprendizado íngreme. Quando tudo funciona, é uma navegação suave, tudo o que você precisa fazer é emitir um comando. Se algo se recusa a trabalhar, por qualquer motivo, você se encontrará em águas profundas.

Existem ferramentas para criar hosts virtuais e executar outras tarefas comuns, a IU do MAMP é mais conveniente, pelo menos para mim. Se eu precisar de um novo host virtual rápido com uma instalação WP, posso fazê-lo com o MAMP + WP-CLI muito mais rápido do que com o Vagrant + WP-CLI.

Qual usar?

Se você trabalha exclusivamente com o WordPress, uma ferramenta como o MAMP oferece flexibilidade e poder suficientes. Ele permite que você trabalhe com sites que não sejam do WordPress, é claro, então, se você tiver o trabalho estranho que cai fora da esfera WP, a MAMP ainda irá atendê-lo bem.

Se você trabalha com grandes equipes em projetos que não são do WP eu recomendo pegar Vagrant e dar uma chance. Ele vai te ensinar muito sobre como os servidores funcionam internamente e permitem que você compartilhe ambientes exatamente.

Minha preferência é usar ambos. Quando eu precisar (ou ter o tempo), posso configurar meu ambiente até o último detalhe com o Vagrant. Quando preciso de algo simples ou para um projeto WordPress, o MAMP é minha opção preferida.

Ferramentas de linha de comando

Eu não uso uma grande quantidade de ferramentas da CLI, mas as que eu uso são uma grande parte do meu fluxo de trabalho. Os mais proeminentes são WP-CLI, Gulp, ngrok e Ultrahook vamos entrar em um pequeno detalhe.

WP-CLI

O WP-CLI é uma ferramenta de linha de comando extremamente poderosa, que permite automatizar tudo sobre o WordPress. Eu já escrevi um tutorial sobre o desenvolvimento avançado do WordPress com o WP-CLI, então eu vou mostrar-lhe apenas a magia que pode fazer.

Configurando novos sites

Você pode baixar, configurar e instalar o WordPress em alguns comandos simples como wp core downloade wp core config. A documentação é abundante e fácil de seguir.

Uso WP-CLI juntamente com scripts bash para criar pequenos modelos para criação de novos sites. Você pode usar comandos para remover plugins e temas padrão e baixar e ativar os plugins que você usa regularmente.

Pesquisar e substituir

Pesquisa de banco de dados e substituições às vezes são necessárias, mas podem ser uma dor. Alterar para https, mover-se para um novo domínio, renomear urls e outros podem trazer algumas mudanças de massa.

Uma vez que o banco de dados contém uma série de matrizes serializadas, você não pode apenas pesquisar e substituir SQL (a menos que o valor antigo e o novo sejam do mesmo comprimento). wp search-replace oldval newvalueTrabalhará tudo isso para você, desistenciando e depois re-serializando seus arrays.

Administração remota

O WP-CLI construiu no SSH para ajudá-lo a gerenciar sites por meio de SSH. Isso tem o potencial de permitir que você gerencie centenas de sites com um único comando (por exemplo: atualizar um tema ou um plugin em vários sites).

Muito mais…

Não há quase nenhum fim para o que você pode fazer com o WP-CLI. De cerca de 35 categorias de comandos embutidas , que contêm um monte de sub-comandos para pacotes de terceiros , você pode automatizar facilmentequalquer tarefa.

O Gulp usa pacotes de Nó e Nó para sua funcionalidade, tornando-o extremamente portátil e poderoso, devido às extensões baseadas na comunidade. Meu processo de trabalho com o Gulp geralmente envolve o seguinte:

1. Encontre uma extensão que corresponda às minhas necessidades
2. Instale o pacote do nó com npm
3. Exigir o pacote no Gulpfile
4. Escreva uma tarefa de automação curta

A única parte deste que exige qualquer pensamento é o número quatro. Mesmo assim, a maioria das extensões tem exemplos de copiar e colar, que provavelmente só precisam ser modificados um minúsculo.

Aqui estão as extensões que eu uso mais:

• Gulp-sass para compilar Sass para CSS
• Gulp-clean-css para minify CSS
• Gulp-autoprefixer para adicionar prefixos de fornecedor automaticamente
• Gulp-include para concatenar arquivos JS
• Gulp-uglify para minfying JS files
• Gulp-imagemin para otimizar imagens
• Browsersync para criar servidores de desenvolvimento que ajudam com testes móveis
• Gulp-sourcemaps para criar mapas de origem para arquivos minificados

Ngrok

Ngrok é uma pequena ferramenta de linha de comando e de serviço que uso para compartilhar meu trabalho local pela internet. Ngrok cria túneis seguros para um ambiente local, expondo seu aplicativo em uma URL especial como http://7bbc49aa.ngrok.io.

Ultrahook

Ultrahook é um tipo de inversão do ngrok. Onde ngrok rooteia o seu local para a web, a Ultrahook encaminha a web para o seu localhost. Isso é extremamente útil para testar APIs de terceiros, como Stripe, por exemplo.

Você pode definir Stripe para enviar webhooks de teste para o http://stripe.danielpataki.ultrahook.comqual será passado com segurança em seu servidor local.

Plugins WordPress

Para a maioria de nós, o desenvolvimento do WordPress é sinônimo de desenvolvimento de plugins e temas. O repositório está cheio de plugins que ajudam os desenvolvedores a criar um melhor trabalho mais rápido. Aqui estão alguns que uso ou uso regularmente.

Cheque de tema

Um plugin de uso obrigatório para criadores de temas. A verificação do temairá analisar o seu tema e cuspir os motivos por que não atende aos padrões do WordPress. Ele observa o código obsoleto, arquivos estranhos, más práticas, erros comuns e toneladas de outros problemas potenciais.

RTL Checker

Você acha que suportar idiomas de direita para a esquerda é fácil? Pense de novo! Não é tanto um desafio técnico, mas aqueles que lêem / escrevem exclusivamente da esquerda para a direita acham a RTL tão estranha que é difícil ver problemas sem realmente testar. RTL Tester torna super fácil, permitindo que você coloque seu site no modo RTL com o toque de uma chave.

Campos personalizados avançados

Advanced Custom Fields ou ACF é o meu plugin favorito de todos os tempos. Ele permite que os desenvolvedores criem belos campos personalizados para seus temas e plugins em uma UI intuitiva e rápida. Depois de terminar, você pode ocultar ACF completamente e colar o código PHP gerado em seu trabalho para manter os campos intactos. Um plugin bem executado e extremamente útil!

Monitor de consulta

O Query Monitor permite que você veja exatamente o que está acontecendo no seu ambiente WordPress a partir do ponto de vista do acesso ao banco de dados. Você pode capturar consultas potencialmente lentas ou redundantes antes de sairem em um produto ao vivo e otimizar os existentes para tornar seu código muito mais rápido.

Scripts Bash

Os scripts Bash contêm um monte de comandos que são executados um após o outro e podem ser usados para automatizar mais tarefas. Por exemplo, já é fácil instalar o WordPress com WP-CLI. Tudo o que é necessário é o seguinte:

Esses comandos devem ser emitidos um após o outro, o que leva um pouco de tempo. Ao colocar isso em um arquivo, vamos chamá-lo install.sh, você pode criar um modelo para criar uma instalação WP.

Coloque o arquivo na pasta na qual você deseja criar a instalação e digite bash install.sh. Todos os comandos serão emitidos e, em alguns segundos, você terá um site em funcionamento.

Ao adicionar parâmetros, você pode torná-lo ainda mais útil. Se você emitir o comando assim: bash install.sh newsitevocê pode usar o parâmetro para preencher o nome do banco de dados, o URL e o título do site.

Os arquivos Bash também podem ser úteis para criar compilações finais (remover pastas e arquivos estranhos, mover diretórios, etc.) e outras tarefas semelhantes. Eles podem até ser executados a partir de tarefas do Gulp, o que lhe dá muita flexibilidade em seu fluxo de trabalho.

Ferramentas diversas

As extensões do navegador são de grande ajuda ao testar um site. Aqui estão alguns que eu uso no meu fluxo de trabalho.

Carteiro

O Postman é uma extensão de cromo para construir, testar e documentar APIs. Eu acho que sempre que preciso fazer uma solicitação rápida para ver como uma API funciona, o Postman é muito mais rápido do que qualquer outra ferramenta.

A capacidade de salvar e gerenciar pedidos é particularmente útil. O teste da API é algo que faço com menos frequência, mas quando chego a ele, ele ocupa a maior parte do meu dia, usando algo como o Postman torna minha vida muito mais fácil.

EditThisCookie

EditThisCookie é outro exemplo de uma extensão do Chrome que eu não uso muito, mas quando eu faço isso me poupa horas a horas. Ele permite que você veja / limpe / edite os cookies de um único site. Isso é tudo, mas oh meu, quão útil pode ser!

Tempo de carregamento da página

O tempo de carregamento da página faz o que você criou, analisa o carregamento da página. Pode entrar em detalhes importantes como DNS / Pedido e tempos de resposta, mas o que eu gosto é que ele mostra o tempo de carregamento geral ali mesmo na barra de ferramentas. Super-útil para comparações rápidas.

JSON Formatter

A minha entrada de extensão do navegador final na categoria de ferramentas misc é JSON Formatter , que detecta quando uma resposta é simplesmenteuma string JSON e formata tudo de bom e apropriado , em vez de apenas preencher um bloco de texto.

Franz

Este não tem nada a ver com o desenvolvimento! A Franz é uma ferramenta que pode agregar uma série de serviços da Web sob um mesmo teto. My Messenger, Slack, Skype, Inbox by Gmail, Trello, Google Calendar e Todoist todos funcionam em uma janela em vez de suas aplicações nativas.

Tudo parece exatamente como se eu os execute em seus ambientes habituais, mas eu não preciso ter todos esses ícones e posso mudar entre eles com mais facilidade. Menciono Franz porque me ajudou a me concentrar mais enquanto me comunicava melhor.

VVV

Varying Vagrant Vagrants ou VVV para abreviar é uma configuração Vagrant de código aberto para desenvolvimento para WordPress e WordPress. Ele contém todas as ferramentas que você precisará para começar, incluindo construções de desenvolvimento do WordPress.

Muito mais!

Há tantas ferramentas que não mencionei, principalmente porque eu simplesmente não as uso. Eles são ótimas ferramentas, mas eu simplesmente não tenho chegado a elas, não as preciso ou elas não se enquadram no meu fluxo de trabalho. Aqui está uma pequena lista de grandeza que você deve dar uma olhada em:

• Destaca-se por um excelente tema boilerplate feito pelo departamento de temas WordPress
• Raizes para uma pilha completa do WordPress incluindo servidor, gerenciamento de aplicativos e tema inicial. Eu acho isso muito elaborado para o meu gosto, mas pode ser o seu beco.
• WordPress Plugin Boilerplate para o desenvolvimento de plugins padronizados orientados a objetos.

Faça seu ambiente de desenvolvimento seu próprio

Em conclusão, estas são as ferramentas que uso – podem não ser necessariamente o melhor para você, nem são os melhores para todas as situações. Esta configuração é suficientemente flexível para as minhas necessidades, por isso, aproveite o tempo para pesquisar opções e criar um fluxo de trabalho que seja adequado para você.

Boa sorte!