This NEXT_PUBLIC variable still reads undefined in the browser

The value is right there in the .env file, and the browser still logs undefined.

Beginner to intermediateRead 6 minDoing: an afternoon6 steps

▶ Start

What you'll have at the end

The variable read from a Client Component after a fresh production build, printing the real value instead of undefined

Before you start

You need

A version of the app where this same value already reads correctly somewhere, plus whatever actually builds and ships the app for real users: a shared pipeline, a hosting platform's own build step, or a build run by hand.

Not covered

Reading a value that must differ per destination with no fresh build at all. That needs a different mechanism entirely, a small server response the browser fetches after the app starts, not the browser-exposed variable this recipe fixes.

Leans on

NextJS Cheat Sheetcovers the exact browser-exposed prefix rule, the dynamic-lookup exception that defeats it, and which environment file loads in which environment.
Node.js Cheat Sheetcovers how a running process's own environment works, including that a value set directly on the process always outranks one loaded from a file.

6 steps

Checked 25 Aug 2026

Part of the NextJS cookbook