Environment Variables

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.

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

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

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

string

required

Supabase anonymous key for the Next.js landing site. Should match the app package anon key.

Google OAuth Configuration

string

Google OAuth 2.0 client ID for social authentication.Configure in Supabase Dashboard → Authentication → Providers → Google or in config.toml for local development.

string

Google OAuth 2.0 client secret. Keep this secure and never commit to version control.

Stripe Configuration (Optional)

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

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)

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

Start Supabase

Run local Supabase instance:

cd packages/app
supabase start

Copy the anon key from the output.

Create environment files

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

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.

Database Setup

Configure the PostgreSQL database schema

Authentication

Set up Supabase Auth with providers

Billing Setup

Configure Stripe payment integration

Get Started

Core Features

Configuration

Architecture

Environment Variables

App Package Variables

App Configuration Example

Landing Package Variables

Supabase Configuration

Google OAuth Configuration

Stripe Configuration (Optional)

Email Configuration (Optional)

Landing Configuration Example

Getting Started

Security Best Practices

Client Configuration

Database Setup

Authentication

Billing Setup

​App Package Variables

​App Configuration Example

​Landing Package Variables

​Supabase Configuration

​Google OAuth Configuration

​Stripe Configuration (Optional)

​Email Configuration (Optional)

​Landing Configuration Example

​Getting Started

​Security Best Practices

​Client Configuration

​Related Resources

Database Setup

Authentication

Billing Setup

App Package Variables

App Configuration Example

Landing Package Variables

Supabase Configuration

Google OAuth Configuration

Stripe Configuration (Optional)

Email Configuration (Optional)

Landing Configuration Example

Getting Started

Security Best Practices

Client Configuration

Related Resources