DEV Community

Sohana Akbar
Sohana Akbar

Posted on

Rollback a Frontend Deployment in 10 Seconds — kubectl rollout undo

TL;DR: When your SPA is crashing or your CSS is broken, kubectl rollout undo deployment/frontend is your fire extinguisher. Let's break down why this works instantly and how to use it without panic.

We've all been there. You ship a hotfix for a typo, but accidentally minify the wrong environment variable. Suddenly, your signup page is a white screen of death. The monitoring alerts start buzzing.

You have two choices:

Debug the bad build (5+ minutes).

Rollback to the last working version (10 seconds).

Let's choose speed.

The Magic Command
bash
kubectl rollout undo deployment/frontend
That’s it. In the time it takes to type that, Kubernetes has:

Scaled down the new, broken Pods

Scaled up the previous, stable ReplicaSet

Rerouted all traffic back to the good version

Under the Hood: How It Works So Fast
Unlike VM-based rollbacks (which require re-provisioning or re-imaging), Kubernetes keeps the history of your ReplicaSets. When you run undo, it simply changes which ReplicaSet the Deployment points to.

text
Before rollback:
Deployment → ReplicaSet-v2 (broken) → Pods (red)

After kubectl rollout undo:
Deployment → ReplicaSet-v1 (stable) → Pods (green)
No image re-pulling. No container rebuild. Just a pointer change.

Real-World Example: Frontend CDN vs. Kubernetes
You might think: "But my frontend is just static files on a CDN. Why use k8s rollback?"

Great question. If you serve pure HTML/JS from S3 + CloudFront, rollback means invalidating a cache (minutes). But if you run:

A Next.js app with server-side rendering (SSR)

A Node.js BFF (Backend for Frontend)

An Nginx container serving your build

...then Kubernetes rollback is faster than any CDN cache purge.

Practical Demo
Assume your frontend deployment is called web-app:

bash

See the rollout history

kubectl rollout history deployment/web-app

Output example:

REVISION CHANGE-CAUSE
1 Image: frontend:v1.2.0
2 Image: frontend:v1.3.0 (broken)
3 Image: frontend:v1.4.0 (current, also broken)

Undo to the last known good (v1.2.0 = revision 1)

kubectl rollout undo deployment/web-app --to-revision=1
Boom. Fixed.

Pro Tips for "10 Seconds" to Be Real
Don't use latest tag — Always version your images. Rollback relies on knowing which version was good.

Enable revision history limit (default is 10). Keep at least 3 old ReplicaSets:

yaml
spec:
revisionHistoryLimit: 5
Annotate your changes — So you know what you're rolling back to:

bash
kubectl annotate deployment/frontend kubernetes.io/change-cause="fix: revert to v1.2.0"
Watch the rollback — Don't just type and pray:

bash
kubectl rollout status deployment/frontend --watch
When NOT to Use rollout undo
If your frontend manages state in localStorage and the data schema changed between versions → users may still see errors until hard refresh.

If you've already scaled to zero the old ReplicaSet (manual deletion) → you'll need to redeploy the image.

If your database schema changed in the backend (rare for frontend-only, but BFFs beware).

The 10-Second Drill
Practice this so it becomes muscle memory:

bash

1. See red alert

2. Type this instantly:

kubectl rollout undo deployment/frontend -n production

3. Verify it worked:

kubectl get pods -n production -l app=frontend
Final Thought
Speed of recovery is more important than speed of deployment. A broken deploy that takes 10 seconds to fix is safe. One that takes 10 minutes is dangerous.

So go ahead — ship that Friday afternoon hotfix. You know how to undo it in less time than it takes to brew coffee.

Found this useful? ♻️ Share it with your team. And remember: kubectl rollout undo is not a failure — it's a feature.

Have you ever had a frontend rollback horror story? Let me know in the comments.

Top comments (0)