Skip to content

Repository files navigation

💸 The Fumble Machine

Ever wondered what that coffee could have been worth if you'd invested instead?

The Fumble Machine is an opportunity cost calculator that shows you the true cost of your past purchases. Enter what you bought, when you bought it, and what you could have invested in instead — and watch as we calculate how much you "fumbled."

🔗 Try it live →


🎯 What It Does

Ever bought something and later thought, "What if I had invested that money instead?"

The Fumble Machine answers that question with brutal honesty.

Example:

  • You bought a $50 video game in January 2020
  • Instead, you could have bought Bitcoin
  • That $50 would be worth $500+ today
  • You fumbled $450 💀

✨ Features

🌍 Multi-Currency Support

Enter your purchase in your local currency — USD, EUR, GBP, INR, JPY, and more. We handle all the conversions automatically.

📈 Real Market Data

Powered by Yahoo Finance API with accurate historical prices for:

  • Cryptocurrencies — Bitcoin, Ethereum, and more
  • Stocks — Apple, Tesla, NVIDIA, Amazon, Google
  • Indices — S&P 500, and other major indices
  • Global Markets — Indian stocks (NSE/BSE), European markets, and more

🧾 Shareable Receipt

Get a beautifully designed receipt showing your fumble that you can:

  • Download as an image
  • Share on Twitter/X
  • Post on Reddit
  • Copy the link

📱 Mobile-First Design

Looks great on any device with a responsive, modern UI.

😂 Relatable Roasts

Each fumble comes with a personalized message like:

  • "That's enough for a new smartphone"
  • "That's enough for a down payment on a house"
  • "That's enough for retiring 5 years early"

🤔 Use Cases

Personal Finance Reflection

  • Visualize the opportunity cost of impulse purchases
  • Build awareness about investment potential
  • Make better spending decisions

Financial Education

  • Teach the power of compound growth
  • Demonstrate "time in the market" concepts
  • Show real-world examples of opportunity cost

Social Sharing & Virality

  • Create shareable content about "fumbles"
  • Engage with communities on Twitter, Reddit, and more
  • Compare notes with friends on biggest misses

Content Creation

  • Financial influencers showcasing market history
  • Meme-worthy content for social media
  • Educational material for courses or blogs

🖼️ How It Works

  1. Enter your purchase — What did you buy and how much did it cost?
  2. Pick the date — When did you make that purchase?
  3. Choose what you missed — Bitcoin? Tesla? S&P 500?
  4. See the damage — We calculate exactly how much you fumbled

🛡️ Privacy & Security

  • No account required
  • No directly identifying information is collected
  • Optional aggregate analytics store country, selected asset, currency, calculated fumble amount, and emoji reactions — never your purchase description or an account identifier
  • All calculations happen in real-time
  • Open source and transparent

🚀 Tech Stack

Built with modern technologies:

  • Next.js 15 — React framework with App Router
  • TypeScript — Type-safe development
  • Tailwind CSS — Utility-first styling
  • Yahoo Finance API — Real-time and historical market data
  • Vercel — Deployment and analytics

🛠️ For Developers

Click to expand development instructions

Prerequisites

  • Node.js 18+
  • npm or yarn

Getting Started

# Clone the repository
git clone https://github.com/MrForward/Fumble-Machine.git
cd Fumble-Machine

# Install dependencies
npm install

# Run development server
npm run dev

Open http://localhost:3000 to see the app.

Environment Variables (Optional)

For production with caching enabled, set up Supabase:

  1. Create a free project at supabase.com
  2. Run the SQL schema from supabase/schema.sql in the SQL Editor
  3. Add environment variables to Vercel:
NEXT_PUBLIC_SUPABASE_URL=https://your-project.supabase.co
SUPABASE_SERVICE_KEY=your-service-role-key

Without Supabase, the app still works using in-memory caching (resets on deploy).

Project Structure

src/
├── app/
│   ├── api/          # Server-side API routes
│   ├── globals.css   # Global styles
│   ├── layout.tsx    # Root layout
│   └── page.tsx      # Main page
├── components/       # React components
│   ├── confession-form.tsx
│   ├── receipt.tsx
│   └── share-button.tsx
└── lib/             # Utilities and helpers

Deployment

Deploy instantly with Vercel:

Deploy with Vercel


📝 License

MIT License — feel free to use, modify, and share.


🙏 Acknowledgments

  • Market data powered by Yahoo Finance
  • Built with Next.js by Vercel
  • Inspired by the regret of every investor who said "I should have bought earlier"

Stop fumbling. Start investing.
Try The Fumble Machine →

About

A playful opportunity-cost calculator that turns past purchases into shareable “what if I invested?” receipts using real market data.

Topics

Resources

Stars

Watchers

Forks

Releases

Packages

Contributors

Languages