ClimateLocal

• 

  Climate local

Inspiration

Climate change often feels like a distant global issue, making it hard for individuals to see its direct impact on their daily lives. We built ClimateLocal to bridge that gap by showing users localized, real-time climate metrics right in their browser.

What it does

ClimateLocal automatically detects a user's location via browser geolocation and displays live environmental metrics, including:

• Current local temperatures
• Air Quality Index (AQI) values
• Local climate trend alerts

How we built it

We built this prototype using a web frontend stack:

• HTML5 for page structure and content layout.
• CSS3 for a dark-mode responsive dashboard design.
• JavaScript (Async/Await & Fetch API) to query the Open-Meteo API and dynamically display live weather coordinates and metrics without reloading the page.

Challenges we faced

Connecting the frontend to an external API while handling geolocation permissions seamlessly was a fun challenge, but structuring asynchronous fetch requests allowed us to load real-time coordinates reliably.

What we learned

We gained hands-on experience structuring web applications from scratch, manipulating the DOM dynamically using JavaScript, and integrating third-party REST APIs into a clean UI.

What's next for ClimateLocal

We plan to expand ClimateLocal by adding interactive historical temperature charts, personalized sustainability action tips, and localized extreme weather push notifications.

Built With

• css3
• geolocationapi
• html5
• javascript
• open-meteoapi