Next Auth V5 - Advanced Guide (2024)

Опубликовано: 28 Октябрь 2024
на канале: Code With Antonio
881,241
18k

Source code: https://dub.sh/N31z2Qp
Auth.js: https://authjs.dev/
Middleware config: https://dub.sh/Apr6dvD
Resend: https://resend.com/
Node.js: https://nodejs.org/en
ShadcnUI: https://ui.shadcn.com/
Clerk: https://dub.sh/SdVFxFU

Learn how to add advanced authentication to your NextJS App.

Key Features:
🔐 Next-auth v5 (Auth.js)
🚀 Next.js 14 with server actions
🔑 Credentials Provider
🌐 OAuth Provider (Social login with Google & GitHub)
🔒 Forgot password functionality
✉️ Email verification
📱 Two factor verification (2FA)
👥 User roles (Admin & User)
🔓 Login component (Opens in redirect or modal)
📝 Register component
🤔 Forgot password component
✅ Verification component
⚠️ Error component
🔘 Login button
🚪 Logout button
🚧 Role Gate
🔍 Exploring next.js middleware
📈 Extending & Exploring next-auth session
🔄 Exploring next-auth callbacks
👤 useCurrentUser hook
🛂 useRole hook
🧑 currentUser utility
👮 currentRole utility
🖥️ Example with server component
💻 Example with client component
👑 Render content for admins using RoleGate component
🛡️ Protect API Routes for admins only
🔐 Protect Server Actions for admins only
📧 Change email with new verification in Settings page
🔑 Change password with old password confirmation in Settings page
🔔 Enable/disable two-factor auth in Settings page
🔄 Change user role in Settings page (for development purposes only)

Timestamps
00:00 Intro & Demo
02:05 Project setup
15:19 Routing crash course
38:06 Home page
48:40 Card wrapper
01:04:51 Login form
01:23:08 Register form
01:40:16 Database & Prisma setup
01:57:14 Create user
02:06:30 Middleware & Login
02:50:52 Callbacks
03:20:34 OAuth (Google & Github)
03:47:58 Resend (Sending emails)
04:19:27 Email verification
04:48:12 Reset password email
05:08:11 Reset password form
05:22:48 Two factor authentication
05:55:28 User button
06:15:02 Server & Client example
06:30:06 Admin example
06:47:25 Settings page
07:33:09 Sponsor demo
07:38:14 Deployment