O documento discute ferramentas e técnicas para debug de código em projetos WordPress, incluindo o uso de Docker para ambientes de desenvolvimento locais, ferramentas como Xdebug e Dev Tools para debug, e boas práticas de desenvolvimento como o uso do WP CLI e projetos scaffold.

1. Debug de cabo
a rabo
para projetos em
WordPress

2. Ricardo Moraleida
- Senior Web Engineer na 10up
- Na 10up desde 2015
- No WordPress desde 2009
- No Desenvolvimento Web desde 2004
- Na Internet desde 1994
-> about.me/ricardo.moraleida
-> twitter.com/co_di_go

4. 10up.com/careers

5. Uma boa rotina de debug
começa com um bom
fluxo de trabalho

6. Um bom servidor local
- Boa disponibilidade, rapidez
- Flexibilidade nas configurações
- Projetos simultâneos
- Fácil configuração
- Fácil de começar, parar, resetar
- Boas interfaces de
gerenciamento

7. Um bom servidor local
Eu uso:
- Docker
- WP Local Docker V2 (10up)
- WP CLI
Alternativas
- Local by WP Engine
- Chassis (Human Made)
- VVV (10up)

8. Ferramentas para escrever código
- Boa leitura, fluidez
- Ajustes visuais
- Correção automática de erros
simples
- Indicação de erros mais
complexos em tempo real
- Fácil navegação
- Fácil busca

9. Ferramentas para escrever código
Eu uso:
- PHPStorm
- SublimeText
- Vim
Alternativas
- VSCode
- Netbeans
- Cloud9

10. Ferramentas de debug
- Indicações de valores e
localização precisas
- Fácil visualização de escopo e
cadeia de execução
- Permite fazer testes enquanto
executa o debug

11. Ferramentas de debug
Eu uso:
- Xdebug
- Dev Tools

12. Demo:
WP Local Docker

13. Demo:
WP CLI

14. Boas práticas de
desenvolvimento

15. WordPress Developer Resources
https://developer.wordpress.org/

16. 10up Engineering Best Practices
https://10up.github.io/Engineering-Best-Practices/

17. 10up WP Component Library
https://10up.github.io/wp-component-library/

18. 10up Project Scaffold
https://github.com/10up/project-scaffold (npm)
https://github.com/10up/theme-scaffold (tema)
https://github.com/10up/plugin-scaffold (plugin)

19. 10up Project Scaffold
Ferramentas de debug no Front-End:
- runners, linters, watchers, webpack
- pa11y
(https://github.com/pa11y/pa11y)
- BackstopJS
(https://github.com/garris/BackstopJS )
- WP Acceptance
- (https://github.com/10up/wpacceptance )

20. Demo:
pa11y

21. 10up Project Scaffold
Ferramentas de debug no Front-End:
- runners, linters, watchers, webpack
- pa11y
(https://github.com/pa11y/pa11y)
- BackstopJS
(https://github.com/garris/BackstopJS )
- WP Acceptance
- (https://github.com/10up/wpacceptance )

22. Demo:
BackstopJS

23. 10up Project Scaffold
Ferramentas de debug no Front-End:
- runners, linters, watchers, webpack
- pa11y
(https://github.com/pa11y/pa11y)
- BackstopJS
(https://github.com/garris/BackstopJS )
- WP Acceptance
- (https://github.com/10up/wpacceptance )

24. Demo:
WP Acceptance

26. Na hora que o
bicho pega

27. Um pequeno desvio pra falar de IDEs
Integrated Development Environment
- Editores de código integrados com
ferramentas de produtividade
- Debugger
- Banco de Dados
- Busca Avançada
- Correção automática de erros

28. Um pequeno desvio pra falar de IDEs
Gratuitas
- Netbeans
- VScode
Pagas
- PHPStorm

29. Um pequeno desvio pra falar de IDEs
Gratuitas
- Netbeans
- VScode
Pagas
- PHPStorm

30. Um pequeno desvio pra falar de IDEs
Gratuitas
- Netbeans
- VScode
Pagas
- PHPStorm

31. Xdebug
Single-step debuggers
- Extensão do PHP
- Modo de uso: local ou remoto

32. Demo:
Xdebug

33. Demo:
Chrome Dev Tools