Weather App

Consulte as condições meteorológicas de um lugar específico.
Explore o projeto »

Sobre • Features • Tecnologias • Preview • Como executar? • Licença • Contato

💻 Sobre o projeto

🌥️ Weather App - é um aplicativo React que permite ao usuário consultar as condições meteorólogicas de um lugar específico, e também exibir uma imagem aleatória de acordo com a localização buscada. Para obter essas informações, foram utilizadas três APIs externas: OpenWeatherMap, Unsplash e CountryFlag.

✅ Features

Ao entrar no aplicativo é possível ver um campo de pesquisa, onde o usuário deve digitar o nome da localização desejada. Em seguida, o aplicativo buscará as informações meteorólogicas, bem como a imagem do local e irá exibi-las ao usuário.

Caso não seja encontrada uma imagem para o local buscado, uma imagem padrão será exibida. Além disso, se o local buscado não existir, o sistema apresentará ao usuário uma mensagem de erro.

As seguintes informações são exibidas:

• Nome da cidade
• País
• Imagem e descrição do tempo
• Temperatura (ºC)
• Velocidade do vento (km/h)
• Umidade relativa do ar (%)

🛠 Tecnologias utilizadas

As seguintes ferramentas foram utilizadas no desenvolvimento do projeto.

• React
• React Icons
• Axios
• Typescript
• Storyset Web Illustrations

🔎 Preview do projeto

🚀 Como executar o projeto?

Pré-requisitos

Antes de começar, você vai precisar ter instalado em sua máquina as seguintes ferramentas: Git, Node. Além disso, é bom ter um editor para trabalhar com o código como o VSCode.

🎲 Rodando a aplicação

# Clone este repositório
$ git clone https://github.com/joaosouza7/weather-app

# Acesse a pasta do projeto no terminal/cmd
$ cd weather-app

# Instale as dependências do projeto
$ yarn | npm install

# Inicialize a aplicação
$ yarn dev | npm run dev

⚠️ Crie um arquivo .env na raiz do seu projeto e adicione suas Keys da API do OpenWeather e do Unsplash:

# Se criou o projeto com create-react-app
REACT_APP_NOME_DA_VARIAVEL=key-OpenWeatherMap
REACT_APP_NOME_DA_VARIAVEL=key-Unsplash

# Se criou o projeto com vite
VITE_NOME_DA_VARIAVEL=key-OpenWeatherMap
VITE_NOME_DA_VARIAVEL=key-Unsplash

📝 Licença

Esse projeto está sob a licença MIT. Veja o arquivo LICENSE para mais detalhes.

✉️ Contato

João Souza - Linkedin - joaoosouza07@gmail.com

Portfólio - https://portfolio-joaosouza7.vercel.app/

(🔝 Voltar ao topo )