Ten Countries · Ten Homes

A small static site that puts ten orphanages — one in Ethiopia and nine in Muslim-majority countries — onto a 3D globe you can spin and zoom.

Click any marker to open a side panel with the orphanage's name, city, country, founding year, the number of children it holds, and a short biography, plus two photos you can click to enlarge.

Stack

• Vite + vanilla JS (no framework)
• globe.gl (three.js) for the interactive globe
• Unsplash for photos (hotlinked)

Run locally

npm install
npm run dev     # http://localhost:5173
npm run build   # → ./dist

Deploy on Coolify (Nuri)

This is a static site. In Coolify:

1. Create a new Static Site service.
2. Point it at the repo on git.nuri.works.
3. Build command: npm run build
4. Publish directory: dist
5. (Optional) Install command: npm install

That's it — the output in dist/ is a self-contained bundle.

Deploy anywhere else

dist/ is just static files. You can drag-and-drop it into:

• GitHub Pages
• Cloudflare Pages
• Netlify
• Vercel
• any nginx / Apache directory

Notes on the data

Coordinates are approximate city centers. Child counts are public-range estimates pulled from press coverage and the organizations' own statements — they reflect "around how many children live at the home today," not historical totals. Biographies are short and meant for a learning project; for anything official, contact the organizations directly.