Blue Sky Nigeria

A calm, mobile-first weather app for all 36 states of Nigeria and the FCT, leading with the rainfall and season story, wet season, dry season, the August break, and harmattan, backed by real monthly rainfall climatology.

Astro · Preact · TypeScript · Tailwind CSS · Cloudflare Pages Visit ↗ View code ↗
Ebenezer Afonja Claude

Ebenezer Afonja & Claude

Blue Sky Nigeria

Blue Sky Nigeria is a weather app built specifically for Nigeria, live at weather.ebenezerafonja.com. Most weather apps answer “what’s the weather now.” This one leads with the question Nigerians actually plan around: where are we in the season? Wet season or dry, the southern August break, the northern harmattan, all grounded in real monthly rainfall climatology rather than guesswork.

What it does

Pick any of the 36 states or the FCT and the whole app responds. A full-viewport ambient sky shifts to match that location’s real current condition and time of day, with a floating glass interface over it. You get the current conditions, a 24-hour hourly strip, a 7-day outlook, and air quality (PM2.5, PM10, European AQI, UV). The season strip shows where the current month sits in that zone’s rainfall year, using long-run monthly rainfall normals from the ERA5 climate archive.

How it’s built

The app is frontend-only, no backend, no API key, no account. All data comes from Open-Meteo’s free keyless APIs: forecast, air quality, and the ERA5 rainfall archive. Responses are cached in localStorage with sensible lifetimes (minutes for forecasts, a week for climatology), with in-flight request de-duplication so the app stays quick and polite to the API. The season strip and rainfall normals also work offline from a built-in per-zone baseline, so the app degrades gracefully when the network is down.

The page itself is an Astro static shell with Preact islands for the interactive dashboard, so the initial load is plain fast HTML and only the live parts ship JavaScript. Shared state flows between islands through Preact signals.

Technology Stack

  • Framework: Astro static shell with Preact islands
  • Language: TypeScript
  • Styling: Tailwind CSS plus a small hand-written layer for the glass tokens and the cross-fading ambient sky
  • Data: Open-Meteo (forecast, air quality, ERA5 rainfall climatology), free and keyless
  • Hosting: Cloudflare Pages, custom domain weather.ebenezerafonja.com

Repository: github.com/47QVA/blue-sky-nigeria

View Next

Pets by Cherry

Pets by Cherry

A full-stack pet ecommerce demo, real storefront, real cart and checkout, real admin CRUD, everything transactional simulated so no real money ever moves.
Astro · Preact · TypeScript · Cloudflare Workers · Cloudflare D1
Currency Converter

Currency Converter

Currency converter with live rates and historical trend charts for 150+ currencies built front-end-only with React and Vite.
React · TypeScript · Tailwind CSS · Recharts · Cloudflare Pages