What's your preferred method for frontend deployment?

I’m having a bit of a disagreement with the devops team at my new job. I want to know how other people handle their frontend deployments.

Our stack includes Vite, nginx, BuildKite, Docker, Kubernetes, and Helm charts.

I’d rather just use npm run build with the right mode, but devops recommends generating a JS file with a Kubernetes helm chart configmap. This approach lets us reuse the same Vite build across different environments.

They plan to set the environment values at runtime by fetching or including a script in the index.html. I’m concerned this might cause issues if the values load too late.

What do you think? How do you manage environment variables and deployment for your frontend apps?

In my experience, the approach your DevOps team suggests has its merits, especially for scalability across environments. However, your concerns about potential timing issues are valid. A compromise I’ve found effective is using build-time environment variables for critical configurations, while allowing runtime overrides for flexibility. This way, you maintain the benefits of environment-specific builds while still enabling some runtime adjustments.

For deployment, we’ve had success with a hybrid approach. We use Docker for containerization, but instead of relying solely on Kubernetes config maps, we bake most environment variables into the image at build time. This ensures faster startup and reduces the risk of runtime issues. For values that truly need to be dynamic, we use a lightweight config server that the app queries on startup, before rendering critical components.

This setup has given us the best of both worlds: consistency across environments and the ability to make quick adjustments when needed, without compromising on performance or reliability.

we use vercel for frontends. super easy — just hookup your github and it manages deploy. could be pricy for big projects, but for most its gr8. focus remains on coding over deployment.

hmmm, interesting situation! have u considered using a hybrid approach? maybe use build-time vars for crucial stuff, but keep some flexibility with runtime config? that way, u get the best of both worlds. what about using a lightweight config service that loads before the app fully renders? just brainstorming here — curious what others think!