Debug Production

You've built a complete feedback system with AI processing, webhooks, and security – and shipped it to main along the way. Now you'll make sure it runs cleanly in production and learn how to debug issues when things break, using Vercel logs and n8n execution history.

1. Confirm it's solid in production

Your feedback system is already live on main. Run a final check and point n8n at your production URL.

Test the live flow:

1. Visit your production URL.
2. Click "Give Feedback" and submit a test message.
3. Verify the email arrives and the feedback lands in your Neon database.

If everything works, your production feedback system is solid.

Outcome: Your feedback feature is confirmed working in production.

---

2. Understanding production debugging

Production is different from development. When something breaks in production, you can't just look at your terminal – you need to know where to look and what to look for.

Challenges of production debugging:

• Can't use local debugger: You can't step through code or set breakpoints
• Must minimize downtime: Every minute the app is broken costs users and trust
• Can't break live users: You can't experiment freely without affecting real people
• Limited visibility: You rely on logs, not real-time inspection

Tools available:

• Vercel logs: Shows what happens in your Next.js app (API calls, errors, webhooks)
• n8n execution history: Shows what happens in your workflows (node outputs, failures)
• Neon dashboard: shows database activity and errors (advanced)
• Browser console: Shows client-side errors (user reports)

The debugging mindset:

1. Read logs → Understand what happened
2. Form hypothesis → Guess what caused it
3. Test fix → Make the smallest change that should fix it
4. Deploy → Push the fix to production
5. Monitor → Confirm the issue is resolved

This iterative process lets you fix issues quickly without making things worse.

Common production issues you'll encounter:

• Webhook not triggering (connection problem)
• Workflow failing (n8n node error)
• Data not storing (database problem)
• API key verification failing (secret mismatch)
• Rate limit blocking real users (threshold too low)

Most issues are configuration or environment problems, not code bugs.

Outcome: You understand how to approach production debugging.

---

3. Access and read Vercel logs

Vercel logs show everything that happens in your Next.js app. Let's learn to navigate and interpret them.

Access Vercel logs:

1. Go to vercel.com and sign in
2. Click your project
3. Click the "Logs" tab in the top navigation
4. You'll see a real-time stream of log entries

Filter and search:

Vercel logs can be overwhelming. Use filters to find what you need:

• Filter by log level:

  • Info: Normal operations (request received, data processed)
  • Warning: Potential issues (slow query, deprecated feature)
  • Error: Something broke (webhook failed, database error)

• Filter by time:

  • Last 1 hour, 24 hours, 7 days
  • Custom date range

• Search by keyword:

  • Search "webhook" to find all webhook activity
  • Search "BLOCKED" to find rate-limited requests
  • Search "error" to find all error messages
  • Search by user ID to trace a specific user's actions

Read stack traces:

When an error occurs, Vercel shows a stack trace. Here's how to read it:

Error: Invalid API key
    at verifyApiKey (src/app/api/webhooks/n8n/feedback/route.ts:45:11)
    at POST (src/app/api/webhooks/n8n/feedback/route.ts:78:9)

What this tells you:

• Error message: "Invalid API key"
• Where it happened: src/app/api/webhooks/n8n/feedback/route.ts line 45
• Function: verifyApiKey
• Call stack: Shows the sequence of function calls that led to the error

Common issues and what to look for:

Issue: "Webhook not triggering"

• Search for [WEBHOOK] logs
• If no logs appear, the webhook isn't reaching your app
• Check: n8n webhook URL is correct, network isn't blocked

Issue: "API errors"

• Look for 500 status codes in logs
• Read the error message and stack trace
• Common causes: missing environment variables, database connection issues

Issue: "Auth failures"

• Look for 401 or 403 status codes
• Check: Clerk session is valid, user has required permissions

Practice: Finding sample errors

After practicing, you'll be comfortable navigating Vercel logs when real issues occur.

Outcome: You can read and understand Vercel production logs.

---

4. Use n8n execution history

When your webhook reaches n8n but something goes wrong in the workflow, you need to check n8n's execution history.

Access n8n execution history:

1. Sign in to n8n.io
2. Open your workflow
3. Click the "Executions" tab (left sidebar)
4. You'll see a list of all workflow runs

View a workflow run:

Click any execution to see:

• Status: Success (green), Error (red), Running (yellow)
• Start time: When the workflow was triggered
• Duration: How long it took to complete
• Input data: What data triggered the workflow
• Output data: What data each node produced

Identify failures:

• Red nodes: These nodes encountered an error
• Gray nodes: These nodes didn't run (stopped before reaching them)
• Green nodes: These nodes completed successfully

Trace data flow:

Click each node to see:

• Input: What data entered the node
• Output: What data the node produced
• Configuration: The node's settings

This lets you trace data through the entire workflow and pinpoint where it breaks.

Common n8n errors:

API timeout:

Error: Request timed out after 60000ms

Cause: External API (OpenRouter, Gmail) didn't respond fast enough
Fix: Increase timeout in node settings or check API status

