Where Does Our Money Go?

A comprehensive educational website that explores how taxation is spent across different countries. This interactive platform helps users understand government spending, tax rates, and how public money is allocated.

🌐 Live Site

🚀 View Live Site | 📊 Demo Data | 📈 Historical Trends

🎯 What You Can Do:

• Compare Countries: See how different nations tax and spend
• Explore Historical Data: Track changes over time
• Interactive Charts: Hover and click to explore data
• Educational Content: Learn about taxation and government spending
• Mobile Friendly: Works perfectly on all devices

📱 Quick Start:

1. Visit the live site above
2. Select countries to compare
3. Choose chart types (Bar, Line, Pie)
4. Explore historical trends over time
5. Read educational content in the About section

---

🌍 Features

• Country Comparison: Compare tax rates and government spending between countries
• Historical Data: Track how taxation and spending have changed over time
• Interactive Visualizations: Charts and graphs to make data easy to understand
• Educational Tooltips: Hover over categories to learn what different terms mean
• Mobile Friendly: Works perfectly on desktop and mobile devices
• School-Friendly: Designed to be accessible for students and educators

📊 Project Statistics

📊 Data Sources

This website uses accurate, up-to-date data from:

• OECD (Organisation for Economic Co-operation and Development)
• World Bank
• IMF (International Monetary Fund)
• National statistical offices

🚀 Getting Started

Prerequisites

• Node.js (v18 or higher)
• npm or yarn

Installation

1. Clone the repository:

git clone https://github.com/yourusername/where-does-our-money-go.git
cd where-does-our-money-go

2. Install dependencies:

npm install

Environment Setup

This application requires API keys for accessing official government data sources. Create a .env file in the root directory:

# API Keys for Data Sources
# Get these from the respective organizations:
# - OECD: https://stats.oecd.org/api/
# - World Bank: https://data.worldbank.org/developers
# - IMF: https://www.imf.org/en/data

VITE_OECD_API_KEY=your_oecd_api_key_here
VITE_WORLD_BANK_API_KEY=your_world_bank_api_key_here
VITE_IMF_API_KEY=your_imf_api_key_here

3. Start the development server:

npm run dev

4. Open your browser and visit http://localhost:3000

🛠️ Development

Available Scripts

• npm run dev - Start development server
• npm run build - Build for production
• npm run test - Run tests
• npm run lint - Run linting
• npm run preview - Preview production build

Project Structure

where-does-our-money-go/
├── src/
│   ├── components/     # React components
│   ├── data/          # Data files and API calls
│   ├── hooks/         # Custom React hooks
│   ├── pages/         # Page components
│   ├── styles/        # CSS and styling
│   └── utils/         # Utility functions
├── public/            # Static assets
├── tests/             # Test files
└── docs/              # Documentation

🧪 Testing

The project includes comprehensive testing:

• Unit tests for components and utilities
• Integration tests for data flows
• Visual regression tests for UI consistency

Run tests with:

npm run test

📦 Deployment

This project is automatically deployed to GitHub Pages when tests pass. The deployment process:

1. Runs all tests
2. Builds the production version
3. Deploys to GitHub Pages if all tests pass

🔐 API Authentication Setup

1. Get API Keys

• OECD API: Visit https://stats.oecd.org/api/ and register for API access
• World Bank API: Visit https://data.worldbank.org/developers and get an API key
• IMF API: Visit https://www.imf.org/en/data and register for API access

2. Local Development

Create a .env file with your API keys (see Environment Setup above).

3. GitHub Secrets (for deployment)

1. Go to your GitHub repository
2. Click Settings → Secrets and variables → Actions
3. Click New repository secret
4. Add these secrets:

   OECD_API_KEY=your_oecd_api_key_here
   WORLD_BANK_API_KEY=your_world_bank_api_key_here
   IMF_API_KEY=your_imf_api_key_here
   

4. Deployment

The GitHub Actions workflow will automatically use the secrets during deployment.

🤝 Contributing

We welcome contributions! Please see our Contributing Guide for details.

📄 License

This project is licensed under the Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.

• All Content: CC BY-NC-SA 4.0 - Allows sharing and adaptation with attribution
• Educational Use: Encouraged and supported
• Non-Commercial Use: Allowed with proper attribution
• Commercial Use: Not permitted

See the LICENSE file for full details.

🙏 Acknowledgments

• Data provided by OECD, World Bank, and IMF
• Built with React, TypeScript, and modern web technologies
• Icons from Feather Icons
• Charts powered by Chart.js

📞 Support

If you have questions or need help, please open an issue on GitHub or contact us at info@dynamicdevices.co.uk.