Guide LESSON · BEGINNER

environment variables, and which ones the whole internet can read

The storage location is not what makes a key secret. Whether it crosses into the browser is.

Free 2 min read Updated Jul 27, 2026

By the end you can

  • An environment variable is a setting handed to your app when it starts, from outside the code.
  • The reason it exists: the same code has to run in more than one place, and each place needs different settings.
  • Keys and credentials are the settings people most often keep this way.
  • The part that bites this audience.

What this is about

The storage location is not what makes a key secret. Whether it crosses into the browser is.

An environment variable is a good place to keep a setting. It is not, on its own, a hiding place. Some of those settings get built into the page the browser downloads, and anything in that page is readable by anybody who visits. A viewer who leaves with only that one sentence has the lesson.

How it actually goes

  1. 01

    An environment variable is a setting handed to your app when it starts, from outside the code.

    That is the whole mechanism, and it is the only mechanism the film teaches.

  2. 02

    The reason it exists: the same code has to run in more than one place, and each place needs different settings.

    Separating config from code is what makes that possible (S1).

  3. 03

    Keys and credentials are the settings people most often keep this way.

    That is correct practice and the film does not argue with it (S1).

  4. 04

    The part that bites this audience.

    Some of those settings are deliberately built into the page the browser downloads, so that code running in the browser can use them. That is a feature, not a bug, and it is how a build tool ships a public setting to the client (S2, S3).

  5. 05

    Anything built into that page is readable by anybody who loads the page.

    There is no privileged half of a downloaded page.

  6. 06

    So the storage location is not the security property.

    A key in an environment variable that gets built into the client bundle is a published key. Vite states this directly about its own client-exposed variables: their values "are bundled into your source code at build time," and they "should not contain sensitive information such as API keys" (S3).

  7. 07

    The check is observational, not theoretical.

    The page the browser downloaded is the evidence. You can look at it.

  8. 08

    Two honest limits.

    Which names get exposed is framework specific and the rules have moved between versions, so verify against the current documentation of the tool you actually used. And a key that has already shipped is not fixed by deleting it: it has to be replaced by the service that issued it (S4, S5, S6).

WANT IT BUILT FOR YOU?

You just learned how. We do it for a living.