Minha jornada para criar um plugin WordPress com ChatGPT: 120 horas de trabalho, sem experiência anterior
Publicados: 2024-08-28Serei honesto: na verdade pensei que poderia construir um plugin para WordPress com ChatGPT em apenas algumas horas. Ou, pelo menos, foi isso que todos os tutoriais do YouTube e tópicos do Twitter me levaram a acreditar.
Mas deixe-me dizer, essas histórias deixaram de fora alguns detalhes cruciais – cerca de 120 horas de detalhes, para ser exato. Sim, foi quanto tempo levei para construir o plugin do início ao fim: 120 horas!
Para contextualizar, eu não tinha nenhuma experiência anterior com desenvolvimento de plugins ou WordPress, mas decidi mergulhar de qualquer maneira. E embora eu tenha adorado o desafio, foi muito mais difícil do que eu esperava. A cada passo do caminho, encontrei um obstáculo após o outro, muitos dos quais eu nem sabia que existiam. Foi frustrante, mas também uma enorme – enorme(!) – experiência de aprendizado.
Supondo que você planeje seguir meus passos, recomendo fortemente que você leia este artigo na íntegra com antecedência. Não estou dizendo isso como uma espécie de autopromoção. Estou dizendo isso porque você realmente economizará horas – até dias – de trabalho extra. Há tantas coisas que descobri nesse processo que não tive ideia de que eram importantes até depois do fato. Infelizmente, isso levou a inúmeras revisões de código (cheias de muita frustração) que poderiam ter sido evitadas. Ao ler isso, você não terá esse problema.
Para quem é e não é 🙋♂️
Dependendo de sua formação e conjunto de habilidades, você pode estar se perguntando se está “qualificado o suficiente” para fazer isso. Direi isto:
Embora você não precise ter nenhum conhecimento prévio de codificação, você precisa estar entusiasmado em aprender algum código e no processo geral de desenvolvimento de um plug-in. Há muitas fases a serem superadas e, muitas vezes, uma fase não tem nada a ver com a outra em termos das habilidades (ou mesmo ferramentas) necessárias para concluí-la. Resumindo, esteja pronto para aprender – MUITO .
Dependendo da natureza do seu plugin e dos seus objetivos finais, você pode facilmente levar um mês ou mais para criar um produto final.
Ter um olhar atento aos detalhes e reconhecer padrões ajudará bastante, assim como saber o que PHP, JavaScript e CSS fazem. Você não precisa saber codificar com eles, mas entender sua finalidade e como são usados será uma vantagem.
Se nenhuma das opções acima descreve você – especialmente a vontade de aprender – e você está procurando uma solução rápida e fácil, então isto não é para você. Não é rápido nem fácil. Mas é possível se você se esforçar.
Se você concorda com isso, então vamos começar.
Fase um: mapeie seu plugin em detalhes 📝
A primeira pergunta que você precisa se perguntar – e responder – é que tipo de plugin eu quero construir e o que eu quero que ele faça?
Você pode ficar tentado a se apressar para começar a construir e codificar, mas recomendo que não tenha pressa. O que você fizer aqui estabelecerá a base para seus prompts e permitirá que você construa de maneira organizada, em vez de adicionar coisas rapidamente. Para passar por esta fase de forma eficaz, considere o seguinte:
- Quais funções você deseja que seu plugin tenha?
- Como você deseja que seja o lado wp-admin?
- Crie wireframes ou fluxogramas para visualizar o fluxo de trabalho do plugin.
- Mapeie-o e descreva-o nos mínimos detalhes.
- Decida se deseja usá-lo para uso privado ou se deseja disponibilizá-lo no repositório do WordPress para acesso público.
Funções
O wp-admin
A seguir, considere como você deseja que seu plugin apareça e funcione na área de administração do WordPress. Isso inclui:
- Páginas de configurações : quais opções você deseja fornecer? Como você irá organizá-los?
- Menus : Onde seu plugin aparecerá no menu de administração? Terá submenus?
- Metaboxes : Se o seu plugin interagir com postagens ou páginas, ele precisará de metaboxes personalizadas?
- Tabelas : se você estiver armazenando dados, como os exibirá para o administrador revisar?
No meu caso, optei por uma página principal de configurações com abas para cada um dos meus códigos de acesso, uma página separada para documentação e também uma página com um formulário de contato caso os usuários queiram entrar em contato comigo. Isto é o que eu descobri:
Infelizmente para mim – mas não para você porque você está lendo isso – é que eu estava tão focado na funcionalidade de front-end do meu plugin durante a fase de planejamento que negligenciei completamente o lado wp-admin das coisas.
Isso fez com que demorasse mais do que demoraria se eu planejasse com antecedência, porque continuei tendo que revisar o código quando percebi que o que eu tinha estava incompleto ou tinha uma experiência do usuário ruim. Se eu mapeasse tudo com antecedência, ou melhor ainda, se usasse wireframes, essa fase teria sido muito mais tranquila – o que é uma transição perfeita para o próximo ponto.
Wireframes ou fluxogramas
Combine tudo e descreva em detalhes
Uso privado versus acesso público através do repositório WordPress
Há mais uma decisão que você deve tomar antes de passar para a fase dois. Essa decisão tem a ver com quem você vai construir este plugin.
Quer fazer isso apenas para você (ou para um cliente)? Ou deseja enviá-lo ao repositório do WordPress para aprovação para que fique disponível ao público em geral?
Tecnicamente, você não precisa tomar essa decisão ainda. No entanto, pensando bem, gostaria de ter feito isso no início do processo. É por isso que estou recomendando que você faça isso agora.
A razão é porque meu objetivo desde o início era enviar meu plugin para o repositório, mas inicialmente construí meu plugin sem seguir os padrões de codificação do WordPress. Concentrei-me apenas na funcionalidade e em levá-lo a um ponto em que funcionasse sem bugs.
Como resultado, acabei tendo que fazer muitos ajustes adicionais no código para que meu código se ajustasse aos padrões. Escusado será dizer que isso demorou muito e poderia ter sido evitado.
Dito isso, mesmo que você planeje criar um plugin apenas para uso privado, eu ainda recomendaria seguir os padrões de codificação. Isso reduzirá a probabilidade de mau funcionamento do seu plugin em versões posteriores do WordPress. Em termos de processo, a principal diferença é que você não precisará ser tão minucioso quanto aos aspectos não funcionais dos padrões.
Por exemplo, quando você faz comentários in-line como // Use global default. você é obrigado a colocar um ponto final no final. O período não tem finalidade funcional, mas se faltar será sinalizado como “erro” de acordo com as normas. Para uma compilação privada, você pode ignorar esse tipo de “erro”.
Fase dois: forneça ao ChatGPT um aviso detalhado para iniciar o desenvolvimento 🗣️
A ideia principal aqui é fornecer ao GPT uma visão geral do seu plugin com instruções claras. Como sugestão geral, aconselho que evite tentar construir a casa inteira de uma vez. É melhor adotar uma abordagem tijolo por tijolo.
Digamos que você construísse meu plugin como exemplo.
Embora tenha oito efeitos, recomendo dizer ao GPT que você deseja começar com um efeito. Quase como se você estivesse construindo um plugin de um efeito em vez de um plugin de oito efeitos . Em seguida, verifique se o efeito funciona – incluindo a área de configurações de back-end. Corrija quaisquer bugs e, quando tudo estiver bem, adicione o próximo efeito. Depois é só seguir esse processo, um por um.
A razão para fazer isso dessa maneira é que fica mais fácil corrigir quaisquer bugs que possam ser introduzidos em seu código à medida que seu código cresce em complexidade. Se o GPT gerar todo o seu código de uma vez e muitas coisas não funcionarem, será muito mais difícil consertar.
Você ainda deseja dar ao GPT uma visão geral ampla de sua visão geral para o plug-in, mas encerre o prompt concentrando-se primeiro em algo específico.
Para economizar seu tempo, criei um modelo de exemplo que você pode fornecer ao ChatGPT para começar.
As seções entre colchetes [X] requerem sua contribuição para serem concluídas. Você pode ou não precisar editá-lo ainda mais, dependendo do tipo de plugin que você planeja construir.
Se você não entendeu tudo no prompt, não se preocupe, eu também não. Você aprenderá à medida que avança no processo.
Minha sugestão 🤖
I want to build a WordPress plugin called [name] that does the following: [General overview but don't give GPT the specifics yet] I'd like it to work via [Refer back to the section "combine everything and describe it in detail" from phase one; think about how you want your plugin to function - if you're not sure, then you can delete this part] . I would also like to create a settings menu in wp-admin so that users can [Explain what you want your settings menu to look like and do, including any specific UI/UX considerations; if you create any wireframes, upload those as well] I plan on using the following tools for this process: - Docker and/or Local by Flywheel {Choose one or use both} - Terminal (MAC) {if you're using a PC, substitute with Command Prompt} - Sublime Text - Chrome and Chrome inspector tool Also, I want to use GitHub for version control to track changes and collaborate effectively. I will use the default WordPress template provided by GitHub to generate the code for the .gitignore file. However, I will need your help to walk me through how to set up a repository and how to commit my files to it. For the main PHP file, the author name should be [your name] and the author URI should be [your website if you have one] . For any code you generate, please use tabs for indentation and not spaces. {important if you plan on submitting your plugin to the WordPress repository} If you need to enqueue any scripts, please ask me questions to help me figure out whether we should use conditional loading or if we should enqueue globally. In addition, when generating CSS, please follow BEM (Block Element Modifier) methodology. Let's begin with [insert which feature you'd like to build first] Please [Optional: help me setup Local by Flywheel and then] generate the initial PHP file and advise on next steps after that.Depois de fornecer seu prompt ao ChatGPT, ele o guiará pelo restante das etapas, descritas abaixo. É importante notar que dependendo do humor do ChatGPT ou do seu próprio desejo de seguir o processo conforme eu expus, a maneira como listo tudo pode não ser tão linear quanto é apresentado.
Para lhe dar uma ideia do que quero dizer, testei o prompt três vezes diferentes. Além de me ajudar a configurar o Local by Flywheel e gerar o arquivo PHP inicial, ele optou por realizar as outras etapas de uma maneira diferente a cada vez.
Primeira tentativa
Na minha primeira tentativa, o ChatGPT não foi além de gerar o arquivo PHP e me apresentou duas opções de como gostaria de proceder a seguir. Notavelmente, ele seguiu as instruções sobre enfileiramento de scripts com carregamento condicional e também mencionou isso.
Segunda tentativa
A segunda tentativa resultou no arquivo PHP mais simples, mas na resposta geral mais completa em termos de execução das etapas. Ele começou a usar o Terminal para configurar diretórios de projetos e inicializar o Sublime. Chegou até a me orientar sobre como configurar o repositório Git.
Terceira tentativa
A terceira tentativa foi um pouco semelhante à primeira tentativa. Embora, ao contrário da primeira tentativa, o ChatGPT não tenha configurado o carregamento condicional para os scripts, nem me perguntou sobre isso. Apenas os gerou como globais por padrão.
A conclusão
A razão pela qual compartilhei brevemente essas três tentativas com você foi não apenas para reforçar o que eu disse anteriormente sobre como o fluxo de trabalho não será necessariamente padronizado, mas também para ressaltar que o prompt é tanto para você quanto para o GPT .
O que quero dizer é que cabe a você prestar atenção ao que o ChatGPT está fazendo – e não está fazendo – e colocá-lo de volta nos trilhos caso caia. Portanto, à medida que você avança nesta jornada, não se esqueça de consultar o prompt e também as dicas que compartilharei um pouco mais tarde na seção de depuração. Lembre e reoriente o ChatGPT para fazer o que você deseja, tanto quanto for necessário.
Baixe meu plugin e teste-o 📥
Se você quiser dar uma olhada na “versão funcional” do meu plugin, o arquivo zip está abaixo. Atualizarei isso em um futuro próximo para incluir a versão do repositório WP, mas isso permitirá que você a use por enquanto.
Fase três: ferramentas, scripts, diretórios e Git 👩💻
Nesta fase você definirá as bases para a construção do seu plugin. É também onde a curva de aprendizado aumentará rapidamente, especialmente quando você começar a instalar scripts e usar o Terminal (ou Prompt de Comando, se estiver em um PC). Aqui está o detalhamento:
- Decida qual ferramenta de ambiente local você deseja usar (por exemplo, Local by Flywheel, Docker).
- Configure os diretórios do seu projeto.
- Instale seus scripts (por exemplo, npm, Composer).
- Configure um repositório Git (“repo”) e envie (faça upload) dos arquivos do seu plugin para ele
Construa um ambiente local
Configurar diretórios de projetos
Instalar scripts
Crie um repositório Git (“repo”) e envie seus arquivos
Com todas as etapas anteriores resolvidas, é hora de criar um repositório Git e enviar seus arquivos iniciais para ele. Esta etapa cria um instantâneo do ponto inicial do seu projeto.
Eu pessoalmente usei o GitHub porque é isso que usamos aqui no Themeisle, então já tinha uma conta lá, mas existem outras plataformas (por exemplo, GitLab, Bitbucket) também. Se você acabar usando uma plataforma diferente do GitHub, não se esqueça de ajustar o modelo de prompt na fase três .
Por uma questão de brevidade, não vou explicar como fazer isso. Depois de chegar a esta etapa, o ChatGPT pode guiá-lo passo a passo pelo processo, incluindo quais comandos você precisará digitar em seu Terminal/Prompt de Comando.
Ao enviar seus arquivos iniciais, tenha estes pontos em mente:
- Revise o que você está comprometendo: certifique-se de incluir apenas os arquivos necessários. Use seu arquivo
.gitignorepara excluir quaisquer arquivos temporários ou gerados. - Escreva uma mensagem de commit clara: algo como “Commit inicial: estrutura e configurações básicas do projeto” funciona bem.
- Não se preocupe com a perfeição: este é apenas o seu ponto de partida. Você fará muito mais commits à medida que desenvolve seu plugin.
Novamente, o ChatGPT provavelmente lhe dará orientação sobre os comandos específicos a serem usados para este commit inicial. Se não, basta pedir. Certifique-se de escrever que você precisa das etapas exatas com base em sua configuração e plataforma Git.
Ao concluir esta etapa, você iniciará oficialmente seu projeto de desenvolvimento de plugin com uma base sólida para controle de versão. De agora em diante, você poderá acompanhar todas as alterações feitas, experimentar novos recursos com segurança e colaborar com outras pessoas, se desejar.
Fase quatro: tempo de reprodução do plugin 🖱️
De todas as fases, eu diria que esta e a próxima são provavelmente as mais divertidas porque é quando você realmente começa a ver tudo se encaixando. Para começar, você deseja fazer login na instalação local do WordPress. Se você acabar usando o Local by Flywheel, é muito simples, basta clicar no botão WP Admin próximo ao canto superior direito:
Se você acabar usando o Docker ou outra ferramenta de desenvolvimento local e não tiver certeza de como entrar no seu site, basta perguntar ao ChatGPT.
Depois de fazer login, ative seu plugin acessando Plugins → Plugins instalados . Em seguida, encontre seu plugin na lista e clique em Ativar :
⚠️ Importante : Se você não encontrar seu plugin aqui, não entre em pânico. Provavelmente é uma incompatibilidade de diretório, mas, independentemente disso, você pode tocar em ChatGPT para ajudá-lo a descobrir. Se você ainda estiver preso após repetidas tentativas e o ChatGPT não tiver sugerido que você experimente o modo de depuração do WordPress, peça a ele que forneça os trechos de código para isso. Eles serão parecidos com isto:
define( 'WP_DEBUG', true );
define( 'WP_DEBUG_LOG', true );
define( 'WP_DEBUG_DISPLAY', false );Depois de ativar seu plugin, comece a usá-lo e faça anotações:
- Está tudo funcionando como deveria? Altamente improvável .
- O que não está funcionando? De que forma não está funcionando?
- Quais são algumas pequenas coisas que você ignorou completamente na descrição inicial do prompt e que não estão funcionando corretamente?
Depois de fazer suas anotações, você estará pronto para passar para a próxima fase: depuração e linting.
Fase cinco: depuração e linting 💻
A complexidade do plugin e os bugs têm uma relação correlacional: quanto mais complexo o seu plugin fica, maior o potencial para bugs . Mas plug-ins ainda mais simples exigirão linting e depuração.
Linting
Se este artigo é a primeira vez que você vê a palavra “linting” e não tem certeza do que significa, muito simplesmente, ele verifica o código do seu plugin em relação a um conjunto de regras e padrões para esse tipo de código. Em seguida, ele informa se encontrou algum erro ou inconsistência, em que linhas eles estão e como resolvê-los.
Linting é bastante simples. Apenas certifique-se de usar as ferramentas de linting adequadas para os tipos de código/arquivos nos quais estará trabalhando:
- PHP_CodeSniffer com padrões de codificação WordPress para linting PHP.
- ESLint para linting JavaScript.
- StyleLint para linting CSS.
Para JavaScript, você também pode adicionar:
- ESLint Unicorn: Mais de 100 regras ESLint poderosas.
- ESLint Promise: Útil para gerenciar tarefas assíncronas, como chamadas de API, consultas de banco de dados, manipulação de arquivos ou qualquer operação que demore para ser concluída.
Depuração
Em contraste com o linting, a depuração é muito parecida com o que você fez na fase anterior, ou seja, você mesmo usa o plugin, identifica os problemas que precisam ser corrigidos e então os corrige sozinho ou pede ao ChatGPT para ajudá-lo.
Pessoalmente, achei a depuração mais complicada do que o linting. Um grande motivo é que, quando você lint, a saída do processo de linting informa exatamente quais são os problemas e onde eles estão localizados no código. Com a depuração, você não tem esse luxo. Cabe a você e ao ChatGPT descobrir isso.
No entanto, o ChatGPT tem dificuldade em manter o foco em linhas de código problemáticas, o que significa que você precisa cuidar do “pronto, configurado” antes de deixá-lo “disparar”.
Para facilitar as coisas para você, elaborei uma lista de todos os vários conselhos que eu teria dado a mim mesmo antes de iniciar a fase de depuração.
Não seja vago e não deixe isso para o ChatGPT
Se você não der instruções muito específicas ao ChatGPT, ele começará a cuspir infinitas linhas de código para você e, muitas vezes, o código nem será diferente do que já foi fornecido. Ele vai querer que você “verifique” se está correto, mas tudo o que isso faz é perder tempo. Não há nada mais frustrante do que isso:
Em vez disso, o que você deve fazer é fornecer ao ChatGPT instruções muito específicas não apenas para gerar código, mas para isolar especificamente quais linhas de código ele acredita estarem causando o problema e mostrá-las a você. Diga-lhe para explicar como planeja alterar essas linhas e por que acha que essas alterações resolverão o problema. Por fim, peça-lhe que lhe diga qual deverá ser o resultado esperado após a implementação dessas mudanças.
Essas instruções o ajudarão a manter o foco no problema e minimizarão bugs de transbordamento, onde podem resolver o seu único problema, mas causar novos problemas no processo.
CSS regular versus CSS BEM
Relacionado ao acima, mas específico para CSS, você deve ter em mente que para qualquer trecho de CSS, o ChatGPT irá gerar CSS padrão, ou o que chamo de “CSS de sala de aula” por padrão.
Este é o CSS básico que você aprenderá ao fazer um curso para iniciantes sobre o assunto. É fácil de entender e não há nada de tecnicamente errado com ele em si, mas ao desenvolver plug-ins para WordPress, pode levar a conflitos com outros plug-ins ou temas.
Em vez disso, é melhor dizer ao GPT para usar a metodologia BEM (Block Element Modifier). O BEM ajuda a reduzir o risco de conflitos de CSS, fornecendo uma convenção de nomenclatura clara e estruturada. Ele garante que seus estilos sejam mais previsíveis e fáceis de gerenciar, pois cada bloco, elemento e modificador tem um nome de classe descritivo e distinto que minimiza a chance de impactos de estilo não intencionais. Além disso, o BEM melhora a capacidade de manutenção, facilitando a localização e atualização de estilos específicos sem afetar outros.
Já incluí uma menção a isso no prompt de exemplo da fase dois, mas estou destacando aqui para que você sempre se lembre de dar essas instruções ao ChatGPT para seus snippets CSS.
Carregamento condicional versus enfileiramento global
Outro comportamento padrão do ChatGPT tem a ver com o enfileiramento de scripts. Não se preocupe se você ainda não sabe o que essa frase significa. O que importa é que você o reconheça em seu código ao vê-lo. Será algo assim:
function enqueue_my_scripts() { wp_enqueue_script('my-plugin-script', plugin_dir_url( FILE ) . 'js/my-script.js', array('jquery'), '1.0.0', true); } add_action('admin_enqueue_scripts', 'enqueue_my_scripts');No exemplo acima, o código enfileirará globalmente um script para todas as páginas administrativas, o que geralmente é desnecessário e pode levar a problemas de desempenho. Infelizmente, é isso que o ChatGPT lhe dará, a menos que você se manifeste e diga para não fazê-lo. Para ser claro, em alguns casos, isso é completamente apropriado, mas em muitos casos, não é.
Portanto, assim que você notar que o ChatGPT gera qualquer código com a palavra “enfileirar”, certifique-se de conversar sobre isso. Pergunte ao ChatGPT se faz sentido enfileirar seus scripts globalmente ou apenas nas páginas específicas onde os scripts são necessários – o que é conhecido como “carregamento condicional”.
Lembre e lembre com frequência
ChatGPT tem tendência a ser esquecido e isso é ainda mais quando você o usa para codificar. Portanto, embora você possa fornecer instruções específicas, a probabilidade de ele seguir essas instruções durante o projeto é zero .
Às vezes, ele até ignora completamente o que você pede. Se isso acontecer, seja mais severo e diga que não está fazendo o que você deseja:
Além disso, dentro de algumas interações, ele retornará rapidamente ao comportamento padrão de tentar afogá-lo em grandes quantidades de código que não têm nada a ver com a seção de código que você está tentando depurar.
Quando isso acontecer, basta apertar o botão Parar na saída do GPT e lembrá-lo de seguir suas instruções. Também ajuda copiá-los e colá-los na janela de bate-papo quando você estiver enviando o lembrete.
E por falar em gerar longas linhas de código…
Evite que o ChatGPT regenere arquivos inteiros para você
Quando você não está acostumado a trabalhar com código e se sente intimidado por isso, pedir ao ChatGPT para regenerar o arquivo inteiro para você após cada ajuste de código pode parecer atraente no início.
Tudo que você precisa fazer é “copiar e colar”, certo?
Embora possa parecer tentador, na verdade é uma má ideia . No longo prazo, isso lhe causará mais problemas. Você não apenas perderá muito tempo fazendo isso – especialmente se estiver depurando seu arquivo PHP, que pode ficar bastante longo, mas o ChatGPT pode introduzir novos erros em seu código existente no processo. Isso resolverá o problema em que você está trabalhando, mas acidentalmente ajustará alguma outra parte do arquivo e quebrará alguma coisa.
É melhor isolar as partes específicas do código que estão causando o problema e trabalhar apenas nelas.
Pegue um bug de cada vez
Seguindo as linhas acima, mesmo se você tiver vários bugs - a menos que sejam muito pequenos - informe o ChatGPT sobre um deles de cada vez. Corrija cada bug antes de passar para o próximo.
Preste muita atenção às linhas superiores e inferiores dos trechos de código
Quando o ChatGPT fornece trechos de código, às vezes - mas nem sempre - os encapsula, mostrando a linha superior do arquivo geral com o qual você está trabalhando e também o resultado final. Portanto, você precisa ter cuidado para não simplesmente copiar e colar o trecho inteiro, pois isso fará com que seu código quebre.
⚠️ Preste muita atenção na linha superior:
Se não for relevante para o trecho de código específico que você está tentando depurar, ignore-o.
O mesmo vale para os resultados financeiros, embora isso possa ser mais difícil de detectar. Às vezes pode ser tão simples quanto algo como }); o que faz com que seu código seja quebrado porque fecha um snippet pai que ainda não deveria ser fechado.
Depois de um tempo, você entenderá melhor, mas quando estiver iniciando sua jornada de desenvolvimento de plug-ins, se notar que muitas coisas quebram depois de adicionar um snippet, tente excluir a última linha para ver se "magicamente ”conserta tudo.
O console é seu melhor amigo
Se o ChatGPT tentar depurar o mesmo problema sem sucesso e você estiver andando em círculos, peça para adicionar linhas console.log às seções de código que ele acredita estarem causando o problema. Em seguida, abra o console enquanto recria o bug. Isso explicará o que aconteceu. Você pode então capturar esta explicação e fornecê-la ao ChatGPT para que ele descubra como corrigi-la.
Para acessar o console no Google Chrome, clique com o botão direito na página e selecione Inspecionar :
Quando o console não fornecer respostas, verifique seu banco de dados
O console é excelente e muitas vezes lhe dará as respostas que você precisa. No entanto, em algumas ocasiões, isso apenas confirmará o que você está vivenciando, mas sem realmente lhe dar qualquer tipo de orientação sobre como consertar.
Por exemplo, quando eu estava tentando adicionar um efeito de digitação ao meu plugin, a velocidade de visualização padrão do efeito no wp-admin foi definida como 23 milissegundos. Passei muito tempo revisando meus arquivos PHP e JavaScript para tentar corrigir o problema, mas sem sucesso.
O console confirmou que estava carregando às 23h, mas além disso, não me deu nenhuma outra informação valiosa:
Eventualmente, verifiquei o banco de dados e percebi que o valor incorreto vinha daí:
Troquei de 23 para 60, que era o que eu queria, e resolveu o problema.
Se você acabar usando o Local by Flywheel, poderá acessar seu banco de dados facilmente através da interface clicando na aba Banco de Dados:
Depois de obter acesso, um bom lugar para começar a procurar é o mesmo lugar que você me viu na imagem acima: wp_options. Na maioria das vezes, as configurações dos seus plug-ins serão encontradas lá.
⚠️ No entanto, também é importante ressaltar que o maior problema subjacente aqui era que faltavam instruções de ativação em meu código. Quando seu plugin for ativado pela primeira vez, ele deverá verificar se existem certas configurações no banco de dados. Caso contrário, seu plug-in deverá adicioná-los com os valores padrão pretendidos. Isso garante que cada nova instalação do seu plugin comece com as configurações corretas. Aprendi isso da maneira mais difícil para que você não precise fazer isso.
Um novo tópico pode lhe trazer avanços
À medida que seu código cresce e seu tópico com ChatGPT fica cada vez mais longo, ele estará sujeito a cometer erros ou esquecer coisas. A certa altura, é uma boa ideia iniciar um novo tópico. Carregue os arquivos do seu plugin principal no novo tópico e explique ao ChatGPT o que você está fazendo e onde parou.
Aqui está um exemplo de prompt que você pode usar:
Eu estava trabalhando na depuração de um plugin do WordPress com você em outro tópico, mas acho que o tópico ficou muito longo e você estava começando a ficar confuso. Vamos começar de novo.
Dê uma olhada nos arquivos do plugin aqui e vamos tentar solucionar o problema [descreva seu bug] .
Além disso, e isso é MUITO IMPORTANTE, ao gerar novas versões de trechos de código na tentativa de solucionar problemas, não apenas gere o trecho, mas também forneça uma explicação sobre quais linhas você alterou em relação ao que já está presente. Além disso, explique a lógica por trás da alteração dessas linhas e o que podemos esperar ver com as alterações que você fez.
[Se estiver gerando CSS, não se esqueça de lembrar o ChatGPT de seguir a metodologia BEM (Block Element Modifier).]
Não tenha medo de usar seu cérebro
Quanto mais complexo for o seu plugin, maior será o potencial do GPT bagunçar o seu código. Embora ajude você a depurar, às vezes você descobrirá que é melhor descobrir a solução sozinho. Para ser honesto, isso aconteceu bastante comigo, especialmente nos estágios posteriores da minha construção, onde meu arquivo PHP principal cresceu para mais de 500 linhas (com versões posteriores excedendo 1.000).
Dependendo da sua familiaridade e conforto com a leitura de código, isso pode ser um impedimento, mas se você for decente no reconhecimento de padrões e na detecção de inconsistências, poderá sobreviver.
Certamente não sou um programador qualificado, embora tenha uma compreensão do que várias linguagens de programação fazem e alguma familiaridade com código, o que me ajudou.
Ainda assim, mesmo que você seja um novato, você pode observar as linhas de código que o GPT acredita que podem estar causando o problema. Em seguida, encontre um elemento idêntico em seu código que esteja funcionando corretamente. Compare seu código com o código do elemento quebrado e tente ver o que há de diferente nele. Muitas vezes isso resolverá o problema:
Mantenha backups dos arquivos do seu plugin (opcional se estiver usando Git)
Embora o uso do Git forneça uma maneira poderosa de gerenciar e reverter alterações em seu código, nunca é uma má ideia manter backups manuais também. Sempre que você atingir um marco com seu código, sugiro salvar uma cópia dos arquivos de código principais em outra pasta:
Isso pode servir como uma rede de segurança adicional, permitindo que você reverta facilmente para uma versão anterior melhor se encontrar bugs sérios enquanto continua a construir.
Não desista facilmente, mas conheça seus limites
Pode haver algumas funções ou ajustes que você simplesmente não conseguirá implementar, não importa o quanto tente. Esteja preparado para ajustar suas expectativas e contorná-las . Isso não significa desistir se você bater em uma parede. No entanto, isso significa que se você fez 100 tentativas e passou horas (ou dias) tentando alcançar algo sem sucesso, então provavelmente não é possível ou está fora da capacidade de você e do ChatGPT.
Por último, se você está se perguntando se deve depurar ou limpar primeiro, no meu entender, não há uma resposta clara. Eu depurei antes de lintar, mas você pode usar como padrão a preferência do ChatGPT durante o processo ou dizer qual deseja fazer primeiro.
Fase seis (opcional): testes 🔬
Se você estiver construindo um plug-in relativamente simples e tiver confiança em sua funcionalidade com base em seus próprios testes manuais, não precisará necessariamente seguir esta etapa. Digo isso porque ainda requer muito trabalho codificar esses testes e, da mesma forma que você não obterá um plugin funcional com o ChatGPT, também é improvável que você obtenha um teste funcional sem a presença de bugs.
Simplificando, há aqui uma compensação entre investimento de tempo e valor prático .
Em minha própria experiência, consegui construir com sucesso um teste que verificava se meus plug-ins eram capazes ou não de executar suas funções principais quando um usuário interage com eles – mas levei um dia inteiro de depuração!
Do ponto de vista prático, já havia verificado manualmente as funcionalidades do meu plugin, mas foi bom ver que o teste confirmou que tudo estava funcionando.
Se você tentar construir um plug-in mais complexo do que o meu, ou se as funções do seu plug-in estiverem focadas no back-end (onde você não pode verificar manualmente se estão funcionando ou não), reserve um tempo para executar testes corretamente vale o trabalho manual.
Tipos de testes
Ferramentas a considerar
Fase sete (opcional): envie seu plugin para o repositório do WordPress 🥳
Se você chegou até este ponto, então ascendeu com sucesso a proverbial montanha de plugins. A única coisa que falta fazer é fincar sua bandeira para que ela se junte aos outros 59.650 plugins do repositório do WordPress.
Isso tem seu próprio processo separado, que é acompanhado por uma lista de verificação na página Adicione seu plugin:
- Leia as perguntas frequentes.
- Cumpra todas as Diretrizes para desenvolvedores de plug-ins.
- Certifique-se de ter permissão para carregar seu plugin no WordPress.org para que outras pessoas possam usar e compartilhar.
- Seu plugin, incluindo todas as suas bibliotecas e quaisquer outros ativos incluídos são licenciados como GPL ou são compatíveis com GPL.
- Você faz uma rodada final de testes com o plugin Plugin Check e resolve todos os problemas indicados (excluindo o que você acha que são falsos positivos).
Verificação de plug-in (PCP)Versão Atual: 1.1.0
Última atualização: 28 de agosto de 2024
plugin-check.1.1.0.zip
Você pode pensar que depois de toda a depuração, linting e testes que você fez, o plugin que eles pediram para você usar não pegará nada. No entanto, como desenvolvedor iniciante de plug-ins, você provavelmente terá alguns problemas pendentes para resolver – especialmente se não remover os arquivos de teste de sua compilação antes de executar a verificação.
Para prosseguir, vá em Ferramentas → Verificação de plug-ins :
Em seguida, marque todas as cinco categorias e execute a verificação:
Você pode então enviar esses problemas pendentes ao ChatGPT e resolvê-los. Quando terminar, execute a verificação novamente para garantir um resultado limpo. Faça isso quantas vezes precisar. Depois de obter uma verificação completamente limpa (excluindo falsos positivos), você pode enviar seu plugin para a equipe de desenvolvimento do WordPress. Em seguida, espere pacientemente que eles revisem.
Considerações finais 🧠
Embora seja um processo divertido e gratificante construir um plugin com ChatGPT, não é de forma alguma um processo rápido. Você precisa investir muito suor para fazer um produto final que funcione decentemente. No final, porém, você apreciará todas as novas habilidades que este projeto lhe ensinará.
Aqui estão algumas coisas que aprendi (e você também pode):
- Aprendi como navegar pelo disco rígido usando comandos do Terminal e também aprendi outros comandos relacionados ao processo de construção de um plugin.
- Agora estou bastante confortável com o Docker e o Local by Flywheel, que nunca usei antes deste experimento.
- Também estou familiarizado com muitas ferramentas e scripts de desenvolvedor que eu nem sabia que existiam antes disso.
- Já fiz algumas aulas com Free Code Camp e Codecademy e, embora ambos tenham sido ótimos, sinto que adquiri muito mais conhecimento prático ao concluir este projeto.
- Em relação ao acima exposto, agora tenho muitas informações de codificação aleatórias que serão úteis se eu trabalhar em algo semelhante novamente.
- A diferença entre zero e um plugin funcional é muito menor do que a diferença entre um plugin funcional e um plugin pronto para envio. Concluí uma versão funcional do meu plugin em poucos dias, mas levei mais algumas semanas antes de fazer todos os ajustes para torná-lo bom o suficiente para ser enviado ao repositório do WordPress.
No geral, essa foi uma das atividades mais legais que fiz em muito tempo. Obrigado por reservar um tempo para ler. Se você acabar usando alguma dessas informações para construir seu primeiro plugin, deixe-me um comentário abaixo. Adoraria conferir seu resultado final.