Skip to main content

Environment Variables Setup Guide

This guide will walk you through setting up all the necessary environment variables for your application. We provide a .env.example file that you can use as a template to create your own .env file.

๐Ÿš€ Getting Startedโ€‹

  1. Navigate to the apps/web directory
  2. Rename the .env.example file to .env
  3. Populate the .env file with the required values

๐Ÿ“ Environment Variables Referenceโ€‹

Base Configurationโ€‹

BASEPATH=
NEXT_PUBLIC_APP_URL=http://localhost:3000${BASEPATH}
NEXT_PUBLIC_APP_DOMAIN=127.0.0.1
  • BASEPATH - The base path for your application (leave empty if serving from root)
  • NEXT_PUBLIC_APP_URL - Your application's full URL. (e.g., http://localhost:3000${BASEPATH} for local development)
  • NEXT_PUBLIC_APP_DOMAIN - Your application's domain name without protocol (must be 127.0.0.1 for local development)

โš ๏ธ Important: For local development:

  • Use 127.0.0.1 for NEXT_PUBLIC_APP_DOMAIN
  • The BASEPATH will be appended to your APP_URL automatically
  • This configuration is required for proper functionality of authentication and API integrations

App Configurationโ€‹

NEXT_PUBLIC_APP_NAME=ChatFlow AI
NEXT_PUBLIC_APP_TITLE=%s | ChatFlow AI - Next.js Boilerplate PRO - Tailwind CSS + Shadcn
NEXT_PUBLIC_APP_DESCRIPTION=Automate customer support with ChatFlow AI. Resolve queries 24/7, and deliver seamless service using an all-in-one AI chatbot solution.
  • NEXT_PUBLIC_APP_NAME - Your application's name (e.g., "ChatFlow AI")
  • NEXT_PUBLIC_APP_TITLE - Page title template (%s will be replaced with page-specific titles)
  • NEXT_PUBLIC_APP_DESCRIPTION - Your application's meta description for SEO

Supabase Configurationโ€‹

NEXT_PUBLIC_SUPABASE_URL=http://127.0.0.1:54321
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key
NEXT_PUBLIC_SUPABASE_SERVICE_ROLE_KEY=your-service-role-key

To get these values:

  1. Start your local Supabase instance using pnpm web:supabase:start
  2. The values will be displayed in the terminal output
  3. For local development:
    • Supabase URL will be http://127.0.0.1:54321
    • The keys will be provided in the terminal output
  4. For production, get these from your Supabase project dashboard

Authentication Settingsโ€‹

NEXT_PUBLIC_AUTH_PASSWORD=true
NEXT_PUBLIC_AUTH_MAGIC_LINK=true
  • NEXT_PUBLIC_AUTH_PASSWORD - Enable/disable password authentication
  • NEXT_PUBLIC_AUTH_MAGIC_LINK - Enable/disable magic link authentication (email-based passwordless login)

Google OAuth Configurationโ€‹

GOOGLE_CLIENT_ID=
GOOGLE_CLIENT_SECRET=
  • GOOGLE_CLIENT_ID - This variable is used to configure the Google OAuth 2.0 client ID. It is used by NextAuth.js to authenticate users using Google.
  • GOOGLE_CLIENT_SECRET - This variable is used to configure the Google OAuth 2.0 client secret. It is used by NextAuth.js to authenticate users using Google.

Stripe Integrationโ€‹

NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=pk_test_your_publishable_key
STRIPE_SECRET_KEY=sk_test_your_secret_key
STRIPE_WEBHOOK_SECRET=whsec_your_webhook_secret

To set up Stripe:

  1. Create a Stripe account
  2. Get your API keys from the Stripe Dashboard
  3. For webhooks:
    • Create a webhook endpoint in your Stripe dashboard
    • Use the provided webhook secret
    • For local testing, use Stripe CLI to forward webhooks

Lemon Squeezy Integrationโ€‹

LEMON_SQUEEZY_API_KEY=your_api_key
LEMON_SQUEEZY_STORE_ID=your_store_id
LEMON_SQUEEZY_WEBHOOK_SIGNATURE=your_webhook_signature

To configure Lemon Squeezy:

  1. Sign up for a Lemon Squeezy account
  2. Create a store and get your API key from the dashboard
  3. Note your store ID from the store settings
  4. Configure webhooks and set up your webhook signature

Session Configurationโ€‹

SESSION_SECRET=your-secure-session-secret

Generate a strong random string for your session secret. You can use this command:

openssl rand -base64 32

Internationalizationโ€‹

NEXT_PUBLIC_I18N_COOKIE_NAME=lang
  • NEXT_PUBLIC_I18N_COOKIE_NAME - Cookie name for storing language preference (default: lang)

๐Ÿ”’ Security Best Practicesโ€‹

  1. Never commit your .env file to version control
  2. Use different values for development and production
  3. Regularly rotate sensitive credentials
  4. Use strong, unique values for secrets
  5. Limit access to production environment variables

โœ… Verificationโ€‹

After setting up your environment variables:

  1. Run pnpm dev to start the development server
  2. Check the application logs for any environment-related errors
  3. Test features that depend on specific environment variables
  4. Verify third-party integrations are working correctly

๐Ÿšจ Troubleshootingโ€‹

If you encounter issues:

  1. Ensure all required variables are set
  2. Check for typos in variable names
  3. Verify the values are correctly formatted
  4. Restart the development server after changes
  5. Check the console for error messages

Need help? Join our Discord community for support!