Problem Atlas
A website about India's biggest problems, the evidence behind them, and the solutions being tried. It starts with India and is built so other countries can be added later.
Built with Astro. All content lives in plain text files, so there is no database to run.
Run it on your computer
You need Node.js 20 or newer.
npm install
npm run dev # open http://localhost:4321
Search only works on the built site:
npm run build
npm run preview
Put it online (free)
- Sign in to Vercel with your GitHub account.
- Click Add New → Project and pick this repository.
- Keep the defaults (Vercel detects Astro) and click Deploy.
Every push to main then updates the live site in about a minute. Afterwards, set site in astro.config.mjs to your live address.
How the content is organised
| What | Where |
|---|
| Problems | src/content/problems/*.md, one file per problem |
| Solutions | src/content/solutions/*.md, one file per solution |
| Resources (articles, papers, videos, reports, data) | src/data/resources.json |
| Categories (Water, Health, ...) | src/data/categories.json |
| Regions (World > India > states) | src/data/regions.json |
The file name is the page address: src/content/problems/air-pollution.md becomes /problems/air-pollution/.
Problems, solutions and resources point to each other by id. The build checks every id, so a typo stops the build with a clear error instead of creating a broken link.
Add a resource
Add an entry to src/data/resources.json:
{
"id": "niti-water-index",
"title": "Composite Water Management Index",
"type": "report",
"url": "https://www.niti.gov.in/",
"source": "NITI Aayog",
"year": 2019
}
type is one of article, paper, video, report, dataset, podcast. Then add its id to the resources list of any problem or solution that uses it.
Add a problem
Create src/content/problems/<id>.md:
---
title: "Groundwater depletion"
summary: "One or two sentences that explain the problem."
categories: ["water", "agriculture"]
regions: ["in-punjab", "in-haryana"]
regionNote: "Optional free text about where"
sdgs: [6]
keyStats:
- { value: "35.5%", label: "of children under 5 are stunted", source: "NFHS-5, 2019-21" }
solutions: ["drip-irrigation"]
resources: ["cgwb"]
related: ["climate-change"]
whatYouCanDo:
- { step: "Fix leaks at home", how: "One sentence on how to do it." }
whatGovernmentCanDo:
- { step: "Meter farm electricity", how: "One sentence on what it means." }
updated: 2026-10-25
---
## Causes
- ...
## Impact
- ...
Statistics and charts are optional. Only add a figure you have checked against its source, and link the exact page:
keyStats:
- { value: "41.7%", label: "of women aged 15+ were in the labour force in 2023-24", source: "PLFS 2023-24", sourceUrl: "https://..." }
charts:
- title: "Women's labour force participation rate (age 15+)"
kind: line # or bar
unit: "%"
series: ["2015-16", "2019-21"] # only for grouped bars; leave out for one series
data:
- { label: "2017-18", values: [23.3] }
- { label: "2023-24", values: [41.7] }
source: "MoSPI, PLFS annual report 2023-24"
sourceUrl: "https://..."
whatYouCanDo steps appear as a checklist readers can tick (saved in their own browser). whatGovernmentCanDo appears as a numbered list beside it.
Add a solution
Create src/content/solutions/<id>.md with title, summary, categories, regions, sdgs, approach, whoIsDoingIt, problems, resources and updated, then ## How it works and ## Evidence so far sections. A link only has to be written on one side: a solution that lists a problem shows up on that problem's page too.
Add a country
Add the country and its states or cities to src/data/regions.json, with parent pointing up the tree:
{ "id": "ke", "name": "Kenya", "type": "country", "parent": "world" },
{ "id": "ke-nairobi", "name": "Nairobi", "type": "city", "parent": "ke" }
Region pages (/regions/ke/) then list everything tagged with that country or anywhere inside it.
Citations
Every claim needs a source you have opened and checked.
-
Summary: list sources under summarySources in the front matter. They show as a "Sources:" line under the summary.
summarySources:
- { source: "ASER 2022", url: "https://..." }
-
Body text: end each point with a Markdown footnote, and define the footnote at the bottom of the file. Footnotes become the numbered "Sources" list on the page.
- Only 25.6% of Class 5 children could do division in 2022.[^aser]
[^aser]: [ASER 2022 national findings](https://...), ASER Centre, January 2023.
-
Statistics and charts: give source and sourceUrl.
-
Resources: link the specific article, paper or video, not a search page. Use type website for an organisation's home page. year is optional.
-
Photos: use only freely licensed files from Wikimedia Commons (CC0, public domain, CC BY or CC BY-SA). Open the file page, copy the author and licence exactly, and link the file page as sourceUrl. The credit line is printed under the photo. src is the Commons 1280px thumbnail.
image:
src: "https://upload.wikimedia.org/wikipedia/commons/thumb/a/ab/Name.jpg/1280px-Name.jpg"
alt: "What the photo shows, for screen readers"
caption: "Where and when it was taken."
author: "Photographer name"
license: "CC BY-SA 4.0"
licenseUrl: "https://creativecommons.org/licenses/by-sa/4.0"
sourceUrl: "https://commons.wikimedia.org/wiki/File:Name.jpg"
