The Weather Dashboard is a web application that allows users to search for the current weather and a 5-day forecast for any city. The application fetches data from the OpenWeatherMap API and displays the weather information, including temperature, humidity, wind speed, and an icon representation of the weather conditions. Additionally, the app keeps a search history of previously searched cities, which can be clicked to quickly view their weather data again. This is a multifunctional weather app that will run flawlessly in the browser, and give you the ability to plan your upcoming trip to _____ based on the weather. It will feature dynamic HTML and CSS, and powered by JavaScript. I personally am excited with what YOU can do with this! As far as future development, I would love to add a feature that would display the local time (UTC based) for the searched-for city, reach out if you would like to collaborate on this!
- Search for the current weather and 5-day forecast for any city.
- Display city name, date, weather icon, temperature, humidity, and wind speed.
- Maintain a search history of previously searched cities.
- Click on a city in the search history to view its weather data again.
- HTML
- CSS (with Bootstrap)
- Javascript
- LocalStorage (to store search history)
- OpenWeatherMap API, and within that I utilized:
- Geocoding API to get the latitude and longitude of the searched city, as well as the 5-Day Weather Forecast API to pull the current and forecasted weather for the city.
- This application is deployed on GitHub Pages at: [https://collinsjosephj.github.io/weatherForecast/]
- Fork the repository.
- Create a new branch (git checkout -b feature-branch).
- Make your changes.
- Commit your changes (git commit -m 'Add some feature').
- Push to the branch (git push origin feature-branch).
- Open a pull request.
- This project is licensed under the MIT license, please refer to documentation for more details.
- I utilized the class documents and exercises. For some of the JS functions, I referenced W3, as well as work done by my peers. Bootstrap was utilized for the CSS.