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โ
- Navigate to the
apps/web
directory - Rename the
.env.example
file to.env
- 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 be127.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:
- Start your local Supabase instance using
pnpm web:supabase:start
- The values will be displayed in the terminal output
- For local development:
- Supabase URL will be
http://127.0.0.1:54321
- The keys will be provided in the terminal output
- Supabase URL will be
- 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 authenticationNEXT_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:
- Create a Stripe account
- Get your API keys from the Stripe Dashboard
- 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:
- Sign up for a Lemon Squeezy account
- Create a store and get your API key from the dashboard
- Note your store ID from the store settings
- 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โ
- Never commit your
.env
file to version control - Use different values for development and production
- Regularly rotate sensitive credentials
- Use strong, unique values for secrets
- Limit access to production environment variables
โ Verificationโ
After setting up your environment variables:
- Run
pnpm dev
to start the development server - Check the application logs for any environment-related errors
- Test features that depend on specific environment variables
- Verify third-party integrations are working correctly
๐จ Troubleshootingโ
If you encounter issues:
- Ensure all required variables are set
- Check for typos in variable names
- Verify the values are correctly formatted
- Restart the development server after changes
- Check the console for error messages
Need help? Join our Discord community for support!