role based authentication system in nextjs 14/15 with lucai auth

lucia auth credentials

NextJS Authentication Made Easy with Lucai Auth: Multi User Roles Management - abtahi hasan

In this video, Level up Your NextJS App: Implementing Lucai Auth for Authentication and Multi User Roles Management system.

The complete guide to building your first Next.js 14 application! Next.js is a popular JavaScript framework that provides high-performance and alternative routing configuration for modern web applications. Through this video, you will gain comprehensive knowledge about the methods of building Next.js applications.


✅ next js playlist https://youtube.com/playlist?list=PLaFV1330_fr470GrayeBa5yxu8FGaZbQt

✅ next js authentication playlist https://youtube.com/playlist?list=PLaFV1330_fr6XmIR6VkIPi55t9ZzX5mbC

✅next js project playlist https://www.youtube.com/playlist?list=PLaFV1330_fr6OzxdWOPUef_u8CtNP7-yg


Key Features:

  • how to create login system in next js
  • how to config credentials login system in lucia auth
  • how to setpu prisma in next js latest version
  • create model in prisma
  • how to create role based authentication system
  • learn next js server actions

📽️ Timestamps:

  • 00:00 project overview
  • 03:10 next js 14 installation
  • 05:06 setup shadcn
  • 06:17 setup prisma with postgres in next js latest version
  • 08:22 setup user and session model
  • 10:42 set up credentials system in lucia auth configuration
  • 26:57 get user data function for server action and server components
  • 38:44 set up login sign up and logout with next js server action
  • 01:10:22 create sign up page and configuration sign up server action with shadcn form with zod validation
  • 01:32:04 fixed password hashing error
  • 01:37:15 create auth Protected route wrapper for only logged in server
  • 01:41:40 create login page and configuration sign up server action with shadcn form with zod validation
  • 01:46:59 create multiple roles based authentication system (user, admin)
  • 01:52:52 update auth Protected route wrapper for multiple roles
  • 01:59:05 create hooks for getting user data in client components

    Source Code

    Commands

    1. npm i @node-rs/argon2 @prisma/client @lucia-auth/adapter-prisma @hookform/resolvers lucia lucide-react prisma zod
    2. yarn add @node-rs/argon2 @prisma/client @lucia-auth/adapter-prisma @hookform/resolvers lucia lucide-react prisma zod
    3. pnpm add @node-rs/argon2 @prisma/client @lucia-auth/adapter-prisma @hookform/resolvers lucia lucide-react prisma zod
    4. npx prisma init

    Next Steps

    1. for db push "npx prisma db push"

    Comments(0)