Portfolio project

Urban Climate Tools

An open-source repository and discovery platform for urban climate practitioners — cataloguing tools, case studies, and data across six climate challenge areas. Built from scratch with Astro, Tailwind CSS v4, Pagefind and Leaflet.

GitHub repository Live site
26
Tools catalogued
22
Case studies written
6
Tool categories
6
Continents covered
19
Countries covered
MIT
Open-source licence

Scope

What I built

Content-driven static platform

Designed and built end-to-end: content model and schema, derived counts and filters from a single source of truth, frontend (Astro + Tailwind), search, and build-time OG images — all open source.

Equity-informed content strategy

Case studies deliberately span 6 continents and foreground equity considerations — Bogotá, Dhaka, Lagos, Medellín — not just the usual European city examples.

Shareable fact sheets

Every tool and case study is laid out as a self-contained fact sheet with key figures, sources and an at-a-glance layout, built to be screenshotted and shared.

Performance-first architecture

Static Astro output with no client-side framework; JavaScript only for the interactive islands (Tool Finder, Leaflet map, filters). Hosted on a global CDN.

Technology

Tech stack

Astro 6

Static site framework — zero JS by default, islands for interactive parts

Tailwind CSS v4

Utility-first CSS with CSS-native theming and dark mode

Content Collections + Zod

Every tool and case study is a typed Markdown file validated at build time

Leaflet

Interactive maps for global case study visualisation

Pagefind

Static full-text search indexed at build time, no server needed

Build-time OG images

Script generates a share card for every page so links unfurl well

Architecture

System overview

Content Layer Markdown files 26 tools · 22 case studies Zod schema validation Derived counts & filters Astro Build Static HTML + CSS Tool Finder & Leaflet map (islands) Pagefind search index Per-page OG images Tailwind CSS v4 · MDX · Sitemap Hosting Cloudflare Pages Deploys from GitHub CDN · HTTPS

Deliverables

Sample content

data

Climate Central

Climate risk assessment and visualisation for local communities

 heat

Cool Roofs Calculator

Calculate energy savings and heat reduction from reflective roofing

 data

Copernicus Climate Change Service (C3S)

Authoritative open data on past, present, and future climate

 green

i-Tree Tools

Quantify the ecosystem services and environmental benefits of urban forests

 coastal

NOAA Sea Level Rise Viewer

Visualise the potential impacts of sea level rise on coastal communities

 flood

EPA Stormwater Calculator

Estimate stormwater runoff reduction from green infrastructure practices

 Bogotá, Colombia

Climate Action as Social Equity: Bogotá's Integrated Approach

120,000 trees planted in lowest-income localities; 18% reduction in heat-related hospital admissions in target zones

 Cape Town, South Africa

Beyond Day Zero: Cape Town's Multi-Layered Water Resilience Strategy

Per-capita water consumption reduced by 50%; groundwater augmentation scheme adds 40 Ml/day to supply

 Copenhagen, Denmark

Carbon Neutral by 2025: Copenhagen's Systemic Transformation

67% CO2 reduction since 2005; 62% of trips made by bicycle; district heating covers 98% of households

Interested in this work?

Open to climate tech, urban data, and civic tech opportunities.

Get in touch GitHub