Clerk Auth v5 Complete Guide with Next.js 15 | Routes Protection | Connect Clerk with Databases

Опубликовано: 11 Октябрь 2024
на канале: Programming with Umair

4,641

154

In this tutorial, you will learn how to configure clerk auth v5 in next.js 15 project.
I will teach you how to build nice UI, create custom auth pages, manage user sessions, protect routes, fetch user data in server and client components, protect apis, route protection with next.js middleware file and mostly importantly how to connect clerk auth with databases using web hooks and mongodb.

00:03 Demo of Clerk Auth in Next.js
04:41 Create new Next.js project
05:20 Create project on Clerk dashboard
06:10 Configure clerk in next.js
11:33 Custom sign-in sign-up routes
16:40 Add Clerk page loader
18:05 Build navbar22:20 Detect user session
26:15 Clerk theming
28:30 Create profile route
30:45 Protect server component
36:10 User data in client component
38:00 Protect routes with middleware
43:35 Protect api routes
47:45 Install mongodb and mongoose
48:55 Create mongoose user modal
52:00 Connect to database
56:45 Create project on mongo atlas
01:03:20 Create clerk webhook api
01:08:10 Create user in mongodb
01:10:55 Create user created webhook
01:14:45 Deploy next.js app
01:18:35 Test user created
01:20:03 ngrok

#clerk #nextjs14 #database #nextjs

Follow Whatsapp Channel:
https://whatsapp.com/channel/0029Va7y...

React tutorials:
   • React.js Tutorials

JavaScript Tutorials and Projects:
   • JavaScript Tutorial and Projects

Angular Tutorials:
   • Angular 16 Life Cycle Hooks - Explain...

Docker Tutorials & CI/CD:
   • Docker Tutorials & CI/CD

Angular 16 Crash Course For Beginners:
   • Angular 16 Crash Course

Tech Tutorials - Random:
   • Postman Tutorial - Testing APIs and B...

Complete Next.js 13 Tutorials:    • Next.js 13 Tutorials - App Directory

Next.js 14 Tutorials:
   • Next.js 14 Tutorials - App Directory

Node Express MongoDB Bootcamp:    • Build REST API with Node Express MongoDB

ChatGPT Tutorials:    • ChatGPT

Join our facebook group:
  / 996305460498149

Github Repo (Give it a Star):
https://github.com/umairjameel321/cle...

Contact us for development services:
  / umair-jameel-24aa5368