HyperSaaS
FrontendGetting Started

Environment Variables

Required and optional environment variables for the frontend.

Required Variables

VariableDescriptionExample
NEXT_PUBLIC_BACKEND_API_URLBackend API base URLhttp://localhost:8000
AUTH_SECRETNextAuth.js secret for JWT signingRandom 32+ char string

Optional Variables

VariableDescriptionDefault
NEXT_PUBLIC_APP_NAMEApplication display nameHyperSaaS
NEXT_PUBLIC_GOOGLE_MAPS_API_KEYGoogle Maps for location features
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEYStripe publishable key

Setup

# Copy the example file
cp .env.example .env.local

# Edit with your values
nano .env.local

Example .env.local:

# Backend API
NEXT_PUBLIC_BACKEND_API_URL=http://localhost:8000

# NextAuth
AUTH_SECRET=your-random-secret-at-least-32-characters-long

# Google Maps (optional — for location features in chat)
NEXT_PUBLIC_GOOGLE_MAPS_API_KEY=AIza...

# Stripe (optional — for billing)
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=pk_test_...

How Variables Are Used

Backend API URL

Used by getApiURL() in lib/utils.ts to construct all backend API calls:

export function getApiURL(): string {
  return process.env.NEXT_PUBLIC_BACKEND_API_URL ?? "http://localhost:8000";
}

Auth Secret

Used by NextAuth.js to sign and encrypt JWT tokens. Generate a secure value:

openssl rand -base64 32

Public vs Private

Variables prefixed with NEXT_PUBLIC_ are exposed to the browser. All others are server-only.

PrefixAvailable inUse for
NEXT_PUBLIC_Server + ClientAPI URLs, public keys, feature flags
No prefixServer onlySecrets, API keys, internal config

On this page