Debugging Is Where Real Learning Happens
Most tutorials show the happy path:
- Everything installs correctly
- Builds succeed
- Deployment works on the first try
Real projects are very different.
While building my portfolio and blog using Next.js App Router, I ran into multiple production-level errors that didn’t show up immediately. Fixing them taught me more about web development than writing new features ever could.
This post covers the most important lessons I learned while debugging those issues.
Production Errors Are Not the Same as Local Errors
One of the first surprises I encountered was that code working locally doesn’t guarantee it will work in production.
Reasons include:
- Different operating systems
- Stricter build steps
- Static analysis during deployment
- Server-side execution differences
Understanding this mindset shift was critical.
Lesson 1: Route Files Are Not Shared Modules
The problem
I initially imported shared values (like baseUrl) from route files such as:
sitemap.tsrobots.tsrss/route.ts
This worked locally but failed during the production build.
Why it broke
Route files in Next.js are entry points, not reusable modules.
They are evaluated differently by the framework and cannot safely export shared values.
The fix
I moved all shared configuration into a dedicated file: