# Clerk
> Clerk authentication for modern apps. Use for user management. Use when this capability is needed.
- Skill: `tomevault-io/clerk-2` (Agent Skill, multi-file: 2 files)
- Install (CLI): `npx skillmds@latest add tomevault-io/clerk-2`
- Raw SKILL.md: https://api.skillmd.com/api/skills/tomevault-io/clerk-2/raw
- Safety review: pending (external: skill-scanner PASS, skillspector PASS)
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: AI & ML
- Author: tomevault-io (https://skillmd.com/u/tomevault-io)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/tomevault-io/clerk-2
---
# Clerk
Clerk is a comprehensive user management and authentication service built specifically for the modern web (React, Next.js, Remix). It focuses on providing "Drop-in" UI components (``, ``) rather than just APIs.
## When to Use
- **Next.js / React Apps**: Best-in-class integration with App Router and Server Components.
- **SaaS B2B/B2C**: Built-in Organization (Multi-tenancy) management.
- **Speed**: You want the User Profile, Avatar upload, and Email management UI done for you.
## Quick Start (Next.js App Router)
```typescript
// middleware.ts
import { authMiddleware } from "@clerk/nextjs";
export default authMiddleware({});
// layout.tsx
import { ClerkProvider } from '@clerk/nextjs'
export default function RootLayout({ children }) {
return (
{children}
)
}
// page.tsx (Protected)
import { UserButton, currentUser } from "@clerk/nextjs";
export default async function Page() {
const user = await currentUser();
if (!user) return Not signed in
;
return ;
}
```
## Core Concepts
### Pre-built Components
Clerk provides the full UI: Login, Register, Forgot Password, Managed MFA, User Profile (Change Password, 2FA, Sessions).
### Sessions vs Tokens
Clerk handles the complexity of short-lived JWTs (`__session` cookie) and keeps them fresh automatically via frontend SDKs.
## Best Practices (2025)
**Do**:
- Use **Server Components** (`currentUser()`) to fetch user data on the backend.
- Use **Organizations** feature for B2B SaaS apps (Tenant isolation).
- Enable **Passkeys** (Passwordless) in the dashboard (Clerk supports this natively).
**Don't**:
- Don't try to build custom UI unless necessary. The pre-built components handle edge cases (MFA, Captcha, Error states) perfectly.
- Don't expose Secret Keys in client-side env vars.
## Troubleshooting
| Error | Cause | Solution |
| :----------------- | :------------------------- | :-------------------------------------------------------- |
| `401 Unauthorized` | Middleware not configured. | Ensure `middleware.ts` matches all routes (`/((?!...))`). |
| `Hydration Error` | HTML mismatch. | Wrap app in ``. |
## References
- [Clerk Documentation](https://clerk.com/docs)
- [Clerk vs Auth0](https://clerk.com/vs/auth0)
---
> Converted and distributed by [TomeVault](https://tomevault.io/claim/g1joshi) — claim your Tome and manage your conversions.