*Limited Launch Offer!Use code for 50% off (expires 12/31/2025)

Environment Vars & Configs

Environment Variables

API configuration is managed through your environment variables. You'll find a .env.template file in the root of your project which you can copy to .env.local for local development or set directly in your hosting provider for production.

In Next.js, variables prefixed with NEXT_PUBLIC_ are exposed to the browser, while others remain server-side only. Ensure your secret and private keys DO NOT use the NEXT_PUBLIC_ prefix.

Configuration Settings

Configure the essential settings for your business in the /config/ folder. The main files you'll work with are:

  • business.ts: Define your business details, email settings, analytics, and branding.
  • payment.ts: Control your payment logic.
  • scheduling.ts: Customize your scheduling and consultation flows and booking logic.
  • services.ts: Set up your service offerings to dynamically populate your public site's landing pages.
  • form-templates.ts: Customize your lead capture and contact forms.

All of these files are written in TypeScript and include comments to guide you through each setting.

Edit the config files directly in your codebase or use the interactive configuration wizards to generate them for you.

Be sure to only edit the exported config objects from each file. Avoid changing import/export statements and helper functions to prevent breaking the configuration.

.env Setup


# -----------------------------------------------------------------------------
# SITE CONFIGURATION
# ----------------------------------------------------------------------------- 
# Your website URL (used for SEO, sitemaps, and redirects.)
# Set to http://localhost:3000 for local development

NEXT_PUBLIC_SITE_URL="http://localhost:3000"

# -----------------------------------------------------------------------------
# STRIPE PAYMENT PROCESSING
# ADD YOUR STRIPE KEYS BELOW 
# SETUP A WEBHOOK ENDPOINT (yourdomain.com/api/webhooks/stripe) WITH EVENT LISTENERS FOR:
# payment_intent.succeeded
# payment_intent.payment_failed
# payment_intent.canceled
# payment_intent.requires_action
# checkout.session.completed
# checkout.session.expired
# -----------------------------------------------------------------------------

NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY="pk_test_..."
STRIPE_SECRET_KEY="sk_test_..."
STRIPE_WEBHOOK_SECRET="whsec_..."

# -----------------------------------------------------------------------------
# EMAIL CONFIGURATION (Resend)
# from_email (set in your /config/business.ts) should be a verified domain sender in your Resend account
# -----------------------------------------------------------------------------

RESEND_API_KEY="re_..."


# -----------------------------------------------------------------------------
# DATABASE (Supabase)
# Using new API & JWT Signing Keys
# You'll need to run DB migrations in supabase/migrations/001_db_setup.sql
# Then, in your dashboard enable Customize Access Token (JWT) Claims hook to access and manage admin users
# -----------------------------------------------------------------------------

NEXT_PUBLIC_SUPABASE_URL="https://your-project.supabase.co"
NEXT_PUBLIC_SUPABASE_PUBLISHABLE_OR_ANON_KEY="your-anon-key"
SUPABASE_SECRET_OR_SERVICE_ROLE_KEY="your-service-role-key"

# -----------------------------------------------------------------------------
# SECURITY TOKENS (Generated automatically via .env wizard OR set manually)
# -----------------------------------------------------------------------------

ESTIMATE_SECRET=""
CONSULTATION_SECRET=""

# =============================================================================

Copy .env.template to .env.local or use the config wizard

-Line 54 /config/business.ts businessConfig Object

export const businessConfig: BusinessConfig = {
  company: {
    name: "Your Company",
    tagline: "Professional Service You Can Trust",
    phone: "(555) 555-5555",
    email: "yourcompany@yoursite.com",
    address: "123 Main St, San Diego, CA 92024"
  },
  branding: {
    theme: 'green',
    showPortfolio: false,
    showTestimonials: false
  },
  admin: {
    email: "admin@email.com",
    from_email: "from@verifiedsenderdomain.com",
    reply_to_email: "replyto@yourdomain.com"
  },
  analytics: {
    gtmId: "GTM-5555555",
    leadSubmissionsValue: "10",
    conversionDefaultValue: "100",
    googleBusinessReviews: "https://g.page/r/"
  }
} as const

