A web page that fetches weather data from a weather API based a user-inputted location, displaying current weather conditions, temperature, and other relevant information.
Objective: To build a web page that:
- Fetches weather data using a weather API (such as OpenWeatherMap).
- Displays the current weather conditions, temperature, humidity, wind speed, and other relevant weather information.
- Allows users to input a location (city name or ZIP code) to get weather details for that specific location.
- HTML5: For structuring the content of the web page.
- CSS3: For styling the page, ensuring it is visually appealing and responsive.
- JavaScript: For fetching data from the weather API and updating the page dynamically.
- Weather API (e.g., OpenWeatherMap): To fetch the weather data.
- index.html # Main HTML file with structure and content.
- style.css # CSS file for styling the web page.
- main.js # JavaScript file for fetching weather data and updating the page.
- README.md # Documentation.
- Clone this repository: git clone https://github.com/rishanmenezes/PRODIGY_WD_05.git
- Open the project folder in a code editor (e.g., VS Code).
- Open index.html in a browser to view and interact with the weather page.
- Fetching weather data using an external API (OpenWeatherMap).
- Handling user inputs and displaying dynamic content based on those inputs.
- Implementing responsive design techniques to ensure the web page works well on various devices.
- Enhancing the user experience with dynamic content updates and interactive elements.
- Home Page: Includes a search bar for inputting location (city or ZIP code) and a button to fetch weather information.
- Current Weather Display: Shows the current temperature, weather conditions (e.g., sunny, cloudy), wind speed, and humidity.
- Responsive Design: The layout adjusts smoothly for both mobile and desktop views, ensuring accessibility and usability.
- Thanks to OpenWeatherMap for providing the weather data API.
- Resources: MDN Web Docs, W3Schools, JavaScript.info.