I Built My Wife a Macro Tracker in 2 Hours

My wife tracks her macros in a Google Sheet on her phone. Every meal, she's pinching and zooming, entering numbers into tiny cells, doing mental math. Painful to watch.

As a Laravel dev, I knew I could build something better. But here's the thing - lately I've been leaning hard on Claude Code, generating thousands of lines I don't really understand. The technical debt was piling up. I was becoming a curator of code I couldn't debug.

So when I sat down to solve her problem, I had a choice: build another Laravel app I'd half-understand, or try something different.

The Decision

Spent an hour debating:

• Laravel - I know it, but I'd inevitably generate a ton of code with Claude Code
• Supabase + N8n + React - Visual workflows, less code to maintain

Then I realised: I was overthinking it. She needed something TODAY, not a perfect architecture.

The 2-Hour Build

2:00 PM - npm create vite@latest macro-hannah -- --template react. No auth. No database design. Just React and a dream.

2:15 PM - Three components: input field for food, progress bars for macros, today's entries. No routing. No state management. Just useState and fetch.

2:30 PM - N8n becomes the backend. Instead of building a backend, I created workflows:

1. Webhook receives: "2 eggs and toast"
2. Send to Claude: "Extract protein, carbs, fats from this"
3. Save to Supabase
4. Return to frontend

The entire "backend" is a visual workflow. No code to maintain.

3:00 PM - The magic connection:

const addFood = async (text) => {
  const response = await fetch('https://n8n.example/webhook/add-food', {
    method: 'POST',
    body: JSON.stringify({ text })
  });
  return response.json();
};

My React app doesn't know Supabase exists. It just talks to N8n webhooks.

3:30 PM - Deployed to Cloudflare Pages. Connected GitHub repo. Pushed. Live.

3:45 PM - "Hey babe, try this." She logged her afternoon protein shake. It worked.

What I Learned

I Was Overthinking Everything

As a Laravel developer, I was ready to build: authentication system, RESTful API, service layers, repository pattern, test suites.

What she actually needed: a text box and her macros.

Visual Workflows > Generated Code

With N8n, I can SEE the logic. When she says "it logged my coffee as chicken," I open N8n, look at the execution, and fix it.

With my Laravel apps full of AI-generated code? I'm grepping through files I don't understand.

Ship First, Perfect Never

Hour 2: Wife is using it. Week 2: Would still be designing the Laravel architecture.

The Features That Actually Mattered

What I thought she'd need: user accounts, food database, meal photos, social features, PDF export.

What she actually wanted: "Can you make the buttons bigger?" and "Can I talk instead of type?"

The Stack

• Frontend: React with Tailwind (~200 lines)
• Backend: N8n workflows (visual, no code)
• Database: Supabase (N8n handles it)
• AI: Claude API for parsing food
• Hosting: Cloudflare Pages (free)

She's logged 12 meals since yesterday.

Sometimes the best technical decision is to stop making technical decisions and start shipping.