A sleek, responsive, and real-time weather monitoring application built entirely with semantic HTML5, modern CSS3, and native vanilla JavaScript. This project demonstrates how to connect a front-end interface to a third-party REST API, manage asynchronous network requests, and dynamically manipulate the DOM based on live data.
- Real-Time Data Fetching: Integrates with a live weather API to deliver accurate, up-to-the-minute atmospheric data.
- Dynamic UI Updates: The interface automatically updates text, metrics, and weather condition icons dynamically without refreshing the page.
- Responsive Layout: Fully optimized for fluid viewing across desktop, tablet, and mobile screens.
- Error Handling: Gracefully handles invalid city queries, network timeouts, or empty inputs with user-friendly UI alerts.
- Architecture: Semantic HTML5, CSS3 Custom Properties (variables), and Vanilla JavaScript (ES6+).
- Asynchronous JavaScript: Utilizes the
Fetch APIpaired withasync/awaitsyntax to handle non-blocking asynchronous network requests. - DOM Manipulation: Heavy utilization of event listeners, dynamic class toggles, and template literals to inject live data cleanly into the UI.
- API Integration: Querying URL endpoints with query parameters and parsing JSON payloads securely.
git clone [https://github.com/ulrich-killian/gitprofileapp/]
cd YOUR_WEATHER_REPO_NAME