Full-Stack Setup

This guide gets both the backend and frontend running together on your local machine.

1. Clone Both Repositories

# Backend
git clone <your-backend-repo-url> my-app-backend

# Frontend (in a separate directory)
git clone <your-frontend-repo-url> my-app-frontend

2. Set Up the Backend

Follow the Backend Quick Start guide to configure environment variables, start Docker services, install dependencies, run migrations, and sync Stripe plans.

Once complete, verify the backend is running:

curl http://localhost/api/v1/plans

3. Set Up the Frontend

Follow the Frontend Getting Started guide to configure environment variables and start the development server.

The frontend will be available at http://localhost:3000.

4. Test the Full Flow

1. Register — Click "Sign Up" and create an account
2. Check email — Open Mailpit at http://localhost:8025 to see the welcome email
3. Login — Sign in with your credentials
4. Purchase — Select a plan and complete Stripe test checkout (use card 4242 4242 4242 4242)
5. Profile — Check your profile page to see the active subscription

Common Issues

Frontend can't reach the backend

Make sure NUXT_PUBLIC_API_BASE_URL points to the backend URL. In Docker, this is typically http://localhost (port 80) or http://host.docker.internal depending on your setup.

CORS errors

Update the backend's CORS_ALLOW_ORIGIN in .env.local to include your frontend URL:

CORS_ALLOW_ORIGIN=^https?://(localhost|127\.0\.0\.1)(:[0-9]+)?$

Stripe webhooks in local development

Use the Stripe CLI to forward webhooks:

stripe listen --forward-to localhost/api/v1/webhooks/stripe

Copy the webhook signing secret to your backend .env.local.