Updating Local Configuration

At this point, you should have set up Sentry, Stripe (in test mode) and Google Sign-In. Let's update your apps/web/.env.local file with all the necessary credentials.

1. Open the apps/web/.env.local File Navigate to /apps/web and open the apps/web/.env.local file.

2. Update Supabase Configuration For local development, use the following Supabase configuration:

   NEXT_PUBLIC_SUPABASE_URL=http://localhost:54321
   NEXT_PUBLIC_SUPABASE_ANON_KEY=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZS1kZW1vIiwicm9sZSI6ImFub24iLCJleHAiOjE5ODM4MTI5OTZ9.CRXP1A7WOeoJeXxjNni43kdQwgnWNReilDMblYTn_I0
   SUPABASE_SERVICE_ROLE_KEY=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZS1kZW1vIiwicm9sZSI6InNlcnZpY2Vfcm9sZSIsImV4cCI6MTk4MzgxMjk5Nn0.EGIM96RAZx35lJzdJsyH-qQwv8Hdp7fsn3W0YpN81IU
   NEXT_PUBLIC_SITE_URL=http://localhost:3000

3. Add Google Sign-In Credentials

   GOOGLE_CLIENT_ID=your_google_client_id
   GOOGLE_CLIENT_SECRET=your_google_client_secret

4. Configure Stripe Add your Stripe test mode credentials:

   NEXT_PUBLIC_STRIPE_PUBLIC_KEY=pk_test_your_public_key
   STRIPE_SECRET_KEY=sk_test_your_secret_key
   STRIPE_WEBHOOK_SECRET=whsec_your_webhook_secret
   NEXT_PUBLIC_STRIPE_PRICE_ID_SINGLE_PAYMENT=price_single_payment
   NEXT_PUBLIC_STRIPE_PRICE_ID_SINGLE_PAYMENT_SECONDARY=price_single_payment_secondary
   NEXT_PUBLIC_STRIPE_PRICE_ID_MONTHLY_SUBSCRIPTION=price_monthly_subscription

5. Add Sentry Configuration

   SENTRY_AUTH_TOKEN=your_sentry_auth_token
   NEXT_PUBLIC_SENTRY_DSN=your_sentry_dsn
   NEXT_PUBLIC_SENTRY_ORG=your_organization_name_here
   NEXT_PUBLIC_SENTRY_PROJECT=your_project_name_here

6. Vercel KV for Rate Limiting These will be set up later, but add placeholders for now:

   KV_URL=still-need-to-setup
   KV_REST_API_URL=still-need-to-setup
   KV_REST_API_TOKEN=still-need-to-setup
   KV_REST_API_READ_ONLY_TOKEN=still-need-to-setup

7. Update config/index.ts Now that you have all your environment variables set up, you can update the config/index.ts file with your application's specific details from the README.md that you created in the previous step. This includes your application name, description, company information, and other configuration options.

8. Start Development Servers From the root directory, run:

   pnpm dev

   This will start:

   • The Next.js frontend application (usually on http://localhost:3000)
   • The Hono API application (usually on http://localhost:8080)

Remember to never commit your apps/web/.env.local file to version control. Always use environment variables to store sensitive information.