mirror of
https://github.com/clerk/skills.git
synced 2026-09-14 16:01:43 +08:00
feat/add-skill-restructure
- Remove separate gotchas.md files (6 deleted) - Add concise Common Pitfalls section to each SKILL.md - Keep only essential pitfalls (3-5 per skill)
Clerk Skills
Auth expertise for AI coding agents.
Install
npx add-skill clerk/skills
Supports 15 agents: Claude Code, Cursor, OpenCode, Windsurf, Gemini CLI, GitHub Copilot, Aider, and more.
Alternative Installation
# Using Vercel's skills CLI
npx skills add clerk/skills
# Manual (Claude Code)
git clone https://github.com/clerk/skills ~/.claude/skills/clerk
Skills
| Skill | Purpose | Trigger Keywords |
|---|---|---|
adding-auth |
Add Clerk to any framework | setup, integrate, sign-in |
customizing-auth-ui |
Custom sign-in/up flows | custom UI, forms, hooks |
syncing-users |
Webhook → DB sync | sync, webhook, Prisma, Drizzle |
testing-auth |
E2E auth testing | test, Playwright, Cypress |
managing-orgs |
Multi-tenant B2B | org, team, RBAC |
nextjs-patterns |
Advanced Next.js patterns | middleware, Server Actions |
ios (coming soon) |
iOS/watchOS auth | ClerkKit, ClerkKitUI, SwiftUI |
Quick Start
1. Get API Keys
Get your keys from the Clerk Dashboard → API Keys.
2. Set Environment Variables
NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_test_xxx
CLERK_SECRET_KEY=sk_test_xxx
3. Ask Your Agent
| You Say | Skill Used |
|---|---|
| "Add Clerk auth to my Next.js app" | adding-auth |
| "Build custom sign-in form with hooks" | customizing-auth-ui |
| "Sync users to Prisma via webhooks" | syncing-users |
| "Add Playwright tests for auth" | testing-auth |
| "Set up organizations for B2B" | managing-orgs |
| "Add Clerk to my iOS app" (coming soon) | ios |
Repository Structure
clerk-skills/
├── skills/
│ ├── SKILL.md # Master skill (decision trees)
│ ├── adding-auth/
│ │ ├── SKILL.md
│ │ ├── gotchas.md # Common pitfalls
│ │ └── templates/
│ ├── customizing-auth-ui/
│ ├── syncing-users/
│ ├── testing-auth/
│ ├── managing-orgs/
│ ├── nextjs-patterns/
│ │ ├── SKILL.md
│ │ └── references/ # Detailed pattern docs
│ └── ios/ # iOS/watchOS auth (coming soon)
├── commands/
│ └── clerk.md # /clerk command
└── README.md
Using /clerk Command
For agents that support slash commands (Claude Code, OpenCode):
/clerk add auth to my Express app
/clerk sync users to Supabase
/clerk fix "redirect_uri_mismatch" error
Resources
Request a Skill
Don't see what you need? Request a skill.
License
MIT
Description
clerk-setup: Add Clerk authentication to any project by following the official quickstart guides.; clerk-custom-ui: Custom authentication flows and component appearance - hooks (useSignIn, useSignUp), themes, colors, fonts, CSS. Use for custom sign-in/sign-up flows,…; clerk-nextjs-patterns: Advanced Next.js patterns - middleware, Server Actions, caching with Clerk.; clerk-setup: Add Clerk authentication to any project by following the official quickstart guides.; clerk-custom-ui: Custom authent…
Languages
Shell
55.1%
TypeScript
34.9%
Astro
3%
JavaScript
2.5%
HTML
2.3%
Other
2.2%