clerk

โดย clerk

เราเตอร์อัจฉริยะที่กำหนดเส้นทางงานการตรวจสอบสิทธิ์ไปยังทักษะ Clerk เฉพาะทางตามเฟรมเวิร์กและกรณีการใช้งานของคุณ กำหนดเส้นทางไปยังทักษะเฉพาะทางแปดทักษะครอบคลุมการตั้งค่า UI ที่กำหนดเอง รูปแบบ Next.js องค์กร webhooks การทดสอบ iOS/Android ดั้งเดิม และ API ฝั่งแบ็กเอนด์ ตรวจจับเวอร์ชัน Clerk SDK (Core 2 LTS เทียบกับเวอร์ชันปัจจุบัน) จาก package.json เพื่อใช้รูปแบบและ API ที่ถูกต้อง ครอบคลุมเว็บเฟรมเวิร์ก (Next.js, React, Expo, React Router, TanStack Start) และแพลตฟอร์มดั้งเดิม (Swift/iOS, Kotlin/Android)...

npx skills add https://github.com/clerk/skills --skill clerk

Clerk Skills Router

Version Detection

Check package.json to determine the Clerk SDK version. This determines which patterns to use:

PackageCore 2 (LTS until Jan 2027)Current
@clerk/nextjsv5–v6v7+
@clerk/react or @clerk/clerk-reactv5–v6v7+
@clerk/expo or @clerk/clerk-expov1–v2v3+
@clerk/react-routerv1–v2v3+
@clerk/tanstack-react-start< v0.26.0v0.26.0+

Default to current if the version is unclear or the project is new. Core 2 packages use @clerk/clerk-react and @clerk/clerk-expo (with clerk- prefix); current packages use @clerk/react and @clerk/expo.

All skills are written for the current SDK. When something differs in Core 2, it's noted inline with > **Core 2 ONLY (skip if current SDK):** callouts. The exception is clerk-custom-ui, which has separate core-2/ and core-3/ directories for custom flow hooks since those APIs are entirely different between versions.


By Task

Adding Clerk to your project → Use clerk-setup

  • Framework detection and quickstart
  • Environment setup, API keys, Keyless flow
  • Migration from other auth providers

Operating Clerk from the CLI → Use clerk-cli

  • Auth, linking, doctor, and environment pulls
  • User, org, session, app, and instance management
  • Impersonating a user (clerk impersonate) and local webhook testing (clerk webhooks listen)
  • Feature toggles (clerk enable orgs, clerk enable billing)
  • Backend, Platform, and Frontend API calls through clerk api
  • Deploy handoff and deploy status verification

Custom sign-in/sign-up UI → Use clerk-custom-ui

  • Custom authentication flows with useSignIn / useSignUp hooks
  • Appearance and styling (themes, colors, layout)
  • <Show> component for conditional rendering

Advanced Next.js patterns → Use clerk-nextjs-patterns

  • Server vs Client auth APIs
  • Middleware strategies
  • Server Actions, caching
  • API route protection

React patterns → Use clerk-react-patterns

  • Hooks (useAuth, useUser, useClerk)
  • Protected routes, auth guards
  • Router integration

React Router patterns → Use clerk-react-router-patterns

  • Loaders & actions with auth
  • Route protection
  • SSR auth

Vue patterns → Use clerk-vue-patterns

  • Composables (useAuth, useUser, useClerk)
  • Vue Router guards
  • Pinia auth store integration

Nuxt patterns → Use clerk-nuxt-patterns

  • Server middleware auth
  • SSR auth with composables
  • Server API routes

Astro patterns → Use clerk-astro-patterns

  • SSR auth pages
  • Island components with React
  • Middleware & API routes

TanStack Start patterns → Use clerk-tanstack-patterns

  • Server functions with auth
  • Route protection via loaders
  • Vinxi server integration

Expo / React Native auth → Use clerk-expo

  • Prebuilt native components (AuthView, UserButton)
  • Custom flows: email, password, SMS/phone OTP, MFA
  • OAuth/SSO and native Google/Apple sign-in
  • Expo Router protected routes, token storage, push notifications

Chrome Extension patterns → Use clerk-chrome-extension-patterns

  • Background scripts auth
  • Popup auth flows
  • Content scripts with sync host

B2B / Organizations → Use clerk-orgs

  • Multi-tenant apps
  • Organization slugs in URLs
  • Roles, permissions, RBAC
  • Member management

