Magic Link

This guide explains the setup for Magic Link (passwordless email) authentication in StarterKitPro using Auth.js v5.

Prerequisites

• Email Sending Setup: Magic Link relies on sending emails. Ensure you have configured an email provider (like Resend or SendGrid) and it's working correctly.
• Database Setup: Auth.js requires a database adapter (like Prisma) to store user and verification token information. Ensure your database is set up. See Database Setup.

1. Environment Variables

Ensure these core Auth.js variables are set in your .env.local file:

# Auth.js Core Variables
AUTH_URL=http://localhost:3000 # Or your production URL like https://your-site.com
AUTH_SECRET= # Generate a strong secret: openssl rand -base64 32

• AUTH_SECRET: A random string (at least 32 characters recommended) used for encryption. Generate one using openssl rand -base64 32. Do not commit this file.
• AUTH_URL: Your application's canonical URL.
• Include the necessary API keys and settings for your chosen email provider.

3. Rate Limiting (Recommended)

To prevent abuse (users requesting too many magic links), it's highly recommended to implement rate limiting on the verification email sending process.

• Refer to the Rate Limiting documentation for guidance on how to set this up, potentially using a service like Upstash.

4. Testing

1. Start Server: Run npm run dev.
2. Navigate to Sign In: Go to your application's sign-in page.
3. Enter Email: Type your email address into the designated field and submit.
4. Check Email: You should receive an email with a sign-in link.
5. Click Link: Click the link in the email. You should be redirected back to your application and logged in.

Magic Link authentication is now ready to use!