Climão
Dashboard meteorológico responsivo com geolocalização, busca e cidades favoritas
Projeto
Criei o Climão como 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
Implementei o frontend como uma SPA com React, TypeScript e 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.
Na interface, combinei 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
Na revisão técnica, adicionei um lockfile reproduzível, atualizei a cadeia de lint para ESLint 10, migrei os gráficos para Recharts 3 e atualizei 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.