
Clerk Has a Free API That Adds Authentication to React Apps in Under 5 Minutes
Clerk gives you pre-built auth components: sign-in, sign-up, user profile, organization management. Drop them in, they just work. Quick Start npm install @clerk/nextjs // app/layout.tsx import { ClerkProvider , SignInButton , UserButton } from ' @clerk/nextjs ' export default function Layout ({ children }) { return ( < ClerkProvider > < header > < SignInButton /> < UserButton /> </ header > { children } </ ClerkProvider > ) } That's it. You have sign-in, sign-up, user profile, and session management. Protect Routes import { auth } from ' @clerk/nextjs/server ' export default async function Dashboard () { const { userId } = await auth () if ( ! userId ) redirect ( ' /sign-in ' ) return < h1 > Welcome to your dashboard </ h1 > } User Metadata import { currentUser } from ' @clerk/nextjs/server ' const user = await currentUser () console . log ( user . firstName , user . emailAddresses [ 0 ]. emailAddress ) Organizations (Multi-Tenant) import { OrganizationSwitcher } from ' @clerk/nextjs '
Continue reading on Dev.to React
Opens in a new tab

