In this project, we will buid an authentication system for Next.js using clerk. It can also be used with React SPAs and Remix.
Visit Clerk:
https://clerk.com
Project Code:
https://github.com/bradtraversy/clerk-app
Clerk Docs:
Main: https://clerk.com/docs
Next.js: https://clerk.com/docs/nextjs/get-started-with-nextjs
React: https://clerk.com/docs/quickstarts/get-started-with-create-react-app
Remix: https://clerk.com/docs/quickstarts/get-started-with-remix
Follow Clerk On Twitter:
https://twitter.com/ClerkDev
Timestamps:
0:00 - Intro
1:22 - Project Demo
5:07 - Next.js Setup
7:43 - Install & Setup Clerk
9:45 - Clerk Provider
12:24 - Header Component
17:23 - Protecting Pages - middleware.js
19:48 - .env routes
21:33 - Sign In Page
26:13 - Conditional Header Links
29:42 - UserButton Component
31:45 - UserProfile Component
33:35 - Email Signup & Verification Code
35:07 - Using Themes
37:13 - Start Custom Sign Up Flow
42:15 - Custom Form UI
44:29 - Handle Submit
46:35 - Email Verification
48:36 - Conclusion