Why does everything breaks only when it matters?

I'm a brilliant dude, said localhost.

My UI showed no errors and no warnings, and everything worked perfectly. The animations worked flawlessly; the forms were submitted like a hot knife through butter. I even got to tell someone that this might be the smoothest build I've done all year. Nah, I'm joking. I haven't talked to anybody. I work alone, and nobody cares about my code.

However, I do know that little voice in the back of my head that goes like, Maybe you should double-check the config in the production.

YEAH, I told you to shut up. Don't you see? Localhost said it would be fine.

Have you ever been in this situation? I'm pretty sure you have.

It deployed perfectly like a charm

It's a feeling I often have until the deployment didn't. A few minutes after the website went live, the form button was "just gone". And I thought, What? This can't be. I refresh localhost; it's still there, still perfect. I refresh production. Guess what? Missing!

And why are all those images a bit squished? And why is the screen on the mobile blank white?

Oh, I know why. It's the user's browser. Every single time those users don't update their browsers to the latest version. It's all their fault.

If things were so easy, then we wouldn't have to open the DevTools in production and see what's missing. I remember the biggest surprise that I had when I deployed an app built with Remix, and in production the hydration was just not working at all. It was producing blank content. And to make things more interesting, that's when I was in a meeting with a client, and I was making a live sale and had to navigate the client through the happy path so they could create an account and initiate the purchase. That was fun. Old remixes and old-style components.

Is localhost not production?

Well, as it turns out, it never was. Next.js was forgiving with dynamic routes, and the fonts were loaded locally; server-side rendering was ok. Everything was working super fine until the build system came in with cold and robotic precision. And guess what it did; it deployed exactly what I wrote. And on top of that, it also deployed exactly what I forgot to write.

Yes, the works on my machine paradox

It's quite funny, you know why?

Because I didn't forget to test, I just tested the wrong thing. I tested comfort, not reality. I'm pretty sure you know the feeling because I know it very well.

The bigger question would be how many bugs each and every one of us have shipped because localhost made us feel very safe.

Love or Hate, localhost.

Hey, don't get me wrong; I still love localhost. However, I've learnt not to trust localhost fully anymore.

I learnt this lesson a long time ago, and I built a new habit. Before every deploy I build locally and then start the production build locally. This saves me from seeing 90% of the deployment errors. Because there are at least those ugly 10% of deployment errors that have nothing to do with my deployment. It's just Cloudflare versus Netlify versus Vercel or other cloud providers having fun fighting each other and watching developers. Be happy with the results and suffer a few wounds.

So build to production and test production is what I want to do before someone else will. As someone else might not be so kind about it.

The Real Lesson, What's It About?

I believe localhost is just a pretty mirror. Production is when you go outside in the real world. so you shouldn't ship based on vibes.