1. การตั้งค่าและใช้ nextauth.js ใน Next.js 13 App Directory Directory
ในบทช่วยสอนนี้ฉันจะนำคุณผ่านการตั้งค่าการรับรองความถูกต้องในไดเรกทอรีแอพพลิเคชั่นถัดไปของคุณโดยใช้ nextauth.js เป็นที่น่าสังเกตว่าในขณะที่เราใช้แพ็คเกจ Nextauth ในบทช่วยสอนนี้คุณอาจใช้แพ็คเกจ Auth.js ตามเวลาที่คุณอ่านสิ่งนี้เนื่องจากห้องสมุดสามารถใช้แทนกันได้
หัวข้อที่ครอบคลุม
- ตั้งค่าโครงการ Next.js 13
- ตั้งค่าเส้นทาง API API ถัดไป
- สามวิธีในการรับข้อมูลเซสชัน nextauth
- รับเซสชันในส่วนประกอบเซิร์ฟเวอร์
- รับเซสชันในเส้นทาง API
- รับเซสชันในส่วนประกอบไคลเอนต์
- รวมฐานข้อมูล
- การตั้งค่า postgreSql
- การตั้งค่า prisma orm
- ใช้รหัสการรับรองความถูกต้องของ Nextauth
- เก็บคีย์ที่กำหนดเองใน JWT
- วิธีที่แตกต่างกันในการปกป้องเส้นทาง
- การป้องกันเส้นทางฝั่งลูกค้า
- การป้องกันเส้นทางฝั่งเซิร์ฟเวอร์
- ปกป้องเส้นทาง API
- การป้องกันเส้นทางมิดเดิลแวร์
- ใช้ตรรกะการลงทะเบียนบัญชี
- สร้างเส้นทาง API เพื่อลงทะเบียนผู้ใช้
- สร้างองค์ประกอบฟอร์ม
- สร้างหน้าการลงทะเบียนบัญชี
อ่านบทความทั้งหมดที่นี่: https://codevoweb.com/setup-and-use-nextauth-in-nextjs-13-app-directory/
2. next.js - ใช้หน้าเข้าสู่ระบบและการสมัครใช้งานที่กำหนดเองสำหรับ nextauth.js
ในบทความนี้คุณจะได้เรียนรู้วิธีการรวมหน้าเข้าสู่ระบบและการสมัครใช้งานที่กำหนดเองกับ nextauth.js ในไดเรกทอรีแอป Next.js 13 ใหม่ กำลังจะสมมติว่าคุณได้ตั้งค่า Nextauth ในโครงการของคุณแล้วและคุณกำลังมองหาวิธีที่จะรวมหน้าเข้าสู่ระบบและการสมัครใช้งานที่กำหนดเองเท่านั้น
หัวข้อที่ครอบคลุม
- เรียกใช้โครงการ Nextauth บนคอมพิวเตอร์ของคุณ
- ทดสอบโครงการ Nextauth
- ลงทะเบียนบัญชี
- เข้าสู่บัญชีของคุณ
- เข้าถึงหน้าป้องกัน
- กำหนดค่าจุดสิ้นสุดของ Nextauth API
- สร้างหน้าเข้าสู่ระบบที่กำหนดเอง
- สร้างแบบฟอร์มการเข้าสู่ระบบ
- สร้างหน้าเข้าสู่ระบบ
- สร้างหน้าการสมัครใช้งานที่กำหนดเอง
- สร้างแบบฟอร์มการลงทะเบียน
- สร้างหน้าการลงทะเบียนบัญชี
- สร้างตัวจัดการ API สำหรับการลงทะเบียนบัญชี
- บทสรุป
อ่านบทความทั้งหมดที่นี่: https://codevoweb.com/nextjs-use-custom-login-and-signup-pages-for-nextauth-js/
3. next.js - เพิ่ม Google และ GitHub OAuth2 โดยใช้ nextauth.js
ในบทความนี้คุณจะได้เรียนรู้วิธีการรวมผู้ให้บริการของ Google และ GitHub OAuth เข้ากับ nextauth.js ในไดเรกทอรีแอป Next.js 13 ใหม่ เป็นที่น่าสังเกตว่าฉันใช้คำขอดึงที่เฉพาะเจาะจงที่แนะนำโดยทีมงาน Nextauth ที่เข้ากันได้กับไดเรกทอรีแอป Next.js 13 Next.js 13
หัวข้อที่ครอบคลุม
- เรียกใช้โครงการ Nextauth ในพื้นที่
- สำรวจ GitHub และ Google Oauth Flow
- ลงชื่อเข้าใช้กับ Google OAuth2
- ลงชื่อเข้าใช้กับ GitHub Oauth
- กำหนดค่า nextauth ด้วย Google และ GitHub Oauth
- ใช้ Google และ GitHub OAuth2
- สร้างแบบฟอร์มฝั่งไคลเอ็นต์
- สร้างส่วนประกอบหน้าเซิร์ฟเวอร์
- วิธีสร้างข้อมูลรับรอง Google OAuth2
- วิธีสร้างข้อมูลรับรอง GitHub OAuth
- บทสรุป
อ่านบทความทั้งหมดที่นี่: https://codevoweb.com/nextjs-add-google-and-github-oauth2-using-nextauth-js/
