Consultando API de Temperatura com JS
Usando o fetch do javascript para consultar uma api
Vamos fazer uma consulta para uma api de temperatura usando o fetch do javascript
Código
Primeiro vamos criar a interface, faremos algo simples, utilizando apenas HTML.
Para apresentar os dados temos uma div com dois span, um para representar a cidade e outro para representar a temperatura
Antes de tudo você precisa ter um cadastro no site openweathermap, ao fazer o cadastro você terá acesso a chave então é só mudar os parâmetros no código js.
Nas constantes temos city, uma constante com o elemento span city e uma com o elemento span temperature, depois temos três constantes de apoio para a consulta, URL_MAIN (onde fica a url do site openweather), API_KEY (onde fica a chave de acesso) e UNITS (onde fica o tipo de unidade que será retornado da api, para mais informações consulte o site)
Para iniciar é chamado a api de geolocalização do próprio navegador, e com ela é chamada a função loadUrl.
Na função loadUrl pegamos a coordenada que veio apartir da api de geolocalização e montamos a url para consultar a api.
Na função fetchApi é feito uma consulta para a url que foi criada e ao termos a resposta da api é exibido na página com o innerText.
pronto simples assim.
Demo
Veja abaixo o projeto completo funcionando.
Youtube
Se preferir assistir, veja o desenvolvimento no youtube.
Obrigado por ler!
Se você tiver alguma dúvida, reclamação ou dica, pode deixar aqui nos comentários. Vou ter o maior prazer em responder!
😊😊 Até mais! 😊😊
