Skip to content

Zero-Config Quick Start

The .rep.yaml manifest is entirely optional. The gateway works with nothing but environment variables — the naming convention is the configuration.

Env var prefixTierIn the browser
REP_PUBLIC_*PUBLICPlaintext in <script id="__rep__">. Read with rep.get().
REP_SENSITIVE_*SENSITIVEAES-256-GCM encrypted. Decrypt with await rep.getSecure().
REP_SERVER_*SERVERNever leaves the gateway process.
REP_GATEWAY_*ConfigGateway settings. Not injected into the app.

That’s the entire protocol.

Terminal window
# Before (Vite) → After (REP)
VITE_API_URL REP_PUBLIC_API_URL
VITE_FEATURE_FLAGS REP_PUBLIC_FEATURE_FLAGS
# Before (CRA) → After (REP)
REACT_APP_API_URL REP_PUBLIC_API_URL
# Should be encrypted
REACT_APP_ANALYTICS_KEY REP_SENSITIVE_ANALYTICS_KEY
# Should never reach the browser
DB_PASSWORD REP_SERVER_DB_PASSWORD

Step 2 — Install the SDK and update reads

Section titled “Step 2 — Install the SDK and update reads”
Terminal window
npm install @rep-protocol/sdk
import { rep } from '@rep-protocol/sdk';
// Was: import.meta.env.VITE_API_URL
const apiUrl = rep.get('API_URL');
// With a default for local development
const apiUrl = rep.get('API_URL', 'http://localhost:3001');
// Sensitive — encrypted, decrypted on demand
const key = await rep.getSecure('ANALYTICS_KEY');

Step 3 — Build your app (nothing changes)

Section titled “Step 3 — Build your app (nothing changes)”
Terminal window
npm run build

The output is now environment-agnostic.

Terminal window
REP_PUBLIC_API_URL=https://api.example.com \
REP_PUBLIC_FEATURE_FLAGS=dark-mode,new-checkout \
REP_SENSITIVE_ANALYTICS_KEY=ak_live_abc123 \
./rep-gateway --mode embedded --static-dir ./dist

Open http://localhost:8080 — done.

Terminal window
# Stop. Change values. Restart.
REP_PUBLIC_API_URL=https://api.prod.example.com \
REP_PUBLIC_FEATURE_FLAGS=dark-mode \
./rep-gateway --mode embedded --static-dir ./dist

Same dist/ folder. Different runtime config.

For local development, point the gateway at a .env.local file and let it watch for changes automatically — no signals, no restarts:

.env.local
REP_PUBLIC_API_URL=http://localhost:3001
REP_PUBLIC_FEATURE_FLAGS=dark-mode
REP_SENSITIVE_ANALYTICS_KEY=ak_dev_abc123
Terminal window
./rep-gateway --mode embedded --static-dir ./dist \
--hot-reload \
--hot-reload-mode=file_watch \
--env-file=.env.local \
--watch-path=.env.local

Edit .env.local and save — the gateway picks up the changes immediately, re-encrypts sensitive vars with a fresh ephemeral key, and pushes a reload event over /rep/changes (SSE). Components using rep.onChange() re-render automatically without a browser refresh.

The manifest is additive. Add it when you need:

  • Startup validation — fail fast if a required variable is missing
  • Type constraints — enforce url, number, enum shapes
  • TypeScript typesrep typegen generates typed overloads
  • Documentation — single source of truth for all variables