msena98 / weather-master-app Goto Github PK

Sua chave da API no front-end está exposta é uma boa prática usar arquivos .env para informações que sejam sensíveis como senhas, chaves de api e etc.

Links Uteis

• Código fonte do projeto
• Como usar dotenv no JS

Vi que está usando a fetch nativa das APIs do JS parabéns! Muito massa!

Coisas que dá para fazer diferente (não está errado como está):

concatenar strings
Você está usando o operador unário + para concatenar strings, uma forma mais "moderna" de fazer isso é usar interpolação de string que foi lançada no ES6 do JS, ao invés de:

'http://dataservice.accuweather.com/locations/v1/cities/search?apikey=' + apikey + '&q=' + city

Fazer:

`http://dataservice.accuweather.com/locations/v1/cities/search?apikey=${apikey}&q=${city}`

remover parênteses desnecessários
Você está usando arrow functions () => {...} para os tratamentos da API. Porém sempre usa os parêntesis ao redor do nome do paramêtro, uma boa prática é usar parenteses quando forem 2 ou mais parâmetros, sem quando for um único e _ quando for nenhum.

_ => {
  // função com 0 parâmetros.
  console.log('Aqui');
}

parametro => {
  // função com 1 parâmetro.
  console.log(parametro)
}

(param1, param2) => {
  // função com 2 ou mais parâmetros.
  console.log(param1 + param2)
}

adicionar um catch e tratamento de erros
Adicionar um .catch(error => {...}) que vai tratar os casos de erro na requisição da API. A forma mais simples é dar um console.log mesmo com erro para saber que tem que arrumar.

fetch('https://jsonplaceholder.typicode.com/posts')
 .then(response => {
   //
 })
 .catch(error => {
   // 
 });