Authentication
Unlock interactive features for your users with NextAuth.
Last updated
Unlock interactive features for your users with NextAuth.
Last updated
The SignIn modal will be called everytime it's needed (Connect button or interaction with auth-only features)
It will update with your data automatically but you can customize it the way you want in the /components/layout/sign-in-modal.tsx file.
Fill your .env file:
Enter any string or generate a unique one with this Generator.
Google Auth is already pre-implemented, simply follow this guide:
Create a new project on Google Cloud
Access APIS & Services > Credentials > Configure Consent Screen
Fill in all the info.
Add userinfo.email and userinfo.profile to scope and Submit
On Credentials, click Create Credentials > OAuth Client ID
On Web Application add:
Authorized JavaScript Origins > http://localhost:3000 & https://[YOURDOMAIN].com
Authorized redirect URLs > http://localhost:3000/api/auth/callback/google & https://[YOURDOMAIN].com/api/auth/callback/google
Submit
OAuth Consent Screen > Publish App
Finally, copy your Client ID and Client Secret to the .env file:
If you need more social authentication options, NextAuth offers a wide choice, which you can find here.
(GitHub, Facebook, Apple, Discord...)
Traditional email/password authentication is becoming obsolete for obvious security reasons. Magic Links allows you not to store your users' passwords in your database, thus relieving you of responsibility.
To enable this option, you need an email SMTP server, provided here by Loops.
👉 Check the Emails section to get started.
