WeatherApp

Este projeto é uma aplicação web que permite aos usuários visualizar a previsão do tempo atual de uma determinada cidade, usando a API oferecida pela OpenWeather. Você pode ver o video do meu projeto no meu LinkedIn

This project is a web application that allows users to view the current weather forecast of a given city, using the API offered by OpenWeather. You can see my project on my LinkedIn

Funcionalidades/ Features

Os usuários podem pesquisar o clima atual.
A aplicação exibe informações como temperatura atual, umidade, velocidade do vento e o tipo de clima
Os usuários podem alterar as unidades de temperatura entre Celsius e Fahrenheit.

Users can search for the current weather.
The application displays information such as current temperature, humidity, wind speed, and weather condition.
Users can change the temperature units between Celsius and Fahrenheit.

Como usar / how to use

Clone este repositório em sua máquina local.
Abra o arquivo index.html em seu navegador.
Digite o nome da cidade desejada na barra de pesquisa e clique no botão de pesquisa.
A aplicação exibirá as informações de clima para a cidade pesquisada.

Clone this repository on your local machine.
Open the index.html file in your browser.
Enter the desired city name in the search bar and click the search button.
The application will display weather information for the searched city.

Tecnologias usadas / Technologies used

HTML
CSS
JavaScript
Tailwind CSS

Aprendizados / Learning outcomes

Se tratrando do meu primeiro projeto, foi uma experiencia bem tranquila, me dediquei a trabalhar a minha mente com conceitos sobre técnologias em diversos polos diferentes e isso me ajudou a construir um projeto "decente" (estou muito longe de ser o profissional que eu almejo ser, mas trabalho diariamente para ser o que eu quero ser.) Este projeto me permitiu aprimorar minhas habilidades em HTML, CSS e JavaScript, bem como aprender a usar a biblioteca Tailwind CSS para estilização. Além disso, trabalhar com a API da OpenWeather me ensinou como fazer chamadas de API e lidar com respostas JSON. Também aprendi a criar um aplicativo web completo, do design à implementação e testes.

Being my first project, it was a pretty smooth experience. I focused on working my mind with concepts about technologies in various different areas, and that helped me build a "decent" project (I'm far from being the professional I want to be, but I work daily to be what I want to be.) This project allowed me to improve my skills in HTML, CSS, and JavaScript, as well as learning how to use the Tailwind CSS library for styling. Additionally, working with the OpenWeather API taught me how to make API calls and handle JSON responses. I also learned how to create a complete web application, from design to implementation and testing.

Dificuldades / challenges

Uma das principais dificuldades que encontrei ao trabalhar neste projeto foi entender como fazer chamadas de API e lidar com as respostas JSON retornadas. Também tive dificuldades em estilizar a aplicação de maneira agradável e funcional, e foi aí que o Tailwind CSS me ajudou muito, inclusive, teve um momento em que apaguei o código inteiro e comecei tudo do zero pois decidi que aquilo estava longe do que eu queria.

One of the main challenges I encountered while working on this project was understanding how to make API calls and handle the JSON responses returned. I also had difficulties in styling the application in a pleasing and functional way, and that's where Tailwind CSS helped me a lot. There was even a moment when I deleted the entire code and started from scratch because I decided it was far from what I wanted.

Contribuições / Contributions

Este é um projeto para meu portfólio pessoal, mas se você quiser contribuir ou fazer sugestões, sinta-se à vontade para abrir uma issue ou enviar uma pull request.

This is a project for my personal portfolio, but if you want to contribute or make suggestions, feel free to open an issue or submit a pull request.

Fonte de pesquisas e ferramentas / Sources of research and tools

Utilizei algumas fontes de pesquisa e algumas ferramentas para contribuir com o meu projeto:
I used some sources of research and some tools to contribute to my project:

Google
DevDocs
a documentação do tailwindCSS / tailwindCSS documentation
youtube
stackoverflow
MDN
HEX Color selector

Este projeto foi inspirado no video "ASMR Programming - Weather App With Javascript - No Talking"
https://www.youtube.com/watch?v=iILFBGm_I9M