The Deployment From Hades

Source: Dev.to

Introduction

I come from the era when everyone used Stack Overflow 😆. This is the story of building version 2 of my portfolio, the chaos that followed when I tried to deploy it to Google Cloud for the first time, and how I finally got it live.

The First Deployment Failure

After creating a Dockerfile for my Google Cloud project I hit this error:

ERROR: (gcloud.run.services.update) The user‑provided container failed to start and listen on the port defined by the PORT=8080 environment variable within the allocated timeout. This can happen when the container port is misconfigured or if the timeout is too short. The health‑check timeout can be extended. Logs for this revision might contain more information.

That error ate 5 hours of my life and taught me the importance of simple logging.

Why I Started This Challenge

My significant other keeps nudging me to do dev challenges, and I’ve been wanting to rebuild my website in React with a three.js background. Since this is a Google AI challenge, I decided to dive deep into the stack.

Tools I Used

1. Antigravity – a glorified VS Code with Google AI Studio built‑in.
2. Google Gemini – for troubleshooting and code generation.

First Attempt with Antigravity

I gave Antigravity the following prompt:

“Download my website from https://www.madrigal.design, and redesign the website into a react.js stack. Clean up the website and modernize the code.”

The result was… abominable. I didn’t even have screenshots because it was that bad.

Second Attempt – A Better Starting Point

I ran the prompt again, this time inside the folder that already contained my original code. Antigravity generated something almost usable right off the bat:

• It first built the project in vanilla JavaScript and CSS – looked nice, but I wanted React.
• I reprompted it to convert the project to React, and the output was impressive, though a bit bloated. I later trimmed the excess.

Adding a Three.js Background

I haven’t had time to learn three.js properly, but I wanted a particle‑wave background with rippling colors, kept minimal. After a few prompts to adjust the colors to match my site, the AI produced a surprisingly compact implementation.

I also used the AI to turn my “Creations & Projects” section into a carousel, giving me a quick way to learn how three.js is integrated.

A Little Chaos (Optional Feature)

WARNING!
Press the “Stop Chaos!” button when the time comes.

I added a hidden “chaos” button for fun.

The Second Deployment Failure

With Google Cloud set up, I enabled GitHub continuous deployment so that each new commit would automatically trigger a new deployment.

Again I hit the same error as before:

ERROR: (gcloud.run.services.update) The user‑provided container failed to start and listen on the port defined by PORT=8080 …

My (mis)trust in AI

I turned to Google Gemini for help, assuming that a Google product could quickly fix a Google Cloud issue. After many prompts and 13 failed deployments, I finally stepped back for 48 hours.

Debugging with Logs

When I returned, my partner and I inspected the Cloud Run logs together. We noticed a problem with Vite being built incorrectly, which the AI had missed.

• The Vite build error was fixed.
• The way serve was being called in the Dockerfile was also wrong.

After correcting those issues, the deployment finally succeeded.

Final Success

• The service started listening on PORT=8080.
• I mapped a sub‑domain to the Cloud Run service via Google Cloud’s domain mapping.

After the DNS propagated, the new site went live.

Takeaways

1. Read the logs first. They often point directly to the root cause.
2. AI is a helpful assistant, not a replacement for debugging fundamentals.
3. Iterative prompting can produce great code, but expect some bloat that you’ll need to clean up.
4. Container port configuration is a common source of Cloud Run failures – always verify that your app listens on the port supplied by the PORT environment variable.

Closing Thoughts

This challenge reminded me that AI can accelerate learning and coding when used responsibly. It also reinforced the timeless advice: trust, but verify—especially when the logs are screaming for attention.

Happy coding, and may your next deployment be smooth!

I needed this update for myself, and it was enjoyable to play with new tools, new stacks, and do something different. Antigravity was a fun, juiced‑up version of VS Code to play with, and being able to produce a website with Three.js inside my editor in the stack I wanted was nice to try, see, and learn. I think the Three.js background is what really stood out to me in this rebuild. Thanks to the DEV community and their competitions for this.