Kako funkcioniraju varijable okruženja u Next.js?

Question

Accepted Answer

Next.js učitava varijable okruženja iz `.env` datoteka, s važnim pravilom sigurnosti: varijable su **samo za server prema zadanom postavkama**, a samo one prefiksne s `NEXT_PUBLIC_` su izložene pregledniku.

## Datoteke

```text
.env                # loaded in all environments
.env.local          # local overrides — GITIGNORED (put secrets here)
.env.development    # only in `next dev`
.env.production     # only in production builds
```

## Kritično pravilo prefiksa

```bash
# .env.local
DATABASE_URL=postgres://...secret...   # server-only — NEVER sent to the browser
NEXT_PUBLIC_API_URL=https://api.example.com  # exposed to the browser
```

```tsx
// Server Component / Route Handler / Server Action — can read anything
const db = process.env.DATABASE_URL;          // ✅ works on the server

// Client Component — only NEXT_PUBLIC_* are available
"use client";
const api = process.env.NEXT_PUBLIC_API_URL;  // ✅ works
const secret = process.env.DATABASE_URL;      // ❌ undefined in the browser
```

Ovo pravilo prefiksa je **sigurnosna značajka**: sprječava vas da slučajno pošaljete lozinke baze podataka ili tajne API-ja klijentu. Varijabla bez prefiksa jednostavno ne postoji u paketima preglednika.

## Kako se vrijednosti NEXT_PUBLIC_ ugrađuju

```text
NEXT_PUBLIC_* are INLINED at BUILD time (baked into the JS bundle).
```

Budući da se ugrađuju tijekom vremena izgradnje, promjena vrijednosti `NEXT_PUBLIC_` zahtijeva **ponovnu gradnju** — i nikada ne trebate stavljati prave tajne iza prefiksa (bile bi vidljive u paketu svima).

## Najbolje prakse

```text
✓ Secrets (DB URLs, API keys) → no prefix, kept server-side, in .env.local (gitignored)
✓ Public config (public API base, analytics id) → NEXT_PUBLIC_
✓ Commit a .env.example documenting required vars (no real values)
```

## Zašto je to važno

Model samo-za-server prema zadanom postavkama s mogućnošću `NEXT_PUBLIC_` opt-in je zaštita Next.js-a od curenja tajni klijentu — česta, ozbiljna greška.

Razumijevanje koje varijable dostižu preglednik, da se javne vrijednosti ugrađuju tijekom vremena izgradnje, i gdje pohraniti tajne (gitignored `.env.local`) je bitno za funkcionalnost i sigurnost.