Edit the /config/business.ts file or use the config wizard

-Line 30 /config/payment.ts paymentConfig Object

export const paymentConfig: PaymentConfig = {
  depositPercentage: 20,
  paymentFlow: 'deposit_final',
  subscriptionsEnabled: true,

} as const

Edit the /config/payment.ts file or use the config wizard

-Line 58 /config/scheduling.ts schedulingConfig Object

export const schedulingConfig: SchedulingConfig = {
  skipScheduling: false,
  hourlySchedulingEnabled: true,
  blockedDaysOfWeek: [0,6],
  jobDuration: 3,
  jobBuffer: 1,
  businessHours: {
    start: 8,
    end: 17
  },
  enableConsultationScheduling: false,
  consultationDuration: 1,
  consultationBuffer: 0
} as const

Edit the /config/scheduling.ts file or use the config wizard

-Line 34 /config/services.ts services array

export const services: ServiceConfig[] = [
  {
    slug: 'home-services',
    title: 'Home Services',
    shortTitle: 'Home',
    description: 'Professional home maintenance, cleaning, and repair services to keep your property in perfect condition.',
    longDescription: 'Our comprehensive home services cover everything from regular maintenance and deep cleaning to repairs and improvements. Whether you need routine upkeep or emergency fixes, our trusted professionals are here to help.',
    services: [
      'House Cleaning & Maintenance',
      'Plumbing & Electrical Repairs', 
      'Landscaping & Yard Work',
      'Home Organization',
      'Handyman Services',
      'HVAC Maintenance'
    ],
    benefits: [
      'Licensed and insured professionals',
      'Flexible scheduling to fit your needs',
      'Quality guarantee on all work',
      'Competitive pricing with no hidden fees',
      'Emergency services available'
    ],
    formTemplateKey: 'home_services',
    enabled: true
  },
  ...]

Edit the /config/form-templates.ts file or use the config wizard

-Line 48 /config/form-templates.ts formTemplates Object

export const formTemplates: Record<string, FormTemplate> = {
  // Simple Universal Form - Works for any service/industry
  simple_contact: {
    id: 'simple_contact',
    title: 'Get Your Free Quote',
    description: 'Tell us about your project and we'll get back to you with a personalized quote.',
    category: 'Universal',
    leadType: 'general_inquiry',
    submitText: 'Get Free Quote',
    successMessage: 'Thank you! We'll contact you within 24 hours.',
    fields: [
      {
        name: 'firstName',
        type: 'text',
        label: 'First Name',
        placeholder: 'John',
        required: true
      },
      {
        name: 'lastName',
        type: 'text',
        label: 'Last Name',
        placeholder: 'Smith',
        required: true
      },
      {
        name: 'email',
        type: 'email',
        label: 'Email',
        placeholder: 'john@example.com',
        required: true
      },
      {
        name: 'phone',
        type: 'phone',
        label: 'Phone',
        placeholder: '(555) 123-4567',
        required: false
      },
      {
        name: 'message',
        type: 'textarea',
        label: 'Tell us about your project',
        placeholder: 'Describe what you need help with...',
        rows: 4,
        required: true,
        validation: {
          min: 10,
          message: 'Please provide some details about your needs'
        }
      }
    ],
    benefits: [
      {
        icon: 'Clock',
        title: 'Quick Response',
        description: 'We typically respond within 24 hours'
      },
      {
        icon: 'Star',
        title: 'Quality Service',
        description: 'Professional service you can trust'
      },
      {
        icon: 'Shield',
        title: 'No Obligation',
        description: 'Free quotes with no pressure'
      }
    ]
  },

Edit the /config/form-templates.ts file or use the config wizard