{"id":230731,"date":"2022-12-03T13:07:00","date_gmt":"2022-12-03T10:07:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=230731"},"modified":"2022-12-03T19:08:25","modified_gmt":"2022-12-03T16:08:25","slug":"ferramentas-nativas-de-depuracao-do-wordpress-que-nao-exigem-um-ide","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/pt-pt\/ferramentas-nativas-de-depuracao-do-wordpress-que-nao-exigem-um-ide\/","title":{"rendered":"Ferramentas nativas de depura\u00e7\u00e3o do WordPress que n\u00e3o exigem um IDE"},"content":{"rendered":"\n<p>Se voc\u00ea acabou de se <strong><a href=\"https:\/\/tommcfarlin.com\/members-only-content\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">tornar membro<\/a><\/strong> do site e est\u00e1 buscando conte\u00fado especificamente para <strong><a href=\"https:\/\/tommcfarlin.com\/tag\/the-independent-wordpress-developer\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">The Independent WordPress Developer<\/a><\/strong>, recomendo ler <strong><a href=\"https:\/\/wordpress.mediadoma.com\/pt-pt\/instalando-o-wordpress-para-desenvolvimento-local\/\" title=\"o post anterior\">o post anterior<\/a><\/strong> \u2013 no m\u00ednimo \u2013 para se preparar para o conte\u00fado deste post.<\/p>\n<p>Se, no entanto, voc\u00ea quiser acompanhar o artigo anterior, aqui est\u00e1 uma pequena lista de tudo o que foi escrito at\u00e9 agora:<\/p>\n<ol>\n<li><strong><a href=\"https:\/\/tommcfarlin.com\/local-development-for-the-indie-wordpress-developer\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Desenvolvimento Local para o Desenvolvedor Indie WordPress<\/a><\/strong><\/li>\n<li><a href=\"https:\/\/tommcfarlin.com\/databases-and-tools-indie-wordpress-developer\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Bancos de dados e ferramentas para o desenvolvedor indie WordPress<\/a><\/li>\n<li><a href=\"https:\/\/wordpress.mediadoma.com\/pt-pt\/instalando-o-wordpress-para-desenvolvimento-local\/\" title=\"Instalando o WordPress para Desenvolvimento Local\">Instalando o WordPress para Desenvolvimento Local<\/a><\/li>\n<\/ol>\n<p>\u00c0 medida que nos preparamos para falar sobre t\u00f3picos mais avan\u00e7ados, como depura\u00e7\u00e3o e IDEs, primeiro vale a pena notar as ferramentas que temos dispon\u00edveis que podemos instalar no WordPress que nos ajudar\u00e3o com problemas de depura\u00e7\u00e3o durante o desenvolvimento.<\/p>\n<p><a href=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-163128-61e74ae7f1644.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-163128-61e74ae7f1644.png\" alt=\"Ferramentas nativas de depura\u00e7\u00e3o do WordPress que n\u00e3o exigem um IDE\"><\/a><\/p>\n<p>Al\u00e9m disso, esses problemas n\u00e3o est\u00e3o relacionados estritamente a problemas de PHP. Isso tamb\u00e9m inclui problemas de JavaScript. E para dar um passo adiante, existem maneiras de configurar o WordPress nativamente para que ele gere erros diretamente em nosso navegador.<\/p>\n<p>Portanto, antes de analisarmos os logs de erros, IDEs, Xdebug e assim por diante, veremos o que podemos fazer no pr\u00f3prio WordPress.<\/p>\n<h2>Ferramentas nativas de depura\u00e7\u00e3o do WordPress<\/h2>\n<p>As ferramentas nativas de depura\u00e7\u00e3o do WordPress s\u00e3o uma combina\u00e7\u00e3o de duas coisas:<\/p>\n<ol>\n<li>as op\u00e7\u00f5es que podemos definir no arquivo de configura\u00e7\u00e3o do WordPress que nos permitem ver as informa\u00e7\u00f5es gravadas na tela,<\/li>\n<li>v\u00e1rios plugins que nos ajudar\u00e3o a trabalhar com arquivos PHP e JavaScript dentro da \u00e1rea de administra\u00e7\u00e3o do WordPress<\/li>\n<\/ol>\n<p>Para o segundo ponto acima, quero deixar claro que existem muitos plugins dispon\u00edveis para algo assim; no entanto, quero manter a instala\u00e7\u00e3o o mais enxuta poss\u00edvel para que n\u00e3o sejamos inundados com muitas informa\u00e7\u00f5es.<\/p>\n<p>Em vez disso, quero que tenhamos as informa\u00e7\u00f5es necess\u00e1rias para testar e avaliar nosso trabalho, mas que tenhamos apenas o que precisamos. Pelo menos por enquanto. Talvez falemos sobre t\u00f3picos avan\u00e7ados em posts futuros.<\/p>\n<p>Dito isso, vamos come\u00e7ar.<\/p>\n<h3>Configura\u00e7\u00e3o do WordPress<\/h3>\n<p>Antes de se preocupar com a configura\u00e7\u00e3o, o pr\u00f3prio WordPress fornece algumas op\u00e7\u00f5es diferentes que podemos configurar no <code>wp-config.php<\/code>arquivo. Eles est\u00e3o bem documentados no Codex, mas sei por experi\u00eancia de e-mails de outras pessoas que as informa\u00e7\u00f5es podem ser um pouco dif\u00edceis de filtrar.<\/p>\n<p>Primeiro, \u00e9 importante observar o seguinte (conforme citado no WordPress Codex):<\/p>\n<blockquote>\n<p><a href=\"\/\/codex.wordpress.org\/WP_DEBUG)\" class=\"external external_icon\" rel=\"nofollow\" target=\"_blank\">WP_DEBUG<\/a> \u00e9 uma constante PHP (uma vari\u00e1vel global permanente) que pode ser usada para acionar o modo &#8220;debug&quot; em todo o WordPress. Sup\u00f5e-se que seja falso por padr\u00e3o e geralmente \u00e9 definido como verdadeiro no arquivo <a href=\"https:\/\/codex.wordpress.org\/Editing_wp-config.php\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">wp-config.php<\/a> nas c\u00f3pias de desenvolvimento do WordPress.<\/p>\n<\/blockquote>\n<p>Isso pressup\u00f5e que voc\u00ea entenda as constantes do PHP. Se n\u00e3o, confira o manual <strong><a href=\"https:\/\/secure.php.net\/manual\/en\/language.constants.php\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">aqui<\/a><\/strong> (\u00e9 bem simples). O curta \u00e9 o seguinte:<\/p>\n<blockquote>\n<p>Uma constante \u00e9 um identificador (nome) para um valor simples.<\/p>\n<\/blockquote>\n<p>Ent\u00e3o, vou fazer o que puder para fornecer as op\u00e7\u00f5es de configura\u00e7\u00e3o o m\u00e1ximo poss\u00edvel.<\/p>\n<p>Primeiro, no <code>wp-config.php<\/code>arquivo, voc\u00ea desejar\u00e1 alterar a linha <strong><a href=\"https:\/\/gist.github.com\/tommcfarlin\/426e02bcfc411d43be6715b3e84ead7e#file-09-wp-config-original-php\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">que diz:<\/a><\/strong><\/p>\n<pre><code>&lt;?php\ndefine( 'WP_DEBUG', false );<\/code><\/pre>\n<p><strong><a href=\"https:\/\/gist.github.com\/tommcfarlin\/426e02bcfc411d43be6715b3e84ead7e#file-10-wp-config-debug-php\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Para isso<\/a><\/strong> :<\/p>\n<pre><code>&lt;?php\ndefine( 'WP_DEBUG', true );<\/code><\/pre>\n<p>Isso n\u00e3o \u00e9 tudo, no entanto. H\u00e1 mais algumas coisas a serem adicionadas que melhorar\u00e3o a experi\u00eancia de depura\u00e7\u00e3o:<\/p>\n<pre><code>&lt;?php\ndefine( 'WP_DEBUG', true );\ndefine( 'WP_DEBUG_LOG', true );\ndefine( 'WP_DEBUG_DISPLAY', true );\n@ini_set( 'display_errors', 1 );\ndefine( 'SCRIPT_DEBUG', true );\ndefine( 'SAVEQUERIES', true );<\/code><\/pre>\n<p>Se voc\u00ea est\u00e1 acompanhando o Mas o que cada linha significa? Aqui est\u00e1 a explica\u00e7\u00e3o mais sucinta que posso dar agora:<\/p>\n<ul>\n<li><strong>WP_DEBUG<\/strong>. Isso exibir\u00e1 todos os erros e avisos lan\u00e7ados pelo PHP ao executar o WordPress. A execu\u00e7\u00e3o do aplicativo por si s\u00f3 n\u00e3o deve apresentar problemas; no entanto, execut\u00e1-lo ao lado de v\u00e1rios plugins pode ser uma hist\u00f3ria diferente dependendo da qualidade do plugin.<\/li>\n<li><strong>WP_DEBUG_LOG<\/strong>. Essa \u00e9 uma das minhas constantes favoritas e grava toda a sa\u00edda no log de maneira detalhada. Vou abordar isso em um pr\u00f3ximo post, mas, por enquanto, saiba que isso \u00e9 algo que acho que deve sempre ser definido em seu <strong><a href=\"https:\/\/wordpress.mediadoma.com\/pt-pt\/instalando-o-wordpress-para-desenvolvimento-local\/\" title=\"ambiente de desenvolvimento.\">ambiente de desenvolvimento.<\/a><\/strong><\/li>\n<li><strong>WP_DEBUG_DISPLAY<\/strong>. Este \u00e9 um que voc\u00ea pode definir como verdadeiro ou falso (embora eu prefira verdadeiro). Ele complementa a configura\u00e7\u00e3o anterior, permitindo que voc\u00ea veja as mensagens no navegador que tamb\u00e9m s\u00e3o gravadas no blog. N\u00e3o sei se isso \u00e9 algo que voc\u00ea achar\u00e1 ben\u00e9fico ou n\u00e3o. Se voc\u00ea n\u00e3o estiver preparado para passar por rastreamentos de pilha e informa\u00e7\u00f5es mais detalhadas, considere definir este como verdadeiro.<\/li>\n<li><strong>display_errors.<\/strong> O Codex menciona que voc\u00ea pode definir isso como false, mas acho que deve ser definido como true como forma de habilitar os erros e avisos.<\/li>\n<li><strong>SCRIPT_DEBUG<\/strong>. O n\u00facleo do WordPress usa vers\u00f5es minificadas de arquivos CSS e JavaScript. Desativar essa configura\u00e7\u00e3o permitir\u00e1 que voc\u00ea visualize todo o conte\u00fado dos arquivos no formato original. Isso \u00e9 particularmente \u00fatil se voc\u00ea estiver contribuindo para o Core ou trabalhando com o JavaScript inclu\u00eddo no Core.<\/li>\n<li><strong>SAVEQUERIES<\/strong>. Esta \u00e9 uma configura\u00e7\u00e3o um pouco mais avan\u00e7ada, na minha opini\u00e3o. Resumindo, ele pegar\u00e1 todas as consultas executadas no banco de dados e as salvar\u00e1 em um array PHP que voc\u00ea poder\u00e1 analisar posteriormente. Isto<\/li>\n<\/ul>\n<p>Agora que abordamos a configura\u00e7\u00e3o do WordPress, e os plugins?<\/p>\n<h3>Plugins para depura\u00e7\u00e3o<\/h3>\n<p>Quando digo que o reposit\u00f3rio est\u00e1 cheio de plugins para isso, estou falando s\u00e9rio. Na verdade, se voc\u00ea \u00e9 novo no desenvolvimento do WordPress, eu n\u00e3o recomendo procurar coisas para instalar.<\/p>\n<p>Pode rapidamente se tornar esmagador, voc\u00ea corre o risco de n\u00e3o entender o que alguns deles fazem e potencialmente lev\u00e1-lo a um caminho no qual voc\u00ea acaba atrapalhando sua instala\u00e7\u00e3o.<\/p>\n<p>Em vez de fazer isso, recomendo dar uma olhada nos seguintes plugins (lendo sua descri\u00e7\u00e3o primeiro, \u00e9 claro) e depois partir da\u00ed:<\/p>\n<ol>\n<li><strong><a href=\"https:\/\/wordpress.org\/plugins\/debug-bar\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Barra de depura\u00e7\u00e3o<\/a><\/strong>. Este plugin sozinho adiciona um menu \u00e0 barra de administra\u00e7\u00e3o que permitir\u00e1 que voc\u00ea veja a consulta, o cache e outras informa\u00e7\u00f5es. Ele requer que WP_DEBUG e SAVEQUERIES conforme descrito acima estejam habilitados.<\/li>\n<li><strong><a href=\"https:\/\/wordpress.org\/plugins\/debug-bar-list-dependencies\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Depend\u00eancias de script e estilo da lista de barras de depura\u00e7\u00e3o<\/a><\/strong>. Este \u00e9 um complemento para o plug-in acima que permitir\u00e1 depurar outros estilos JavaScript e CSS que est\u00e3o sendo executados no contexto do WordPress.<\/li>\n<li><a href=\"https:\/\/wordpress.org\/plugins\/debug-bar-console\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">Console da barra de depura\u00e7\u00e3o<\/a>. Este plugin \u00e9 aquele que voc\u00ea deve usar com hesita\u00e7\u00e3o. No m\u00ednimo, ele permite que voc\u00ea execute PHP e MySQL de dentro do pr\u00f3prio WordPress. Eu n\u00e3o recomendo este plugin a menos que voc\u00ea esteja muito confort\u00e1vel com qualquer um dos dois idiomas. Ainda assim, se voc\u00ea estiver, isso \u00e9 algo que pode ser poderoso para prototipar uma fun\u00e7\u00e3o ou uma consulta antes de constru\u00ed-la em seu plugin.<\/li>\n<\/ol>\n<h2>Examinando registros de erros<\/h2>\n<p>Na pr\u00f3xima postagem, come\u00e7aremos a analisar o que \u00e9 necess\u00e1rio para examinar o log de erros gerado pelo WordPress e como entender as informa\u00e7\u00f5es que vemos.<\/p>\n<p><a href=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-163128-61e74aee547cd.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-163128-61e74aee547cd.png\" alt=\"Ferramentas nativas de depura\u00e7\u00e3o do WordPress que n\u00e3o exigem um IDE\"><\/a><\/p>\n<p>Al\u00e9m disso, veremos o que \u00e9 necess\u00e1rio para usar os plugins descritos neste post. Depois disso, passaremos para ferramentas ainda mais avan\u00e7adas.<\/p>\n<p>Mas um passo de cada vez, certo?<\/p>\n<p>Por enquanto, configure sua instala\u00e7\u00e3o conforme descrito acima, instale os plugins vinculados e fa\u00e7a o que puder para explorar como eles funcionam, o que voc\u00ea pode ver na tela e como isso pode impactar e beneficiar positivamente seu desenvolvimento.<\/p>\n<p>Sim, pode haver um pouco de curva de aprendizado. Mas \u00e9 por isso que estamos indo devagar. H\u00e1 muito a aprender, e temos muito tempo para cobrir todo o terreno necess\u00e1rio.<\/p>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">Fonte de grava\u00e7\u00e3o:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/tommcfarlin.com\" class=\"external external_icon\">tommcfarlin.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Antes de examinarmos os logs de erros, IDEs, Xdebug e assim por diante, veremos o que podemos fazer com as ferramentas de depura\u00e7\u00e3o nativas do WordPress.<\/p>\n","protected":false},"author":1,"featured_media":163129,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[898,722,867],"tags":[1170],"class_list":["post-230731","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-codigo-2","category-desenvolvedor","category-wordpress-8","tag-affiai-pt-pt"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/posts\/230731","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/comments?post=230731"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/posts\/230731\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/media\/163129"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/media?parent=230731"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/categories?post=230731"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/pt-pt\/wp-json\/wp\/v2\/tags?post=230731"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}