Climate Tracking Website

• 

  Home Page

• 

  Prevention tips

Inspiration

Concerned by scattered, outdated climate information and inspired by the need for a single, up-to-date hub, I set out to build a site that brings real-time data, news, and actionable strategies into one place.

What it does

• Curated News Feed: Automatic roundup of the latest climate stories from trusted outlets.
  
• Prevention Techniques Page: Practical tips—from home energy audits to community tree-planting guides.

How we built it

• Front-end: React with Typescript + Tailwind CSS for a responsive, accessible UI.
  
• Deployment: Hosted on Vercel

Challenges we ran into

• API Rate Limits: Staggered requests and built a simple caching layer to avoid hitting quotas.
  
• Data Gaps & Normalization: Some sources used different units/timestamps—wrote transformation scripts to reconcile them.
  

Accomplishments that we're proud of

• Seamless, real-time integration of multiple data streams without noticeable lag.
  
• A clean prevention techniques module that users can filter by lifestyle, region, or cost.
  
• Automated news curation that updates every hour, reducing manual maintenance.

What we learned

• Best practices for API orchestration and caching in a scalable web app.
  
• The importance of data visualization ethics—labeling uncertainty and sourcing every dataset.
  
• How to optimize performance for large charts on low-powered devices.

What’s next for Climate Tracking Website

• Predictive Insights: Add simple forecasting models (e.g., short-term temperature trends).
  
• User Accounts & Alerts: Let users set thresholds (e.g., “notify me when CO₂ > 420 ppm”).
  
• Multilingual Support: Translate prevention tips & news summaries into additional languages.

Built With

• css3
• html5
• tailwind
• typescript
• vite