Weather

Weather App Project developed for the Platzi "Manipulating DOM" course. The project is assigned without any detail on implementation.

Project URL

🚀 You can check the project working in the following link: https://wfercanas.github.io/Weather/

Project Description

Weather Application that uses the Open Weather API to show current and forecast data. In the App you can look for any city, select a city from a predefined favorite list and add or remove from it new cities.

This app does not control user data or has a backend that stores its data, so all the cities added or removed from the favorite list will last only until you refresh the page.

Main Objective

The intention of this project is to practice DOM Manipulation. Here you must fetch data from an API and present that information in a responsive layout. Additionally, the app enables de user to interact with a search bar to look for new cities and redefine a favorite cities list.

Technologies used

This project was developed using HTML, CSS and JS Vanilla.

Special Challenges

1. Fetch an API depending on the data you want to retrieve about certain city.
2. The app requieres a considerable amount of functions, so structuring the repository as clean and organized as possible is key for easy progression.
3. The app works around a few state variables. Proper function designing and their import/export as modules lets you control the whole app interactivity without much complexity.

Key JavaScript Concepts Used

1. fetch()
2. append(), remove()
3. addEventListener()
4. modules

Acknowledgements

• To @jonalvarezz and @platzi for this amazing course 💚.
• Also to Open Weather for giving access to FREE usage of their API.
• Finally, to Adin Yanuar, whose design published in Dribbble is the foundation of this app.