The purpose of this project is to display the current day as well as the 5-day weather forecast for the searched city. The cities searched are saved to local storage to be displayed on page reload so that the user does not have to research for the city.
- Installation
- Usage
- Credits
- Tests
- How to Contribute
- Deployed Application
- The user requires a normal web browser to use the application
- In order to apply changes to the application, the user would be required to install the visual studio code
- The user would need to clone the GitHub repository on their local server
- Finally, the user can make edits as they prefer
- User can search for a city using the search bar and submit button
- On the left side, the user is presented with the current day's forecast, and 5 cards are shown below for the 5-day forecast
- User is presented with the city name, date, weather icon, temperature, wind speed, and humidity in imperial units
- Once a city is searched, it is saved to local storage
- Once the page reloads, the application retrieves all the searched cities from local storage
- A button is created for each of the searched cities on the right side of the webpage
The following image includes the screenshot of the initial page reloads of the application.
I utilized the study material provided by the institution as a reference to complete my application.
Following are the documents I used to help me write code:
- https://day.js.org/docs/en/display/format
- https://getbootstrap.com/docs/5.3/getting-started/introduction/
- https://api.jquery.com/
- https://www.w3schools.com/jquery/
- https://www.w3schools.com/js/default.asp
- https://openweathermap.org/forecast5
- https://openweathermap.org/api/geocoding-api
Users can test the application by searching for as many cities as possible
My application's goal was to establish a connection with geocoding API and open weather API which I accomplished. The local storage can stores duplicate values. You can contribute by fixing this issue.