Billing & Subscriptions → Use clerk-billing

  • <PricingTable /> component
  • Plan and feature gating with has()
  • Seat-based B2B billing with organizations
  • Subscription lifecycle webhooks
  • Free trials, invoicing

Webhooks → Use clerk-webhooks

  • Real-time events
  • Data syncing
  • Notifications & integrations

E2E Testing → Use clerk-testing

  • Playwright/Cypress setup
  • Auth flow testing
  • Test utilities

Swift / native iOS auth → Use clerk-swift

  • Native iOS Swift and SwiftUI projects
  • ClerkKit and ClerkKitUI implementation guidance
  • Source-driven patterns from clerk-ios

Android / native mobile auth → Use clerk-android

  • Native Android Kotlin and Jetpack Compose projects
  • clerk-android-api and clerk-android-ui implementation guidance
  • Source-driven patterns from clerk-android
  • Do not use for Expo or React Native projects

Backend REST API → Use clerk-backend-api

  • Browse API tags and endpoints
  • Inspect endpoint schemas
  • Execute API requests with scope enforcement

Quick Navigation

If you know your task, you can directly access:

  • /clerk-setup - Framework setup
  • /clerk-cli - CLI operations and Clerk resource management
  • /clerk-custom-ui - Custom flows & appearance
  • /clerk-nextjs-patterns - Next.js patterns
  • /clerk-react-patterns - React patterns
  • /clerk-react-router-patterns - React Router patterns
  • /clerk-vue-patterns - Vue patterns
  • /clerk-nuxt-patterns - Nuxt patterns
  • /clerk-astro-patterns - Astro patterns
  • /clerk-tanstack-patterns - TanStack Start patterns
  • /clerk-expo - Expo / React Native
  • /clerk-chrome-extension-patterns - Chrome Extension patterns
  • /clerk-orgs - Organizations
  • /clerk-billing - Billing & subscriptions
  • /clerk-webhooks - Webhooks
  • /clerk-testing - Testing
  • /clerk-swift - Swift/native iOS
  • /clerk-android - Native Android
  • /clerk-backend-api - Backend REST API

Or describe what you need and I'll recommend the right one.

Skills เพิ่มเติมจาก clerk

clerk-monorepo
clerk
ทำงานอย่างมีประสิทธิภาพใน clerk/javascript SDK monorepo ใช้เมื่อตั้งค่า repo สร้าง / ทดสอบ / รันแพ็กเกจ ตัดสินใจว่า @clerk/* ตัวใด…
official
mosaic
clerk
Work on Mosaic UI: styling a component with slot recipes (`defineSlotRecipe` / `useRecipe` / slots / variants), or building a flow — authoring a state machine…
official
mosaic-machine
clerk
ผู้เขียนและใช้ Mosaic state machines ใช้เมื่อผู้ใช้กำลังเขียน state machine ด้วย createMachine, จำลองโฟลว์หลายขั้นตอน, เชื่อมต่อ machine กับ React…
official
clerk-android
clerk
Implement Clerk authentication for native Android apps using Kotlin and Jetpack Compose with clerk-android source-guided patterns. Use for prebuilt…
official
clerk-astro-patterns
clerk
รูปแบบ Astro กับ Clerk — middleware, หน้า SSR, คอมโพเนนต์ island, เส้นทาง API, การเรนเดอร์แบบ static เทียบกับ SSR. 触发เมื่อ: astro clerk, clerk astro middleware,…
official
clerk-backend-api
clerk
เครื่องมือสำรวจและดำเนินการ Clerk Backend REST API เรียกดูแท็ก ตรวจสอบสคีมาของเอนด์พอยต์ และดำเนินการคำขอที่ผ่านการรับรองความถูกต้อง ใช้เมื่อแสดงรายการผู้ใช้ จัดการ…
official
clerk-chrome-extension-patterns
clerk
การรับรองความถูกต้องของ Chrome Extension ด้วย @clerk/chrome-extension -- การตั้งค่า popup/sidepanel, syncHost สำหรับ OAuth/SAML ผ่านเว็บแอป, createClerkClient สำหรับ service workers และ…
official
clerk-cli
clerk
Operate the Clerk CLI (`clerk` binary) for authentication, user/org/session management, impersonation, local webhook testing, deploy verification, instance…
official