De 800 linhas a uma arquitetura limpa — refatoração de 16 telas

Há um momento em que você abre um arquivo e sente fisicamente o peso da dívida técnica. Minha tela principal tinha 800 linhas. Apenas um arquivo. Tudo misturado.

A estratégia de divisão

Eu refatorei 16 telas seguindo uma estrutura consistente: um hook personalizado para a lógica de negócios, subcomponentes para a renderização, um componente principal para a orquestração. O hook transforma um componente de 800 linhas em 100 linhas.

ESLint: de 71 para 0

Paralelamente, executei o ESLint no backend. 71 erros. Não desativando as regras — mas corrigindo o código. Cada any substituído por um tipo explícito. Cada promessa corretamente awaited.

Por que agora?

"Você está sozinho, quem vai ler este código?" Eu. Eu daqui a três meses, quando tiver esquecido por que esta tela faz o que faz. A dívida técnica não é uma metáfora. É um custo real que é pago em tempo, em bugs e em motivação.

Após a refatoração: 16 telas limpas, 0 erros ESLint, uma arquitetura que posso explicar em 30 segundos. A melhor semana do projeto.