BetterStarter logoBetterStarter
GuidesAuth

Google Auth

Add Google OAuth sign-in to your app.

Docs are in beta — content is improving rapidly. Found something missing? Open an issue on GitHub or reach out on Twitter.

1. Create Google OAuth Credentials

  1. Go to the Google Cloud Console
  2. Create or select a project
  3. Navigate to APIs & Services → OAuth consent screen → choose External → fill in app name and emails
  4. Go to APIs & Services → Credentials → + CREATE CREDENTIALS → OAuth client ID
  5. Choose Web application
  6. Add Authorized JavaScript origins:
    • http://localhost:3000 (dev)
    • https://yourdomain.com (production)
  7. Add Authorized redirect URIs:
    • http://localhost:3000/api/auth/callback/google (dev)
    • https://yourdomain.com/api/auth/callback/google (production)
  8. Copy the Client ID and Client Secret

2. Set Environment Variables

# .env.local
VITE_GOOGLE_CLIENT_ID=your-client-id.apps.googleusercontent.com
GOOGLE_CLIENT_SECRET=your-client-secret

3. Test

  1. Run pnpm dev
  2. Navigate to /auth/sign-in
  3. A Sign in with Google button will appear
  4. Complete the OAuth flow

Production Checklist

  • Add production domain to authorized origins and redirect URIs in Google Cloud Console
  • Publish your OAuth consent screen to remove the 100-user limit

Troubleshooting

  • Redirect URI mismatch — the URI in Google Cloud must exactly match /api/auth/callback/google (no trailing slash)
  • "This app isn't verified" — normal in dev. Click Advanced → Go to app to proceed, or publish consent screen for production
  • No Google button — check that both VITE_GOOGLE_CLIENT_ID and GOOGLE_CLIENT_SECRET are set

On this page