weather web-app

  • slider image 1
  • slider image 2
  • slider image 3
  • slider image 4
  • slider image 3
  • slider image 4
  • slider image 4
16/06/23

This project was my first attempt of linking and fetching data asynchronous from an API to then display it using DOM manipulation. I decided to make a weather web-app as its simple concept since its my first APIs project, and also because the API used was very simple and straightforward to setup being the Open Weather API. Originally, it was developed so the user could only search by city, but then I relasized it would be better if the user could also search by the country as well to filter out cities with the same name. HTML and CSS was not the main focus of this project but it still ended up being visually appealing. Overall, it was a intesting and enjoyable project as it involved new conepetes for me to learn being Asyrcnous programming with the fetch API function. It took me 3-4 days to complete as it wasn’t a large project with it having only a few hundren lines of HTML, CSS and JavsScript. From it, I gained a better grasp at Asyrcnous programming with the fetch API function in JavaScript as well as DOM maniputlation.

features

  • Displays current wind speed, humidty and temperature of specified location via City and Country.
  • Data is always accurate and live as it utilized the open weather API.
  • Provides alerts and warning to the user if they have not enetered a Country, City or the specified location does not exist.
figma designs
html
css
javascript
open weather api