Climão
Dashboard meteorológico responsivo com geolocalização, busca e cidades favoritas
2025
Projeto
Climão é um dashboard para consultar as condições atuais e a previsão de cinco dias na localização do usuário ou em cidades pesquisadas. A interface reúne temperatura, sensação térmica, umidade, vento, pressão, nascer e pôr do sol, além de um gráfico das próximas horas.
Buscas recentes e até dez cidades favoritas ficam salvas localmente. O aplicativo também oferece temas claro e escuro, estados de carregamento e erro e controles navegáveis por teclado.
Identidade visual do projeto.
Arquitetura Técnica
O frontend é uma SPA em React e TypeScript construída com Vite. O React Router organiza o dashboard e as páginas de cidade. O TanStack Query separa o estado remoto por coordenadas, mantém os dados em cache por cinco minutos e cancela requisições obsoletas com AbortSignal. A API do OpenWeatherMap fornece clima atual, previsão e geocodificação.
A interface combina Tailwind CSS, primitivas Radix e Recharts. Favoritos e histórico usam localStorage, mantendo a experiência sem conta ou backend. A busca possui debounce para reduzir chamadas durante a digitação, e as coordenadas recebidas pela URL são validadas antes de consultar a API.
Manutenção e Desempenho
Uma revisão técnica adicionou lockfile reproduzível, atualizou a cadeia de lint para ESLint 10, migrou os gráficos para Recharts 3 e atualizou bibliotecas de interface compatíveis. A divisão por rota e o carregamento exclusivo das ferramentas de desenvolvimento reduziram o maior arquivo JavaScript gerado de aproximadamente 789 kB para 380 kB.
O projeto passa por ESLint sem avisos, compilação TypeScript e build de produção. Migrações maiores — React 19, Tailwind 4, Vite 8 e TypeScript 7 — permanecem separadas para testes visuais e de navegador dedicados.