Organizar blocos de código pode ser complicado, especialmente porque é diferente de trabalhar com código estruturado. No entanto, desenvolvi uma metodologia que facilita tanto a implementação quanto a manutenção do sistema.
HTML
No HTML, eu separo o código por telas do sistema. Cada tela tem seu próprio bloco de código, o que facilita a leitura e a manutenção.
JavaScript
No JavaScript, sigo uma abordagem modular:
Procedimentos de API e Resposta de API: Mantenho todos os procedimentos relacionados a chamadas de API e manipulação de respostas em uma seção dedicada.
Eventos: Crio uma área específica para eventos, como cliques e outras interações do usuário. Isso inclui todos os event listeners, o que facilita a localização e a atualização de eventos.
Procedimentos do Sistema: Mantenho outra seção para os procedimentos internos do sistema. Aqui entram funções e lógicas que não estão diretamente ligadas a eventos ou APIs.
Inicialização do Sistema: Dedico uma área específica para a inicialização do sistema, onde configuro todas as definições iniciais e chamadas de inicialização necessárias.
Essa organização permite que eu tenha acesso rápido aos blocos de código necessários sem perder tempo procurando. A estrutura organizada influencia diretamente no comportamento e na eficiência do sistema, tornando-o mais robusto e fácil de manter.
Como organizo meu html:
JS
Estrutura de inicialização
Procedimentos de api e resposta de api
Eventos
Procedimentos do Sistema
Código limpo e organizado de fácil entendimento e manutenção. Se eu passar um ano sem ser o codigo ainda vou entender, se outra pessoa ver entende, também!
Tenho certeza que quem ver as imagens, ja entendeu o código!!!