clerk-reference-architecture

Featured

Reference architecture patterns for Clerk authentication. Use when designing application architecture, planning auth flows, or implementing enterprise-grade authentication. Trigger with phrases like "clerk architecture", "clerk design", "clerk system design", "clerk integration patterns".

AI & Automation 2,266 stars 315 forks Updated today MIT

Install

View on GitHub

Quality Score: 99/100

Stars 20%
100
Recency 20%
100
Frontmatter 20%
70
Documentation 15%
100
Issue Health 10%
50
License 10%
100
Description 5%
100

Skill Content

# Clerk Reference Architecture ## Overview Reference architectures for implementing Clerk in common application patterns: Next.js full-stack, microservices with shared auth, multi-tenant SaaS, and mobile + web with shared backend. ## Prerequisites - Understanding of web application architecture - Familiarity with authentication patterns (JWT, sessions, OAuth) - Knowledge of your tech stack and scaling requirements ## Instructions ### Architecture 1: Next.js Full-Stack Application ``` Browser │ ├─▸ Next.js Middleware (clerkMiddleware) │ └─▸ Validates session token on every request │ ├─▸ Server Components (auth(), currentUser()) │ └─▸ Direct access to user data, no network call │ ├─▸ Client Components (useUser(), useAuth()) │ └─▸ Real-time auth state via ClerkProvider │ ├─▸ API Routes (auth() for userId, getToken() for JWT) │ └─▸ Call external services with Clerk JWT │ └─▸ Webhooks (/api/webhooks/clerk) └─▸ Sync user data to database ``` ```typescript // app/layout.tsx — entry point import { ClerkProvider } from '@clerk/nextjs' export default function RootLayout({ children }: { children: React.ReactNode }) { return ( <ClerkProvider> <html><body>{children}</body></html> </ClerkProvider> ) } ``` ```typescript // middleware.ts — auth boundary import { clerkMiddleware, createRouteMatcher } from '@clerk/nextjs/server' const isPublic = createRouteMatcher(['/', '/sign-in(.*)', '/sign-up(.*)', '/api/webhooks(...

Details

Author
jeremylongshore
Repository
jeremylongshore/claude-code-plugins-plus-skills
Created
7 months ago
Last Updated
today
Language
Python
License
MIT

Integrates with

Anthropic · AI Next.js · Frontend Clerk · Auth

Similar Skills

Semantically similar based on skill content — not just same category

AI & Automation Featured

clerk-auth

Expert patterns for Clerk auth implementation, middleware, organizations, webhooks, and user sync

39,227 Updated today
sickn33
AI & Automation Featured

clerk-sdk-patterns

Common Clerk SDK patterns and best practices. Use when implementing authentication flows, accessing user data, or integrating Clerk SDK methods in your application. Trigger with phrases like "clerk SDK", "clerk patterns", "clerk best practices", "clerk API usage".

2,266 Updated today
jeremylongshore
API & Backend Solid

clerk-auth

Expert patterns for Clerk auth implementation, middleware, organizations, webhooks, and user sync Use when: adding authentication, clerk auth, user authentication, sign in, sign up.

27,681 Updated today
davila7
API & Backend Listed

clerk-auth

Expert patterns for Clerk auth implementation, middleware, organizations, webhooks, and user sync Use when: adding authentication, clerk auth, user authentication, sign in, sign up.

335 Updated today
aiskillstore
AI & Automation Featured

clerk-security-basics

Implement security best practices with Clerk authentication. Use when securing your application, reviewing auth implementation, or hardening Clerk configuration. Trigger with phrases like "clerk security", "secure clerk", "clerk best practices", "clerk hardening".

2,266 Updated today
jeremylongshore