Ownership & Security

Environment Variables Explained

Understand what environment variables are, which are safe for the browser, and how secrets stay out of your code.

Environment variables are named settings your app reads at build time or runtime — API keys, database URLs, feature configuration. They exist so that secrets and settings live outside the code. Your repository can then be shared, cloned, or even made public without leaking a single credential.

Where they live

For deployed projects, environment variables are stored on your Render service (dashboard, then your service, then Environment). Idea to Life sets them there automatically during builds, using values you provided in Integrations — decrypted server-side at that moment and placed directly on your service. They are never committed to your repository.

The critical distinction: public vs secret

In Next.js projects, the variable's name determines where it is visible:

Names starting with NEXT_PUBLIC_ are compiled into the browser bundle. Anyone can see them. Only genuinely public values may use this prefix.
All other names exist only on the server. The browser never sees them.

A typical project's variables:

# Safe in the browser (public by design)
NEXT_PUBLIC_SUPABASE_URL=https://xyzcompany.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=eyJhbGciOi...

# Server-only. Never expose, never rename with NEXT_PUBLIC_
SUPABASE_SERVICE_ROLE_KEY=eyJhbGciOi...
DATABASE_URL=postgresql://...
OPENAI_API_KEY=sk-...
ANTHROPIC_API_KEY=sk-ant-...
RESEND_API_KEY=re_...

The Supabase anon key is safe in the browser because Row Level Security limits what it can do. The service role key bypasses those rules entirely, which is why it is server-only, always.

Never "fix" a missing-variable error by adding NEXT_PUBLIC_ to a secret's name. That publishes the secret to every visitor. The correct fix is making the server-side code read it, which is how generated projects are written.

Build time vs runtime

NEXT_PUBLIC_ values are baked in during `npm run build` — changing them requires a redeploy to take effect in the browser. Server-only values are read at runtime, so changing them needs only a service restart. Render handles both automatically when the platform updates a variable.

Adding your own

If you integrate an additional service yourself (an analytics tool, a payment provider), add its variable in the Render dashboard's Environment tab, or ask for it via change request so the platform records it and writes the code that uses it. Keep the naming rule in mind when choosing the name.

Local development

If you or a developer runs the project locally, values go in a .env.local file, which generated projects list in .gitignore so it can never be committed. Never store real production secrets in files that are not gitignored, and never share .env.local contents over chat or email.