Skip to main content
8Space uses environment variables to configure the application and landing site. The project is split into two packages, each with its own configuration.

​
App Package Variables

The main application (packages/app) requires Supabase configuration to connect to the backend.
​
VITE_SUPABASE_URL
string
required
Supabase project URL. For local development, use the local Supabase instance.Default (local): http://127.0.0.1:54321Example (production): https://your-project.supabase.co
​
VITE_SUPABASE_ANON_KEY
string
required
Supabase anonymous key for client-side authentication. This key is safe to expose in the browser.Local development: Copy from supabase start outputProduction: Get from Supabase Dashboard → Settings → API

​
App Configuration Example

Create packages/app/.env:
packages/app/.env
VITE_SUPABASE_URL=http://127.0.0.1:54321
VITE_SUPABASE_ANON_KEY=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...
The Supabase client in packages/app/src/integrations/supabase/client.ts includes fallback values for local development:
  • Fallback URL: http://127.0.0.1:54321
  • Fallback anon key for local Supabase instances

​
Landing Package Variables

The landing site (packages/landing) requires additional variables for authentication and payment processing.

​
Supabase Configuration

​
NEXT_PUBLIC_SUPABASE_URL
string
required
Supabase project URL for the Next.js landing site. Should match the app package URL.Default (local): http://127.0.0.1:54321
​
NEXT_PUBLIC_SUPABASE_ANON_KEY
string
required
Supabase anonymous key for the Next.js landing site. Should match the app package anon key.

​
Google OAuth Configuration

​
GOOGLE_CLIENT_ID
string
Google OAuth 2.0 client ID for social authentication.Configure in Supabase Dashboard → Authentication → Providers → Google or in config.toml for local development.
​
GOOGLE_CLIENT_SECRET
string
Google OAuth 2.0 client secret. Keep this secure and never commit to version control.

​
Stripe Configuration (Optional)

​
STRIPE_SECRET_KEY
string
Stripe secret key for payment processing. Used by the Stripe API routes.Format: sk_test_... (test) or sk_live_... (production)Get from: Stripe Dashboard → Developers → API keys
​
STRIPE_WEBHOOK_SECRET
string
Stripe webhook signing secret for verifying webhook events.Format: whsec_...Get from: Stripe Dashboard → Developers → Webhooks
Stripe configuration is optional. The billing features will be disabled if these variables are not set.

​
Email Configuration (Optional)

​
RESEND_API_KEY
string
Resend API key for transactional email delivery.Format: re_...Get from: Resend Dashboard → API Keys

​
Landing Configuration Example

Create packages/landing/.env.local:
packages/landing/.env.local
# Supabase
NEXT_PUBLIC_SUPABASE_URL=http://127.0.0.1:54321
NEXT_PUBLIC_SUPABASE_ANON_KEY=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...

# Google OAuth
GOOGLE_CLIENT_ID=123456789-abc.apps.googleusercontent.com
GOOGLE_CLIENT_SECRET=GOCSPX-...

# Stripe (optional)
STRIPE_SECRET_KEY=sk_test_...
STRIPE_WEBHOOK_SECRET=whsec_...

# Resend (optional)
RESEND_API_KEY=re_...

​
Getting Started

1

Start Supabase

Run local Supabase instance:
cd packages/app
supabase start
Copy the anon key from the output.
2

Create environment files

Create .env files in both packages using the examples above.
3

Start development servers

From the repository root:
npm run dev
This starts both the landing site and app simultaneously.

​
Security Best Practices

Never commit .env files to version control. Add them to .gitignore.
  • Public variables (NEXT_PUBLIC_*, VITE_*) are safe to expose in the browser
  • Secret variables (API keys, secrets) should only be used server-side
  • Use different keys for development, staging, and production environments
  • Rotate keys regularly and immediately if compromised
  • Store production secrets in secure environment variable services (Vercel, Railway, etc.)

​
Client Configuration

The Supabase client automatically configures authentication features:
packages/app/src/integrations/supabase/client.ts
export const supabase = createClient(
  supabaseUrl ?? fallbackUrl,
  supabaseAnonKey ?? fallbackAnonKey,
  {
    auth: {
      autoRefreshToken: true,
      persistSession: true,
      detectSessionInUrl: true,
    },
  }
);
Session persistence and automatic token refresh are enabled by default for a seamless user experience.

​
Related Resources

Database Setup

Configure the PostgreSQL database schema

Authentication

Set up Supabase Auth with providers

Billing Setup

Configure Stripe payment integration

Build docs developers (and LLMs) love

Get started for freeTalk to us