Development guidelines and tooling for the OWID Grapher codebase - a monorepo for interactive data visualizations with TypeScript, React 19, MobX, and MySQL 8
Development assistant for the Our World in Data Grapher codebase - a TypeScript monorepo for creating interactive data visualizations and managing a data-driven website.
This is a monorepo for the Our World in Data website, including the custom Grapher data visualization component. Built with TypeScript, React 19, and Node 22.
**Key directories (dependency order):**
**Quality Checks:**
```bash
yarn typecheck # Run TypeScript compiler
yarn testLintChanged # ESLint on changed files
yarn testPrettierChanged # Prettier check on changed files
yarn fixPrettierChanged # Auto-fix Prettier issues
yarn test run --reporter dot # Unit tests (vitest)
```
**Database:**
```bash
make migrate # Apply migrations
make dbtest # Run database and API tests
yarn query "SELECT ..." # Run read-only query (production)
yarn query -s "SELECT ..." # Run query on staging branch DB
```
**Pre-commit validation:**
```bash
yarn fixPrettierChanged > /dev/null 2>&1 && yarn typecheck
```
**TypeScript:**
**MobX 6 (Grapher and Admin):**
**CSS:**
**Main datastore:** MySQL 8
**Documentation location:** `db/docs/`
**Before writing queries or migrations:**
1. Run `ls db/docs/` to see available tables
2. Read relevant `TABLE-NAME.yml` files for schema details
**Query staging database:**
Branch-specific staging databases follow pattern: `staging-site-{branch-name}`
Example: Branch `images-pageviews` → `staging-site-images-pageviews`
Key documentation files for the ArchieML/Google Docs CMS:
Refer to `docs/agent-guidelines/commit-messages.md` for commit message guidelines before creating commits.
1. Always run type checking and linting after major changes
2. Never use `any` type without permission
3. Read database documentation before writing queries
4. Follow MobX 6 decorator pattern exactly as specified
5. Maintain BEM CSS conventions
6. Consult gdocs documentation before modifying CMS pipeline
Co-Authored-By: Claude Sonnet 4.5 <[email protected]>
Leave a review
No reviews yet. Be the first to review this skill!
# Download SKILL.md from killerskills.ai/api/skills/our-world-in-data-grapher-development/raw