Invalid credentials:

Error: Authentication failed

Cause: API key expired or incorrect
Fix: Update credentials in n8n settings

Data transformation issues:

Error: Cannot read property 'sentiment' of undefined

Cause: AI agent didn't return expected structure
Fix: Adjust AI agent's output schema or add error handling

Expected AI-enriched payload structure:

When debugging, you should see this structure in your webhook logs:

{
  "feedback": "The app is great but loading is slow",
  "userEmail": "user@example.com",
  "userId": "user_123",
  "sentiment": "negative",
  "category": "bug",
  "priority": "medium",
  "summary": "Loading is slow despite an otherwise positive experience",
  "actionable": true
}

If any of these fields are missing or have unexpected values, check:

1. Your AI agent's output schema in n8n
2. The HTTP Request node's data mapping
3. Your webhook endpoint's payload validation

Debug workflow issues:

After practicing, you'll know exactly where to look when workflows fail.

Outcome: You can debug n8n workflows using execution history.

---

5. Debug real production issue

When a user reports an issue, you need a systematic approach to find and fix it. Here's your debugging workflow.

Example scenario:

User reports: "I submitted feedback but didn't receive a confirmation email."

Your debugging workflow:

Step 1: Check Vercel logs

Go to Vercel logs and search for the user's submission:

• Search by timestamp or user ID
• Look for [WEBHOOK] logs
• Check: Did it succeed? Was it rate-limited? Was the API key valid?

Step 2: Check n8n execution history

Go to n8n executions and find the matching execution:

• Find by timestamp from Vercel logs
• Check: Did it complete? Which node failed? What was the error?

Step 3: Identify the root cause

No execution in n8n?

• Cause: Wrong webhook URL or n8n is down
• Fix: Check N8N_FEEDBACK_WEBHOOK_URL environment variable in Vercel

AI Agent node failed?

• Cause: Invalid API key, rate limit, or model unavailable
• Fix: Check OpenRouter account, refresh API key
• Common errors: 401 Unauthorized, 429 Too Many Requests, 503 Service Unavailable

Gmail node failed?

• Cause: Gmail authentication expired
• Fix: Re-authenticate Gmail in n8n credentials

Execution succeeded but no database entry?

• Cause: Wrong callback URL or a failing database insert
• Fix: Verify N8N_WEBHOOK_SECRET matches n8n, and check the insert in your Neon table

Step 4: Fix and verify

1. Make the smallest change that should fix the issue
2. Test by submitting new feedback
3. Check logs to confirm it's resolved
4. Monitor for 10-15 minutes

Step 5: Document the incident

Note for future reference:

• What broke: e.g., "Gmail authentication expired"
• How you found it: e.g., "n8n execution showed auth error at Gmail node"
• How you fixed it: e.g., "Re-authenticated Gmail in n8n credentials"
• Prevention: e.g., "Set calendar reminder to refresh credentials monthly"

This documentation helps you handle similar issues faster next time.

Outcome: You know how to debug and fix production issues.

---

Level 5 complete!

Congratulations! You've completed Level 5 and built a complete user feedback system:

What you've built:

• ✅ In-app feedback form with validation
• ✅ n8n workflow with AI-powered sentiment analysis
• ✅ Bidirectional webhooks (app ↔ n8n)
• ✅ Secure webhook endpoints with rate limiting and API key verification
• ✅ Data storage in Neon, scoped per user
• ✅ Mobile-responsive UI tested across devices
• ✅ Production deployment with full logging
• ✅ Debugging skills for when things break

Skills you've gained:

• 💎 Product: Understanding why user feedback matters and how to gather it
• 💪 Tooling: n8n integration, AI agents, OpenRouter, structured outputs
• 🎨 Design: Mobile responsive design, Tailwind utilities, skills & project rules
• 🏗️ Systems: Webhook architecture, bidirectional communication, planning with plan mode
• 🛡️ Security: Rate limiting, API key verification, request logging
• ⚡ Shipping: Production debugging, Vercel logs, n8n execution history

What's next:

You've learned to listen to users, process their feedback intelligently, and iterate on your product. These skills compound – the more you listen, the better your product becomes.

Continue to Level 6: 6.1 Product Pricing

In Level 6, you'll learn to:

• Design pricing models and subscription plans
• Integrate Stripe for payments
• Build a pricing page and purchase experience
• Implement feature gates based on subscription tier
• Create a public changelog to show your progress

But for now, take a moment to appreciate what you've built. You have a production SaaS with an intelligent feedback system. Users can tell you what they need, and you can act on it. That's powerful.

Try it yourself:

Submit feedback through your own app and watch it flow through the system:

1. Fill out the form
2. Watch the email arrive
3. Check Neon to see the sentiment analysis
4. Open Vercel logs to see the webhook activity
5. View n8n execution to see the AI processing

You built this. It works. Ship it to real users and start listening.

References

• Vercel Logs Documentation
• n8n Documentation
• Webhook Security Best Practices