آموزش NextAuth نسخه ۵ با اعتبارسنجی نام کاربری و رمز عبور در Next App Router و تایپ اسکریپت - آخرین آپدیت

سرفصل ها و درس ها

مقدمه Introduction

• مهم! قبل از شروع دوره این را بخوانید! (Github repo و غیره) Important! Read this before you begin the course! (Github repo etc)

• مقدمه Introduction

• امتیازها و نظرات Udemy Udemy ratings and reviews

• ایجاد پروژه Next JS Create the Next JS project

ایجاد عملکرد ثبت نام Build the Register functionality

• ایجاد صفحه ثبت نام Create the Register page

• ایجاد فرم ثبت نام با استفاده از zod و react-hook-form Create the Register form using zod and react-hook-form

• افزودن فیلدهای فرم به فرم ثبت نام Add form fields to the Register form

• افزودن اعتبارسنجی فرم اضافی با استفاده از zod Add extra form validation using zod

• ایجاد یک اکشن سرور برای ارسال ثبت نام کاربران جدید Create a server action to post new user registrations

ذخیره داده های کاربر در یک پایگاه داده postgres Save user data to a postgres database

• ایجاد یک پایگاه داده postgres جدید میزبانی شده در neon Create a new postgres database hosted on neon

• راه اندازی drizzle در پروژه Next JS خود Set up drizzle in our Next JS project

• ایجاد جدول users با استفاده از drizzle Create the users table using drizzle

• ذخیره داده های کاربر جدید در پایگاه داده postgres Save new user data to the postgres database

• تکمیل فرم ثبت نام با اعتبارسنجی اضافی Finish off the Register form with extra validation

ایجاد عملکرد ورود به سیستم Build the login functionality

• ایجاد صفحه ورود به سیستم، فرم ورود به سیستم با react-hook-form، و اعتبارسنجی با zod Create the Login page, Login form with react-hook-form, and validation with zod

• ایجاد اکشن سرور ورود به سیستم Create the Login server action

• پیاده سازی Next Auth Implement Next Auth

• ورود به سیستم با استفاده از Next Auth Log in using Next Auth

• تغییر مسیر در ورود موفقیت آمیز و افزودن عملکرد خروج از سیستم Redirect on successful login and add logout functionality

• افزودن لینک های ورود به سیستم و ثبت نام و پیام خطای ورود به سیستم Add the Login and Register links and login error message

ایجاد داشبورد کوچک کاربر Build the mini user dashboard

• ایجاد صفحه my-account Create the my-account page

• ایجاد طرح بندی logged-in Create the logged-in layout

• محافظت از مسیرها برای کاربران وارد شده با استفاده از طرح بندی Next JS Protect routes for logged in users using Next JS layouts

• افزودن کارت حساب کاربری من Add the My Account Card

ایجاد عملکرد تغییر رمز عبور Build the change password functionality

• ایجاد صفحه change-password Create the change-password page

• ایجاد اکشن سرور changePassword Create the changePassword server action

ایجاد عملکرد فراموشی رمز عبور Build the forgot password functionality

• ایجاد صفحه password-reset Create the password-reset page

• انتقال مقدار ایمیل از صفحه ورود به سیستم به صفحه بازنشانی رمز عبور Pass email value from Login page to Password Reset page

• ایجاد اکشن سرور passwordReset Create the passwordReset server action

• ایجاد جدول password_reset_tokens Create the password_reset_tokens table

• ذخیره توکن بازنشانی رمز عبور در پایگاه داده Save the password reset token to the database

• افزودن یک پیام موفقیت به UI هنگام ایجاد توکن Add a success message to the UI when a token is created

• ایجاد صفحه update-password و اعتبارسنجی توکن بازنشانی رمز عبور Create the update-password page and validate password reset token

• ایجاد فرم و اکشن سرور بروزرسانی رمز عبور Create the update password form and server action

• تکمیل اکشن سرور بروزرسانی رمز عبور Finish the update password server action

• راه اندازی ارسال ایمیل با Resend Set up email sending with Resend

ایجاد عملکرد احراز هویت دو مرحله ای Build the two-factor authentication functionality

• ایجاد UI اولیه برای مرحله 1 در جریان احراز هویت دو مرحله ای Create the initial UI for Step 1 in the Two-Factor Auth flow

• ایجاد اکشن سرور برای تولید و برگرداندن راز 2FA Create the server action to generate and return the 2FA secret

• رندر کردن کد QR برای اسکن در برنامه Google Authenticator Render the QR code to scan in the Google Authenticator app

• ایجاد UI تایید OTP Create the OTP confirmation UI

• ایجاد اکشن های سرور فعال و غیرفعال کردن 2FA Create the activate and deactivate 2FA server actions

• بازسازی صفحه ورود به سیستم برای پشتیبانی از 2FA Refactor Login page to cater for 2FA

• جایزه! BONUS!