Um IDE para desenvolvimento WordPress (independentemente da experiência)

No artigo anterior, passei pelo processo de configuração de um ambiente de desenvolvimento local usando um gerenciador de pacotes. Especificamente, falei sobre o uso do Homebrew para instalar o Valet e o Composer.

O primeiro oferece o servidor web Nginx, um servidor de banco de dados MySQL, enquanto o Homebrew permite instalar o PHP. O Composer oferece a capacidade de lidar com dependências do PHP. Se você não leu o post, eu recomendo, pois este post é baseado em todo esse ambiente.

Especificamente, falarei sobre IDEs. É um tópico quente, eu acho, mas se você não tiver uma preferência, vou orientá-lo no processo de escolher um que eu acho melhor (pelo menos para começar), configurá-lo e usá-lo no contexto do ambiente estabelecido na semana passada.

Um IDE para desenvolvimento WordPress

Para muitos desenvolvedores profissionais do WordPress, é provável que você os ouça falando sobre PhpStorm. E com razão. Eu uso esse IDE específico há mais de um ano e é realmente poderoso.

Ele tem um ótimo suporte para vários recursos avançados, é extensível e possui muitos recursos integrados que o tornam um ótimo ambiente para trabalhar; no entanto, descobri que de todos os IDEs que experimentei, ele também vem com a curva de aprendizado mais íngreme. É também um IDE pago que talvez seja um desligamento para alguns. Mas está tudo bem. Abordaremos isso ao longo deste post.

Isso não é necessariamente uma coisa ruim: às vezes, as coisas que mais valem a pena aprender são as mais difíceis de usar. Mas existem alternativas por aí e estou tentando garantir que todos que estão lendo isso estejam na mesma página.

Como eu disse no post anterior:

Se vou escrever sobre esse material em detalhes, devo assumir que todos estamos usando o mesmo ambiente?

Já que estou errando do lado do sim, acho que é apropriado selecionar um IDE que funcione bem com qualquer pessoa – desde aqueles que estão apenas aprendendo até aqueles que são um pouco mais avançados. Insira o código do Visual Studio.

Uma observação sobre este IDE

Se você lê este blog há algum tempo (ou está apenas começando), verá que tenho um arquivo de postagens neste IDE específico. Alguns dos posts que escrevi incluem:

• Código do Visual Studio para desenvolvimento do WordPress
• Configurando PHP CodeSniffer no Visual Studio Code
• TODOs, REVIEWs, and FIXMEs,
• e assim por diante.

Na verdade, eu tenho uma lista de pendências inteira pela qual você pode passar. O problema: é um pouco datado. Ao usar o PhpStorm, o Visual Studio Code (ou Code, para abreviar) fez melhorias significativas desde a última vez que o usei.

Com isso dito, parte desse material pode parecer redundante, mas, no final das contas, nos colocará na mesma página.

Código do Visual Studio

Antes de começar, vale a pena fazer referência a duas coisas:

• Por que o Visual Studio Code?
• Introdução ao código do Visual Studio

O último é um tópico um pouco grande porque inclui várias coisas para instalar, configurar e configurar, então abordarei isso começando com este post e os novos, mas pelo menos vale a pena falar sobre por que o Visual O Studio Code é um IDE sólido para desenvolvimento WordPress.

1 Por que o Visual Studio Code?

Além de ser compatível com todos os principais sistemas operacionais, uma das primeiras coisas a serem observadas sobre o Code é que ele mantém uma cópia de suas configurações em seu próprio arquivo para que você possa sempre consultá-lo, mas pode personalizá-lo com suas próprias configurações .

Além disso, tudo é mantido em um arquivo JSON que permite personalizá-lo para se adequar ao ambiente em que você está trabalhando. Talvez seja PHP, talvez seja JavaScript, ou talvez seja algo completamente diferente.

Além disso, manter as configurações portáteis facilita o compartilhamento entre seus computadores. Isso significa que você pode colocar o arquivo em, digamos, uma pasta do Dropbox e ter suas configurações referenciadas em todas as suas máquinas.

Isso é útil, é claro, se você tiver apenas várias máquinas. E se você fizer isso, então você pode gostar de ter os ambientes de desenvolvimento em sincronia para que seja fácil inundar entre eles.

2 Introdução ao código do Visual Studio

Começar com o IDE é simples. É realmente uma questão de:

1. Navegando para a página inicial do software,
2. Baixando a versão apropriada para seu sistema operacional,
3. Em seguida, instalando-o.

Mas apenas instalá-lo não é suficiente, não é?

Quero dizer, ainda precisamos falar sobre adicionar espaços de trabalho para cada um de nossos projetos, definir configurações e instalar extensões que nos ajudarão a ser mais produtivos no trabalho que fazemos.

Ao longo dos próximos posts, faremos exatamente isso. Afinal, se essas postagens ficarem muito longas, você não fará nada com o resto do dia 🙂.

E as Extensões?

Lembre-se, no entanto, como estamos trabalhando principalmente com o WordPress e software relacionado nesta série e no próximo artigo, precisamos ter certeza de que temos algumas coisas instaladas para lidar adequadamente com o que faremos.

Isso inclui coisas como suporte para:

• WordPress. Uma das coisas boas de usar um IDE inteligente é que ele pode oferecer conclusão de código. Usar uma linguagem como PHP geralmente é oferecido pela maioria dos IDEs. Este plugin adiciona suporte para WordPress.
• Padrões de Codificação PSR2. Embora eu já tenha sido fã dos Padrões de Codificação do WordPress, desde então mudei para os Padrões de Codificação PSR (por vários motivos).
• Depuração. Usar o Xdebug é essencial se você deseja ser aprovado usando as instruções echo e var_dump em seu código. Além disso, ajuda a analisar mais profundamente o código-fonte do WordPress ao analisar possíveis problemas.
• Gerenciamento TODO. Na maioria das vezes, ao escrever código, haverá lugares que você precisará voltar e revisar, corrigir ou simplesmente fazer antes de liberar algo para teste ou produção. Usar uma ferramenta como essa ajudará você a encontrá-los facilmente antes de confirmar o código no controle de origem ou implantá-lo.
• E mais.

Obviamente, as coisas vinculadas acima levam você à página inicial de cada um dos plugins, mas é possível – e provavelmente melhor – instalá-los de dentro do editor para que você possa gerenciá-los mais facilmente.

Lembre-se, o objetivo do post anterior era ter uma maneira de gerenciar facilmente todos os softwares que estamos instalando. E instalar as extensões por meio do IDE fornece exatamente a mesma experiência para o IDE.

Finalmente, estas são as extensões que considero úteis ao trabalhar com o WordPress.

A seguir

Embora eu tenha fornecido um resumo de muitas das coisas acima, não é necessário aprofundar alguns deles ou o que esperar ao usá-los.

Além disso, ele não fala sobre os habituais tabs-versus-spaces, fontes que acho que valem a pena usar, linting Sass, estilo e linting JavaScript e assim por diante.

Até lá, trabalhe para instalar o Visual Studio Code e configurá-lo usando as extensões vinculadas acima. É fácil fazer isso de dentro do IDE. E se tiver alguma dúvida, fique à vontade para deixar nos comentários.