Skip to main content

Overview

Lawn requires several environment variables to integrate with external services. These variables are used for authentication, video processing, payments, and backend functionality.
Never commit environment variables to version control. Keep your .env file in .gitignore and use secure methods to share credentials with your team.

Required Services

To run Lawn, you’ll need accounts with: Each service offers a free tier suitable for development.

Environment Variables

Convex

Convex provides the backend infrastructure and database for Lawn.
VITE_CONVEX_URL=https://your-project.convex.cloud
VITE_CONVEX_SITE_URL=https://your-project.convex.site
1

Create a Convex project

Sign up at convex.dev and create a new project.
2

Get your deployment URL

Run bunx convex dev in your project directory. The CLI will provide your VITE_CONVEX_URL.
3

Get your site URL

The site URL is used for webhooks and follows the pattern: https://[deployment-name].convex.site
For production deployments, you’ll also need CONVEX_DEPLOY_KEY. See the Deployment guide for details.

Clerk

Clerk handles user authentication and management.
VITE_CLERK_PUBLISHABLE_KEY=pk_test_...
CLERK_SECRET_KEY=sk_test_...
1

Create a Clerk application

Sign up at clerk.com and create a new application.
2

Get your API keys

Navigate to API Keys in your Clerk dashboard to find both keys.
3

Configure JWT issuer (optional)

If using custom JWT configuration, set:
CLERK_JWT_ISSUER_DOMAIN=your-domain.clerk.accounts.dev
The VITE_ prefix makes the Clerk publishable key available to the frontend. Never prefix secret keys with VITE_.

Mux

Mux handles video upload, processing, transcoding, and streaming.
# API Access
MUX_TOKEN_ID=...
MUX_TOKEN_SECRET=...

# Webhook Verification
MUX_WEBHOOK_SECRET=...

# Signed URL Authentication
MUX_SIGNING_KEY=...
MUX_PRIVATE_KEY=...
1

Create a Mux account

Sign up at mux.com and create a new environment.
2

Generate API access tokens

Go to Settings > Access Tokens and create a new token with Video permissions. This gives you MUX_TOKEN_ID and MUX_TOKEN_SECRET.
3

Create signing keys

Go to Settings > Signing Keys and create a new key. This gives you MUX_SIGNING_KEY (key ID) and MUX_PRIVATE_KEY (private key).
4

Configure webhooks

Go to Settings > Webhooks and add your Convex site URL:
https://your-project.convex.site/mux/webhook
Copy the signing secret to MUX_WEBHOOK_SECRET.
Legacy variable names: Lawn also supports MUX_SIGNING_KEY_ID and MUX_SIGNING_PRIVATE_KEY for backward compatibility.

Private Key Format

The MUX_PRIVATE_KEY should be the full private key from Mux. If you’re setting it in Vercel or another platform that doesn’t support multiline values, you can use \n for line breaks:
MUX_PRIVATE_KEY="-----BEGIN RSA PRIVATE KEY-----\nMIIE...\n-----END RSA PRIVATE KEY-----"
Lawn automatically converts \n to actual newlines.

Stripe

Stripe manages subscriptions and payments for Lawn’s pricing plans.
# API Access
STRIPE_SECRET_KEY=sk_test_...

# Webhook Verification
STRIPE_WEBHOOK_SECRET=whsec_...

# Pricing Plan IDs
STRIPE_PRICE_BASIC_MONTHLY=price_...
STRIPE_PRICE_PRO_MONTHLY=price_...
1

Create a Stripe account

Sign up at stripe.com and complete account setup.
2

Get your secret key

Go to Developers > API Keys and copy your secret key.
3

Create pricing plans

Go to Products and create two products with monthly subscriptions:
  • Basic plan
  • Pro plan
Copy each price ID to the corresponding environment variable.
4

Configure webhooks

Go to Developers > Webhooks and add your Convex Stripe webhook endpoint:
https://your-project.convex.site/stripe/webhook
Listen for these events:
  • customer.subscription.created
  • customer.subscription.updated
  • customer.subscription.deleted
  • invoice.payment_succeeded
  • invoice.payment_failed
Copy the signing secret to STRIPE_WEBHOOK_SECRET.
Use Stripe test mode keys (prefixed with sk_test_) for development. Switch to live keys only when deploying to production.

Example .env File

Here’s a complete example of a .env file for local development:
# Convex
VITE_CONVEX_URL=https://your-project.convex.cloud
VITE_CONVEX_SITE_URL=https://your-project.convex.site

# Clerk
VITE_CLERK_PUBLISHABLE_KEY=pk_test_...
CLERK_SECRET_KEY=sk_test_...

# Mux
MUX_TOKEN_ID=...
MUX_TOKEN_SECRET=...
MUX_WEBHOOK_SECRET=...
MUX_SIGNING_KEY=...
MUX_PRIVATE_KEY="-----BEGIN RSA PRIVATE KEY-----\n...\n-----END RSA PRIVATE KEY-----"

# Stripe
STRIPE_SECRET_KEY=sk_test_...
STRIPE_WEBHOOK_SECRET=whsec_...
STRIPE_PRICE_BASIC_MONTHLY=price_...
STRIPE_PRICE_PRO_MONTHLY=price_...

Convex Environment Variables

Some environment variables need to be configured in Convex directly:
1

Open Convex dashboard

Navigate to your project at dashboard.convex.dev
2

Add environment variables

Go to Settings > Environment Variables and add:
  • CLERK_SECRET_KEY
  • CLERK_JWT_ISSUER_DOMAIN (if using custom JWT)
  • MUX_TOKEN_ID
  • MUX_TOKEN_SECRET
  • MUX_WEBHOOK_SECRET
  • MUX_SIGNING_KEY
  • MUX_PRIVATE_KEY
  • STRIPE_SECRET_KEY
  • STRIPE_WEBHOOK_SECRET
  • STRIPE_PRICE_BASIC_MONTHLY
  • STRIPE_PRICE_PRO_MONTHLY
3

Deploy changes

Run bunx convex deploy to apply the new environment variables.
Variables prefixed with VITE_ are bundled into your frontend code and accessible in the browser. Only use this prefix for non-sensitive, public values.

Production Considerations

When deploying to production:
  1. Use production keys - Replace all test/development keys with production keys
  2. Secure storage - Use your platform’s secrets management (e.g., Vercel Environment Variables)
  3. Webhook URLs - Update all webhook URLs to point to your production Convex deployment
  4. CORS settings - Ensure Clerk and other services allow your production domain
Never expose secret keys in client-side code or logs. Only variables prefixed with VITE_ should be considered public.

Troubleshooting

Missing Environment Variable Errors

If you see errors like “Missing required environment variable”:
  1. Ensure the variable is set in your .env file
  2. Restart your dev server (bun run dev)
  3. For Convex variables, ensure they’re set in the Convex dashboard

Webhook Verification Failures

If webhooks from Mux or Stripe are failing:
  1. Verify the webhook secret matches what’s in your service’s dashboard
  2. Ensure your Convex deployment URL is correct
  3. Check that the webhook endpoint is accessible (not behind a firewall)

Clerk Authentication Issues

If authentication isn’t working:
  1. Verify both VITE_CLERK_PUBLISHABLE_KEY and CLERK_SECRET_KEY are set
  2. Ensure your domain is allowed in Clerk’s CORS settings
  3. Check that CLERK_JWT_ISSUER_DOMAIN matches your Clerk instance

Next Steps

Installation

Set up Lawn for local development

Deployment

Deploy Lawn to production with Vercel

Build docs developers (and LLMs) love