O NimbusCast é uma aplicação web desenvolvida com foco em Mobile First, totalmente responsiva, que permite consultar o clima em tempo real de qualquer cidade do mundo.
O projeto consome a API OpenWeatherMap, exibindo dados como temperatura, umidade, velocidade do vento e condição climática atual.
- HTML5 → Estrutura da aplicação
- CSS3 → Estilos e design responsivo
- JavaScript (ES6) → Lógica de busca e integração com a API
- OpenWeatherMap API → Fonte dos dados climáticos
✅ Busca de cidades por nome
✅ Exibição da temperatura atual em °C
✅ Dados de umidade, vento e descrição do tempo
✅ Ícones dinâmicos de acordo com a condição climática
✅ Layout adaptável para diferentes tamanhos de tela
O app consome dados da OpenWeatherMap API, realizando uma requisição via fetch() e exibindo os resultados diretamente na interface, de forma rápida e intuitiva.
Durante o desenvolvimento deste projeto, foram aprimorados conceitos de:
- Consumo de APIs REST com JavaScript
- Manipulação de DOM
- Design responsivo (Mobile First)
- Boas práticas de organização de código
Siga os passos abaixo para clonar, configurar a API Key da OpenWeatherMap e rodar o NimbusCast localmente 👇
Abra o terminal e execute:
git clone https://github.com/Erick-CamposDev/NimbusCast.git- Acesse o site oficial da OpenWeatherMap: https://openweathermap.org/
- Clique em Sign Up e crie uma conta gratuita.
- Após fazer login, vá até o menu API Keys no seu painel de usuário.
- Clique em Generate Key (ou Create Key) para gerar sua chave pessoal.
- Copie a chave gerada.
- Abra o arquivo principal de JavaScript do projeto (
script.js). - Localize a variável onde a API Key deve ser inserida, por exemplo:
const apiKey = "SUA_CHAVE_DA_API_AQUI";- Substitua o placeholder pela chave copiada
-
Utilizando o VScode baixe a extensão "Live Server" em seguida clique com o botão sobre o arquivo index.html e clique em "Open With Live Server" ou aperte Alt + L Alt + O pelo teclado.
-
Teste a aplicação!
Feito por Erick Campos

