Environment Variables
Complete reference for all environment variables used by Sightline.
Quick Setup
Copy the example file and configure your variables:
cp .env.example .env.localNever commit .env.local or any file containing secrets to version control. The .gitignore file already excludes these files.
Required Variables
These variables must be set for the application to function.
NEXT_PUBLIC_MAPBOX_TOKEN
Required — Mapbox access token for map rendering.
NEXT_PUBLIC_MAPBOX_TOKEN=pk.eyJ1IjoieW91ci11c2VybmFtZSIsImEiOiJjbGFiY2RlZjEyMzQ1In0.abcdefghijk| Property | Value |
|---|---|
| Prefix | NEXT_PUBLIC_ (exposed to browser) |
| Format | String starting with pk. |
| Get one | mapbox.com/account/access-tokens |
The free tier includes 50,000 map loads per month, which is sufficient for most projects.
Supabase Variables
Required only when using the Supabase data adapter.
NEXT_PUBLIC_SUPABASE_URL
Supabase project URL.
NEXT_PUBLIC_SUPABASE_URL=https://abcdefghijkl.supabase.co| Property | Value |
|---|---|
| Prefix | NEXT_PUBLIC_ (exposed to browser) |
| Format | https://<project-ref>.supabase.co |
| Find it | Supabase Dashboard → Settings → API |
NEXT_PUBLIC_SUPABASE_ANON_KEY
Supabase anonymous (public) key.
NEXT_PUBLIC_SUPABASE_ANON_KEY=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...| Property | Value |
|---|---|
| Prefix | NEXT_PUBLIC_ (exposed to browser) |
| Format | JWT token |
| Find it | Supabase Dashboard → Settings → API → anon/public |
Only use the anon/public key in client-side code. Never expose the service_role key.
Branding Variables
NEXT_PUBLIC_SITE_NAME
Display name for the site, shown in header and meta tags.
NEXT_PUBLIC_SITE_NAME=My Incident Map| Property | Value |
|---|---|
| Default | Incident Map |
| Format | String |
NEXT_PUBLIC_SITE_DESCRIPTION
Site description for meta tags and SEO.
NEXT_PUBLIC_SITE_DESCRIPTION=Track and visualize geospatial incidents| Property | Value |
|---|---|
| Default | Track and visualize geospatial incidents |
| Format | String |
NEXT_PUBLIC_FAVICON
Path to custom favicon.
NEXT_PUBLIC_FAVICON=/favicon.ico| Property | Value |
|---|---|
| Default | /favicon.ico |
| Format | Path relative to public/ |
NEXT_PUBLIC_OG_IMAGE
Path to Open Graph image for social sharing.
NEXT_PUBLIC_OG_IMAGE=/og-image.png| Property | Value |
|---|---|
| Default | /og-image.png |
| Format | Path relative to public/ |
| Size | 1200×630 pixels recommended |
Logging Variables
NEXT_PUBLIC_DISABLE_LOGGING
Disable all client-side logging.
NEXT_PUBLIC_DISABLE_LOGGING=true| Property | Value |
|---|---|
| Default | false |
| Format | true or false |
NEXT_PUBLIC_LOG_LEVEL
Set the minimum log level for client-side logging.
NEXT_PUBLIC_LOG_LEVEL=warn| Value | Description |
|---|---|
debug | All logs (default in development) |
info | Info and above |
warn | Warnings and errors only (default in production) |
error | Errors only |
Development Variables
NODE_ENV
Node.js environment mode.
NODE_ENV=development| Value | Description |
|---|---|
development | Development mode with hot reload |
production | Production build optimizations |
test | Test environment |
NEXT_TELEMETRY_DISABLED
Disable Next.js anonymous telemetry.
NEXT_TELEMETRY_DISABLED=1Example Configuration
Minimal Setup (Static Data)
# Required
NEXT_PUBLIC_MAPBOX_TOKEN=pk.your_mapbox_token
# Optional branding
NEXT_PUBLIC_SITE_NAME=My Incident MapSupabase Setup
# Required
NEXT_PUBLIC_MAPBOX_TOKEN=pk.your_mapbox_token
# Supabase
NEXT_PUBLIC_SUPABASE_URL=https://abcdefghijkl.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...
# Optional branding
NEXT_PUBLIC_SITE_NAME=My Incident Map
NEXT_PUBLIC_SITE_DESCRIPTION=Tracking incidents in real-timeFull Production Setup
# Map
NEXT_PUBLIC_MAPBOX_TOKEN=pk.your_mapbox_token
# Supabase
NEXT_PUBLIC_SUPABASE_URL=https://abcdefghijkl.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...
# Branding
NEXT_PUBLIC_SITE_NAME=Sightline
NEXT_PUBLIC_SITE_DESCRIPTION=Open-source geospatial incident mapping
NEXT_PUBLIC_FAVICON=/favicon.ico
NEXT_PUBLIC_OG_IMAGE=/og-image.png
# Logging (production)
NEXT_PUBLIC_LOG_LEVEL=warn
# Development
NEXT_TELEMETRY_DISABLED=1Vercel Deployment
When deploying to Vercel, add environment variables in the project settings:
- Go to your Vercel project dashboard
- Navigate to Settings → Environment Variables
- Add each variable with the appropriate scope:
- Production — For production deployments
- Preview — For preview/staging deployments
- Development — For local development via
vercel dev
Use Vercel's Environment Variable Groups to share common variables across multiple projects.
Security Best Practices
- Never commit secrets — Use
.env.localfor local development - Use
NEXT_PUBLIC_prefix carefully — Only for truly public values - Rotate keys regularly — Especially after team member changes
- Use different keys per environment — Separate dev/staging/production
- Audit access — Regularly review who has access to production secrets
Troubleshooting
Variable not available in browser
Variables without the NEXT_PUBLIC_ prefix are only available server-side.
# ❌ Not available in browser
MAPBOX_TOKEN=pk.xxx
# ✅ Available in browser
NEXT_PUBLIC_MAPBOX_TOKEN=pk.xxxChanges not taking effect
- Restart the development server after changing
.env.local - Clear the
.nextcache:rm -rf .next - Verify the variable is loaded:
console.log(process.env.NEXT_PUBLIC_MAPBOX_TOKEN)
Vercel not reading variables
- Ensure variables are added to the correct environment scope
- Redeploy after adding new variables
- Check for typos in variable names